From cf5babc5c0561e37dde2fc19a65e064b8a319c08 Mon Sep 17 00:00:00 2001 From: Sarmaged <3858245+Sarmaged@users.noreply.github.com> Date: Wed, 22 Jan 2025 18:11:22 +0300 Subject: [PATCH] release: version 2025.1.22 --- colors.css | 4 +- package.json | 2 +- src/colors/10/aliceblue.css | 50 +++++++------- src/colors/10/antiquewhite.css | 50 +++++++------- src/colors/10/aqua.css | 50 +++++++------- src/colors/10/aquamarine.css | 50 +++++++------- src/colors/10/azure.css | 50 +++++++------- src/colors/10/beige.css | 50 +++++++------- src/colors/10/bisque.css | 50 +++++++------- src/colors/10/black.css | 50 +++++++------- src/colors/10/blanchedalmond.css | 50 +++++++------- src/colors/10/blue.css | 50 +++++++------- src/colors/10/blueviolet.css | 50 +++++++------- src/colors/10/brown.css | 50 +++++++------- src/colors/10/burlywood.css | 50 +++++++------- src/colors/10/cadetblue.css | 50 +++++++------- src/colors/10/chartreuse.css | 50 +++++++------- src/colors/10/chocolate.css | 50 +++++++------- src/colors/10/coral.css | 50 +++++++------- src/colors/10/cornflowerblue.css | 50 +++++++------- src/colors/10/cornsilk.css | 50 +++++++------- src/colors/10/crimson.css | 50 +++++++------- src/colors/10/cyan.css | 50 +++++++------- src/colors/10/darkblue.css | 50 +++++++------- src/colors/10/darkcyan.css | 50 +++++++------- src/colors/10/darkgoldenrod.css | 50 +++++++------- src/colors/10/darkgray.css | 50 +++++++------- src/colors/10/darkgreen.css | 50 +++++++------- src/colors/10/darkgrey.css | 50 +++++++------- src/colors/10/darkkhaki.css | 50 +++++++------- src/colors/10/darkmagenta.css | 50 +++++++------- src/colors/10/darkolivegreen.css | 50 +++++++------- src/colors/10/darkorange.css | 50 +++++++------- src/colors/10/darkorchid.css | 50 +++++++------- src/colors/10/darkred.css | 50 +++++++------- src/colors/10/darksalmon.css | 50 +++++++------- src/colors/10/darkseagreen.css | 50 +++++++------- src/colors/10/darkslateblue.css | 50 +++++++------- src/colors/10/darkslategray.css | 50 +++++++------- src/colors/10/darkslategrey.css | 50 +++++++------- src/colors/10/darkturquoise.css | 50 +++++++------- src/colors/10/darkviolet.css | 50 +++++++------- src/colors/10/deeppink.css | 50 +++++++------- src/colors/10/deepskyblue.css | 50 +++++++------- src/colors/10/dimgray.css | 50 +++++++------- src/colors/10/dimgrey.css | 50 +++++++------- src/colors/10/dodgerblue.css | 50 +++++++------- src/colors/10/firebrick.css | 50 +++++++------- src/colors/10/floralwhite.css | 50 +++++++------- src/colors/10/forestgreen.css | 50 +++++++------- src/colors/10/fuchsia.css | 50 +++++++------- src/colors/10/gainsboro.css | 50 +++++++------- src/colors/10/ghostwhite.css | 50 +++++++------- src/colors/10/gold.css | 50 +++++++------- src/colors/10/goldenrod.css | 50 +++++++------- src/colors/10/gray.css | 50 +++++++------- src/colors/10/green.css | 50 +++++++------- src/colors/10/greenyellow.css | 50 +++++++------- src/colors/10/grey.css | 50 +++++++------- src/colors/10/honeydew.css | 50 +++++++------- src/colors/10/hotpink.css | 50 +++++++------- src/colors/10/indianred.css | 50 +++++++------- src/colors/10/indigo.css | 50 +++++++------- src/colors/10/ivory.css | 50 +++++++------- src/colors/10/khaki.css | 50 +++++++------- src/colors/10/lavender.css | 50 +++++++------- src/colors/10/lavenderblush.css | 50 +++++++------- src/colors/10/lawngreen.css | 50 +++++++------- src/colors/10/lemonchiffon.css | 50 +++++++------- src/colors/10/lightblue.css | 50 +++++++------- src/colors/10/lightcoral.css | 50 +++++++------- src/colors/10/lightcyan.css | 50 +++++++------- src/colors/10/lightgoldenrodyellow.css | 50 +++++++------- src/colors/10/lightgray.css | 50 +++++++------- src/colors/10/lightgreen.css | 50 +++++++------- src/colors/10/lightgrey.css | 50 +++++++------- src/colors/10/lightpink.css | 50 +++++++------- src/colors/10/lightsalmon.css | 50 +++++++------- src/colors/10/lightseagreen.css | 50 +++++++------- src/colors/10/lightskyblue.css | 50 +++++++------- src/colors/10/lightslategray.css | 50 +++++++------- src/colors/10/lightslategrey.css | 50 +++++++------- src/colors/10/lightsteelblue.css | 50 +++++++------- src/colors/10/lightyellow.css | 50 +++++++------- src/colors/10/lime.css | 50 +++++++------- src/colors/10/limegreen.css | 50 +++++++------- src/colors/10/linen.css | 50 +++++++------- src/colors/10/magenta.css | 50 +++++++------- src/colors/10/maroon.css | 50 +++++++------- src/colors/10/mediumaquamarine.css | 50 +++++++------- src/colors/10/mediumblue.css | 50 +++++++------- src/colors/10/mediumorchid.css | 50 +++++++------- src/colors/10/mediumpurple.css | 50 +++++++------- src/colors/10/mediumseagreen.css | 50 +++++++------- src/colors/10/mediumslateblue.css | 50 +++++++------- src/colors/10/mediumspringgreen.css | 50 +++++++------- src/colors/10/mediumturquoise.css | 50 +++++++------- src/colors/10/mediumvioletred.css | 50 +++++++------- src/colors/10/midnightblue.css | 50 +++++++------- src/colors/10/mintcream.css | 50 +++++++------- src/colors/10/mistyrose.css | 50 +++++++------- src/colors/10/moccasin.css | 50 +++++++------- src/colors/10/navajowhite.css | 50 +++++++------- src/colors/10/navy.css | 50 +++++++------- src/colors/10/oldlace.css | 50 +++++++------- src/colors/10/olive.css | 50 +++++++------- src/colors/10/olivedrab.css | 50 +++++++------- src/colors/10/orange.css | 50 +++++++------- src/colors/10/orangered.css | 50 +++++++------- src/colors/10/orchid.css | 50 +++++++------- src/colors/10/palegoldenrod.css | 50 +++++++------- src/colors/10/palegreen.css | 50 +++++++------- src/colors/10/paleturquoise.css | 50 +++++++------- src/colors/10/palevioletred.css | 50 +++++++------- src/colors/10/papayawhip.css | 50 +++++++------- src/colors/10/peachpuff.css | 50 +++++++------- src/colors/10/peru.css | 50 +++++++------- src/colors/10/pink.css | 50 +++++++------- src/colors/10/plum.css | 50 +++++++------- src/colors/10/powderblue.css | 50 +++++++------- src/colors/10/purple.css | 50 +++++++------- src/colors/10/rebeccapurple.css | 50 +++++++------- src/colors/10/red.css | 50 +++++++------- src/colors/10/rosybrown.css | 50 +++++++------- src/colors/10/royalblue.css | 50 +++++++------- src/colors/10/saddlebrown.css | 50 +++++++------- src/colors/10/salmon.css | 50 +++++++------- src/colors/10/sandybrown.css | 50 +++++++------- src/colors/10/seagreen.css | 50 +++++++------- src/colors/10/seashell.css | 50 +++++++------- src/colors/10/sienna.css | 50 +++++++------- src/colors/10/silver.css | 50 +++++++------- src/colors/10/skyblue.css | 50 +++++++------- src/colors/10/slateblue.css | 50 +++++++------- src/colors/10/slategray.css | 50 +++++++------- src/colors/10/slategrey.css | 50 +++++++------- src/colors/10/snow.css | 50 +++++++------- src/colors/10/springgreen.css | 50 +++++++------- src/colors/10/steelblue.css | 50 +++++++------- src/colors/10/tan.css | 50 +++++++------- src/colors/10/teal.css | 50 +++++++------- src/colors/10/thistle.css | 50 +++++++------- src/colors/10/tomato.css | 50 +++++++------- src/colors/10/turquoise.css | 50 +++++++------- src/colors/10/violet.css | 50 +++++++------- src/colors/10/wheat.css | 50 +++++++------- src/colors/10/white.css | 50 +++++++------- src/colors/10/whitesmoke.css | 50 +++++++------- src/colors/10/yellow.css | 50 +++++++------- src/colors/10/yellowgreen.css | 50 +++++++------- src/colors/20/aliceblue.css | 90 +++++++++++++------------- src/colors/20/antiquewhite.css | 90 +++++++++++++------------- src/colors/20/aqua.css | 90 +++++++++++++------------- src/colors/20/aquamarine.css | 90 +++++++++++++------------- src/colors/20/azure.css | 90 +++++++++++++------------- src/colors/20/beige.css | 90 +++++++++++++------------- src/colors/20/bisque.css | 90 +++++++++++++------------- src/colors/20/black.css | 90 +++++++++++++------------- src/colors/20/blanchedalmond.css | 90 +++++++++++++------------- src/colors/20/blue.css | 90 +++++++++++++------------- src/colors/20/blueviolet.css | 90 +++++++++++++------------- src/colors/20/brown.css | 90 +++++++++++++------------- src/colors/20/burlywood.css | 90 +++++++++++++------------- src/colors/20/cadetblue.css | 90 +++++++++++++------------- src/colors/20/chartreuse.css | 90 +++++++++++++------------- src/colors/20/chocolate.css | 90 +++++++++++++------------- src/colors/20/coral.css | 90 +++++++++++++------------- src/colors/20/cornflowerblue.css | 90 +++++++++++++------------- src/colors/20/cornsilk.css | 90 +++++++++++++------------- src/colors/20/crimson.css | 90 +++++++++++++------------- src/colors/20/cyan.css | 90 +++++++++++++------------- src/colors/20/darkblue.css | 90 +++++++++++++------------- src/colors/20/darkcyan.css | 90 +++++++++++++------------- src/colors/20/darkgoldenrod.css | 90 +++++++++++++------------- src/colors/20/darkgray.css | 90 +++++++++++++------------- src/colors/20/darkgreen.css | 90 +++++++++++++------------- src/colors/20/darkgrey.css | 90 +++++++++++++------------- src/colors/20/darkkhaki.css | 90 +++++++++++++------------- src/colors/20/darkmagenta.css | 90 +++++++++++++------------- src/colors/20/darkolivegreen.css | 90 +++++++++++++------------- src/colors/20/darkorange.css | 90 +++++++++++++------------- src/colors/20/darkorchid.css | 90 +++++++++++++------------- src/colors/20/darkred.css | 90 +++++++++++++------------- src/colors/20/darksalmon.css | 90 +++++++++++++------------- src/colors/20/darkseagreen.css | 90 +++++++++++++------------- src/colors/20/darkslateblue.css | 90 +++++++++++++------------- src/colors/20/darkslategray.css | 90 +++++++++++++------------- src/colors/20/darkslategrey.css | 90 +++++++++++++------------- src/colors/20/darkturquoise.css | 90 +++++++++++++------------- src/colors/20/darkviolet.css | 90 +++++++++++++------------- src/colors/20/deeppink.css | 90 +++++++++++++------------- src/colors/20/deepskyblue.css | 90 +++++++++++++------------- src/colors/20/dimgray.css | 90 +++++++++++++------------- src/colors/20/dimgrey.css | 90 +++++++++++++------------- src/colors/20/dodgerblue.css | 90 +++++++++++++------------- src/colors/20/firebrick.css | 90 +++++++++++++------------- src/colors/20/floralwhite.css | 90 +++++++++++++------------- src/colors/20/forestgreen.css | 90 +++++++++++++------------- src/colors/20/fuchsia.css | 90 +++++++++++++------------- src/colors/20/gainsboro.css | 90 +++++++++++++------------- src/colors/20/ghostwhite.css | 90 +++++++++++++------------- src/colors/20/gold.css | 90 +++++++++++++------------- src/colors/20/goldenrod.css | 90 +++++++++++++------------- src/colors/20/gray.css | 90 +++++++++++++------------- src/colors/20/green.css | 90 +++++++++++++------------- src/colors/20/greenyellow.css | 90 +++++++++++++------------- src/colors/20/grey.css | 90 +++++++++++++------------- src/colors/20/honeydew.css | 90 +++++++++++++------------- src/colors/20/hotpink.css | 90 +++++++++++++------------- src/colors/20/indianred.css | 90 +++++++++++++------------- src/colors/20/indigo.css | 90 +++++++++++++------------- src/colors/20/ivory.css | 90 +++++++++++++------------- src/colors/20/khaki.css | 90 +++++++++++++------------- src/colors/20/lavender.css | 90 +++++++++++++------------- src/colors/20/lavenderblush.css | 90 +++++++++++++------------- src/colors/20/lawngreen.css | 90 +++++++++++++------------- src/colors/20/lemonchiffon.css | 90 +++++++++++++------------- src/colors/20/lightblue.css | 90 +++++++++++++------------- src/colors/20/lightcoral.css | 90 +++++++++++++------------- src/colors/20/lightcyan.css | 90 +++++++++++++------------- src/colors/20/lightgoldenrodyellow.css | 90 +++++++++++++------------- src/colors/20/lightgray.css | 90 +++++++++++++------------- src/colors/20/lightgreen.css | 90 +++++++++++++------------- src/colors/20/lightgrey.css | 90 +++++++++++++------------- src/colors/20/lightpink.css | 90 +++++++++++++------------- src/colors/20/lightsalmon.css | 90 +++++++++++++------------- src/colors/20/lightseagreen.css | 90 +++++++++++++------------- src/colors/20/lightskyblue.css | 90 +++++++++++++------------- src/colors/20/lightslategray.css | 90 +++++++++++++------------- src/colors/20/lightslategrey.css | 90 +++++++++++++------------- src/colors/20/lightsteelblue.css | 90 +++++++++++++------------- src/colors/20/lightyellow.css | 90 +++++++++++++------------- src/colors/20/lime.css | 90 +++++++++++++------------- src/colors/20/limegreen.css | 90 +++++++++++++------------- src/colors/20/linen.css | 90 +++++++++++++------------- src/colors/20/magenta.css | 90 +++++++++++++------------- src/colors/20/maroon.css | 90 +++++++++++++------------- src/colors/20/mediumaquamarine.css | 90 +++++++++++++------------- src/colors/20/mediumblue.css | 90 +++++++++++++------------- src/colors/20/mediumorchid.css | 90 +++++++++++++------------- src/colors/20/mediumpurple.css | 90 +++++++++++++------------- src/colors/20/mediumseagreen.css | 90 +++++++++++++------------- src/colors/20/mediumslateblue.css | 90 +++++++++++++------------- src/colors/20/mediumspringgreen.css | 90 +++++++++++++------------- src/colors/20/mediumturquoise.css | 90 +++++++++++++------------- src/colors/20/mediumvioletred.css | 90 +++++++++++++------------- src/colors/20/midnightblue.css | 90 +++++++++++++------------- src/colors/20/mintcream.css | 90 +++++++++++++------------- src/colors/20/mistyrose.css | 90 +++++++++++++------------- src/colors/20/moccasin.css | 90 +++++++++++++------------- src/colors/20/navajowhite.css | 90 +++++++++++++------------- src/colors/20/navy.css | 90 +++++++++++++------------- src/colors/20/oldlace.css | 90 +++++++++++++------------- src/colors/20/olive.css | 90 +++++++++++++------------- src/colors/20/olivedrab.css | 90 +++++++++++++------------- src/colors/20/orange.css | 90 +++++++++++++------------- src/colors/20/orangered.css | 90 +++++++++++++------------- src/colors/20/orchid.css | 90 +++++++++++++------------- src/colors/20/palegoldenrod.css | 90 +++++++++++++------------- src/colors/20/palegreen.css | 90 +++++++++++++------------- src/colors/20/paleturquoise.css | 90 +++++++++++++------------- src/colors/20/palevioletred.css | 90 +++++++++++++------------- src/colors/20/papayawhip.css | 90 +++++++++++++------------- src/colors/20/peachpuff.css | 90 +++++++++++++------------- src/colors/20/peru.css | 90 +++++++++++++------------- src/colors/20/pink.css | 90 +++++++++++++------------- src/colors/20/plum.css | 90 +++++++++++++------------- src/colors/20/powderblue.css | 90 +++++++++++++------------- src/colors/20/purple.css | 90 +++++++++++++------------- src/colors/20/rebeccapurple.css | 90 +++++++++++++------------- src/colors/20/red.css | 90 +++++++++++++------------- src/colors/20/rosybrown.css | 90 +++++++++++++------------- src/colors/20/royalblue.css | 90 +++++++++++++------------- src/colors/20/saddlebrown.css | 90 +++++++++++++------------- src/colors/20/salmon.css | 90 +++++++++++++------------- src/colors/20/sandybrown.css | 90 +++++++++++++------------- src/colors/20/seagreen.css | 90 +++++++++++++------------- src/colors/20/seashell.css | 90 +++++++++++++------------- src/colors/20/sienna.css | 90 +++++++++++++------------- src/colors/20/silver.css | 90 +++++++++++++------------- src/colors/20/skyblue.css | 90 +++++++++++++------------- src/colors/20/slateblue.css | 90 +++++++++++++------------- src/colors/20/slategray.css | 90 +++++++++++++------------- src/colors/20/slategrey.css | 90 +++++++++++++------------- src/colors/20/snow.css | 90 +++++++++++++------------- src/colors/20/springgreen.css | 90 +++++++++++++------------- src/colors/20/steelblue.css | 90 +++++++++++++------------- src/colors/20/tan.css | 90 +++++++++++++------------- src/colors/20/teal.css | 90 +++++++++++++------------- src/colors/20/thistle.css | 90 +++++++++++++------------- src/colors/20/tomato.css | 90 +++++++++++++------------- src/colors/20/turquoise.css | 90 +++++++++++++------------- src/colors/20/violet.css | 90 +++++++++++++------------- src/colors/20/wheat.css | 90 +++++++++++++------------- src/colors/20/white.css | 90 +++++++++++++------------- src/colors/20/whitesmoke.css | 90 +++++++++++++------------- src/colors/20/yellow.css | 90 +++++++++++++------------- src/colors/20/yellowgreen.css | 90 +++++++++++++------------- web.css | 4 +- 299 files changed, 10365 insertions(+), 10365 deletions(-) diff --git a/colors.css b/colors.css index 1f545b5..e1a2566 100644 --- a/colors.css +++ b/colors.css @@ -1,3 +1,3 @@ -/*! style-forge.colors 2025.1.18 | MIT License | https://github.com/Style-Forge/colors */ +/*! style-forge.colors 2025.1.22 | MIT License | https://github.com/Style-Forge/colors */ -:root{--sf-c-black:0 0% 0%;--sf-c-black-0:0 0% 0%;--sf-c-black-10:0 0% 10%;--sf-c-black-20:0 0% 20%;--sf-c-black-30:0 0% 30%;--sf-c-black-40:0 0% 40%;--sf-c-black-50:0 0% 50%;--sf-c-black-60:0 0% 60%;--sf-c-black-70:0 0% 70%;--sf-c-black-80:0 0% 80%;--sf-c-black-90:0 0% 90%;--sf-c-black-100:0 0% 100%;--sf-c-txt-black:var(--sf-c-black);--sf-c-txt-black-0:var(--sf-c-black-0);--sf-c-txt-black-10:var(--sf-c-black-10);--sf-c-txt-black-20:var(--sf-c-black-20);--sf-c-txt-black-30:var(--sf-c-black-30);--sf-c-txt-black-40:var(--sf-c-black-40);--sf-c-txt-black-50:var(--sf-c-black-50);--sf-c-txt-black-60:var(--sf-c-black-60);--sf-c-txt-black-70:var(--sf-c-black-70);--sf-c-txt-black-80:var(--sf-c-black-80);--sf-c-txt-black-90:var(--sf-c-black-90);--sf-c-txt-black-100:var(--sf-c-black-100);--sf-dark-c-black:0 0% 100%;--sf-dark-c-black-0:0 0% 0%;--sf-dark-c-black-10:0 0% 10%;--sf-dark-c-black-20:0 0% 20%;--sf-dark-c-black-30:0 0% 30%;--sf-dark-c-black-40:0 0% 40%;--sf-dark-c-black-50:0 0% 50%;--sf-dark-c-black-60:0 0% 60%;--sf-dark-c-black-70:0 0% 70%;--sf-dark-c-black-80:0 0% 80%;--sf-dark-c-black-90:0 0% 90%;--sf-dark-c-black-100:0 0% 100%;--sf-dark-c-txt-black:var(--sf-dark-c-black);--sf-dark-c-txt-black-0:var(--sf-dark-c-black-0);--sf-dark-c-txt-black-10:var(--sf-dark-c-black-10);--sf-dark-c-txt-black-20:var(--sf-dark-c-black-20);--sf-dark-c-txt-black-30:var(--sf-dark-c-black-30);--sf-dark-c-txt-black-40:var(--sf-dark-c-black-40);--sf-dark-c-txt-black-50:var(--sf-dark-c-black-50);--sf-dark-c-txt-black-60:var(--sf-dark-c-black-60);--sf-dark-c-txt-black-70:var(--sf-dark-c-black-70);--sf-dark-c-txt-black-80:var(--sf-dark-c-black-80);--sf-dark-c-txt-black-90:var(--sf-dark-c-black-90);--sf-dark-c-txt-black-100:var(--sf-dark-c-black-100);--sf-c-blue:240 100% 50%;--sf-c-blue-0:240 100% 0%;--sf-c-blue-10:240 100% 10%;--sf-c-blue-20:240 100% 20%;--sf-c-blue-30:240 100% 30%;--sf-c-blue-40:240 100% 40%;--sf-c-blue-50:240 100% 50%;--sf-c-blue-60:240 100% 60%;--sf-c-blue-70:240 100% 70%;--sf-c-blue-80:240 100% 80%;--sf-c-blue-90:240 100% 90%;--sf-c-blue-100:240 100% 100%;--sf-c-txt-blue:var(--sf-c-blue);--sf-c-txt-blue-0:var(--sf-c-blue-0);--sf-c-txt-blue-10:var(--sf-c-blue-10);--sf-c-txt-blue-20:var(--sf-c-blue-20);--sf-c-txt-blue-30:var(--sf-c-blue-30);--sf-c-txt-blue-40:var(--sf-c-blue-40);--sf-c-txt-blue-50:var(--sf-c-blue-50);--sf-c-txt-blue-60:var(--sf-c-blue-60);--sf-c-txt-blue-70:var(--sf-c-blue-70);--sf-c-txt-blue-80:var(--sf-c-blue-80);--sf-c-txt-blue-90:var(--sf-c-blue-90);--sf-c-txt-blue-100:var(--sf-c-blue-100);--sf-dark-c-blue:240 100% 50%;--sf-dark-c-blue-0:240 100% 0%;--sf-dark-c-blue-10:240 100% 10%;--sf-dark-c-blue-20:240 100% 20%;--sf-dark-c-blue-30:240 100% 30%;--sf-dark-c-blue-40:240 100% 40%;--sf-dark-c-blue-50:240 100% 50%;--sf-dark-c-blue-60:240 100% 60%;--sf-dark-c-blue-70:240 100% 70%;--sf-dark-c-blue-80:240 100% 80%;--sf-dark-c-blue-90:240 100% 90%;--sf-dark-c-blue-100:240 100% 100%;--sf-dark-c-txt-blue:var(--sf-dark-c-blue);--sf-dark-c-txt-blue-0:var(--sf-dark-c-blue-0);--sf-dark-c-txt-blue-10:var(--sf-dark-c-blue-10);--sf-dark-c-txt-blue-20:var(--sf-dark-c-blue-20);--sf-dark-c-txt-blue-30:var(--sf-dark-c-blue-30);--sf-dark-c-txt-blue-40:var(--sf-dark-c-blue-40);--sf-dark-c-txt-blue-50:var(--sf-dark-c-blue-50);--sf-dark-c-txt-blue-60:var(--sf-dark-c-blue-60);--sf-dark-c-txt-blue-70:var(--sf-dark-c-blue-70);--sf-dark-c-txt-blue-80:var(--sf-dark-c-blue-80);--sf-dark-c-txt-blue-90:var(--sf-dark-c-blue-90);--sf-dark-c-txt-blue-100:var(--sf-dark-c-blue-100);--sf-c-green:120 100% 25%;--sf-c-green-0:120 100% 0%;--sf-c-green-10:120 100% 10%;--sf-c-green-20:120 100% 20%;--sf-c-green-30:120 100% 30%;--sf-c-green-40:120 100% 40%;--sf-c-green-50:120 100% 50%;--sf-c-green-60:120 100% 60%;--sf-c-green-70:120 100% 70%;--sf-c-green-80:120 100% 80%;--sf-c-green-90:120 100% 90%;--sf-c-green-100:120 100% 100%;--sf-c-txt-green:var(--sf-c-green);--sf-c-txt-green-0:var(--sf-c-green-0);--sf-c-txt-green-10:var(--sf-c-green-10);--sf-c-txt-green-20:var(--sf-c-green-20);--sf-c-txt-green-30:var(--sf-c-green-30);--sf-c-txt-green-40:var(--sf-c-green-40);--sf-c-txt-green-50:var(--sf-c-green-50);--sf-c-txt-green-60:var(--sf-c-green-60);--sf-c-txt-green-70:var(--sf-c-green-70);--sf-c-txt-green-80:var(--sf-c-green-80);--sf-c-txt-green-90:var(--sf-c-green-90);--sf-c-txt-green-100:var(--sf-c-green-100);--sf-dark-c-green:120 100% 75%;--sf-dark-c-green-0:120 100% 0%;--sf-dark-c-green-10:120 100% 10%;--sf-dark-c-green-20:120 100% 20%;--sf-dark-c-green-30:120 100% 30%;--sf-dark-c-green-40:120 100% 40%;--sf-dark-c-green-50:120 100% 50%;--sf-dark-c-green-60:120 100% 60%;--sf-dark-c-green-70:120 100% 70%;--sf-dark-c-green-80:120 100% 80%;--sf-dark-c-green-90:120 100% 90%;--sf-dark-c-green-100:120 100% 100%;--sf-dark-c-txt-green:var(--sf-dark-c-green);--sf-dark-c-txt-green-0:var(--sf-dark-c-green-0);--sf-dark-c-txt-green-10:var(--sf-dark-c-green-10);--sf-dark-c-txt-green-20:var(--sf-dark-c-green-20);--sf-dark-c-txt-green-30:var(--sf-dark-c-green-30);--sf-dark-c-txt-green-40:var(--sf-dark-c-green-40);--sf-dark-c-txt-green-50:var(--sf-dark-c-green-50);--sf-dark-c-txt-green-60:var(--sf-dark-c-green-60);--sf-dark-c-txt-green-70:var(--sf-dark-c-green-70);--sf-dark-c-txt-green-80:var(--sf-dark-c-green-80);--sf-dark-c-txt-green-90:var(--sf-dark-c-green-90);--sf-dark-c-txt-green-100:var(--sf-dark-c-green-100);--sf-c-orange:39 100% 50%;--sf-c-orange-0:39 100% 0%;--sf-c-orange-10:39 100% 10%;--sf-c-orange-20:39 100% 20%;--sf-c-orange-30:39 100% 30%;--sf-c-orange-40:39 100% 40%;--sf-c-orange-50:39 100% 50%;--sf-c-orange-60:39 100% 60%;--sf-c-orange-70:39 100% 70%;--sf-c-orange-80:39 100% 80%;--sf-c-orange-90:39 100% 90%;--sf-c-orange-100:39 100% 100%;--sf-c-txt-orange:var(--sf-c-orange);--sf-c-txt-orange-0:var(--sf-c-orange-0);--sf-c-txt-orange-10:var(--sf-c-orange-10);--sf-c-txt-orange-20:var(--sf-c-orange-20);--sf-c-txt-orange-30:var(--sf-c-orange-30);--sf-c-txt-orange-40:var(--sf-c-orange-40);--sf-c-txt-orange-50:var(--sf-c-orange-50);--sf-c-txt-orange-60:var(--sf-c-orange-60);--sf-c-txt-orange-70:var(--sf-c-orange-70);--sf-c-txt-orange-80:var(--sf-c-orange-80);--sf-c-txt-orange-90:var(--sf-c-orange-90);--sf-c-txt-orange-100:var(--sf-c-orange-100);--sf-dark-c-orange:39 100% 50%;--sf-dark-c-orange-0:39 100% 0%;--sf-dark-c-orange-10:39 100% 10%;--sf-dark-c-orange-20:39 100% 20%;--sf-dark-c-orange-30:39 100% 30%;--sf-dark-c-orange-40:39 100% 40%;--sf-dark-c-orange-50:39 100% 50%;--sf-dark-c-orange-60:39 100% 60%;--sf-dark-c-orange-70:39 100% 70%;--sf-dark-c-orange-80:39 100% 80%;--sf-dark-c-orange-90:39 100% 90%;--sf-dark-c-orange-100:39 100% 100%;--sf-dark-c-txt-orange:var(--sf-dark-c-orange);--sf-dark-c-txt-orange-0:var(--sf-dark-c-orange-0);--sf-dark-c-txt-orange-10:var(--sf-dark-c-orange-10);--sf-dark-c-txt-orange-20:var(--sf-dark-c-orange-20);--sf-dark-c-txt-orange-30:var(--sf-dark-c-orange-30);--sf-dark-c-txt-orange-40:var(--sf-dark-c-orange-40);--sf-dark-c-txt-orange-50:var(--sf-dark-c-orange-50);--sf-dark-c-txt-orange-60:var(--sf-dark-c-orange-60);--sf-dark-c-txt-orange-70:var(--sf-dark-c-orange-70);--sf-dark-c-txt-orange-80:var(--sf-dark-c-orange-80);--sf-dark-c-txt-orange-90:var(--sf-dark-c-orange-90);--sf-dark-c-txt-orange-100:var(--sf-dark-c-orange-100);--sf-c-red:0 100% 50%;--sf-c-red-0:0 100% 0%;--sf-c-red-10:0 100% 10%;--sf-c-red-20:0 100% 20%;--sf-c-red-30:0 100% 30%;--sf-c-red-40:0 100% 40%;--sf-c-red-50:0 100% 50%;--sf-c-red-60:0 100% 60%;--sf-c-red-70:0 100% 70%;--sf-c-red-80:0 100% 80%;--sf-c-red-90:0 100% 90%;--sf-c-red-100:0 100% 100%;--sf-c-txt-red:var(--sf-c-red);--sf-c-txt-red-0:var(--sf-c-red-0);--sf-c-txt-red-10:var(--sf-c-red-10);--sf-c-txt-red-20:var(--sf-c-red-20);--sf-c-txt-red-30:var(--sf-c-red-30);--sf-c-txt-red-40:var(--sf-c-red-40);--sf-c-txt-red-50:var(--sf-c-red-50);--sf-c-txt-red-60:var(--sf-c-red-60);--sf-c-txt-red-70:var(--sf-c-red-70);--sf-c-txt-red-80:var(--sf-c-red-80);--sf-c-txt-red-90:var(--sf-c-red-90);--sf-c-txt-red-100:var(--sf-c-red-100);--sf-dark-c-red:0 100% 50%;--sf-dark-c-red-0:0 100% 0%;--sf-dark-c-red-10:0 100% 10%;--sf-dark-c-red-20:0 100% 20%;--sf-dark-c-red-30:0 100% 30%;--sf-dark-c-red-40:0 100% 40%;--sf-dark-c-red-50:0 100% 50%;--sf-dark-c-red-60:0 100% 60%;--sf-dark-c-red-70:0 100% 70%;--sf-dark-c-red-80:0 100% 80%;--sf-dark-c-red-90:0 100% 90%;--sf-dark-c-red-100:0 100% 100%;--sf-dark-c-txt-red:var(--sf-dark-c-red);--sf-dark-c-txt-red-0:var(--sf-dark-c-red-0);--sf-dark-c-txt-red-10:var(--sf-dark-c-red-10);--sf-dark-c-txt-red-20:var(--sf-dark-c-red-20);--sf-dark-c-txt-red-30:var(--sf-dark-c-red-30);--sf-dark-c-txt-red-40:var(--sf-dark-c-red-40);--sf-dark-c-txt-red-50:var(--sf-dark-c-red-50);--sf-dark-c-txt-red-60:var(--sf-dark-c-red-60);--sf-dark-c-txt-red-70:var(--sf-dark-c-red-70);--sf-dark-c-txt-red-80:var(--sf-dark-c-red-80);--sf-dark-c-txt-red-90:var(--sf-dark-c-red-90);--sf-dark-c-txt-red-100:var(--sf-dark-c-red-100);--sf-c-skyblue:197 71% 73%;--sf-c-skyblue-0:197 71% 0%;--sf-c-skyblue-10:197 71% 10%;--sf-c-skyblue-20:197 71% 20%;--sf-c-skyblue-30:197 71% 30%;--sf-c-skyblue-40:197 71% 40%;--sf-c-skyblue-50:197 71% 50%;--sf-c-skyblue-60:197 71% 60%;--sf-c-skyblue-70:197 71% 70%;--sf-c-skyblue-80:197 71% 80%;--sf-c-skyblue-90:197 71% 90%;--sf-c-skyblue-100:197 71% 100%;--sf-c-txt-skyblue:var(--sf-c-skyblue);--sf-c-txt-skyblue-0:var(--sf-c-skyblue-0);--sf-c-txt-skyblue-10:var(--sf-c-skyblue-10);--sf-c-txt-skyblue-20:var(--sf-c-skyblue-20);--sf-c-txt-skyblue-30:var(--sf-c-skyblue-30);--sf-c-txt-skyblue-40:var(--sf-c-skyblue-40);--sf-c-txt-skyblue-50:var(--sf-c-skyblue-50);--sf-c-txt-skyblue-60:var(--sf-c-skyblue-60);--sf-c-txt-skyblue-70:var(--sf-c-skyblue-70);--sf-c-txt-skyblue-80:var(--sf-c-skyblue-80);--sf-c-txt-skyblue-90:var(--sf-c-skyblue-90);--sf-c-txt-skyblue-100:var(--sf-c-skyblue-100);--sf-dark-c-skyblue:197 71% 27%;--sf-dark-c-skyblue-0:197 71% 0%;--sf-dark-c-skyblue-10:197 71% 10%;--sf-dark-c-skyblue-20:197 71% 20%;--sf-dark-c-skyblue-30:197 71% 30%;--sf-dark-c-skyblue-40:197 71% 40%;--sf-dark-c-skyblue-50:197 71% 50%;--sf-dark-c-skyblue-60:197 71% 60%;--sf-dark-c-skyblue-70:197 71% 70%;--sf-dark-c-skyblue-80:197 71% 80%;--sf-dark-c-skyblue-90:197 71% 90%;--sf-dark-c-skyblue-100:197 71% 100%;--sf-dark-c-txt-skyblue:var(--sf-dark-c-skyblue);--sf-dark-c-txt-skyblue-0:var(--sf-dark-c-skyblue-0);--sf-dark-c-txt-skyblue-10:var(--sf-dark-c-skyblue-10);--sf-dark-c-txt-skyblue-20:var(--sf-dark-c-skyblue-20);--sf-dark-c-txt-skyblue-30:var(--sf-dark-c-skyblue-30);--sf-dark-c-txt-skyblue-40:var(--sf-dark-c-skyblue-40);--sf-dark-c-txt-skyblue-50:var(--sf-dark-c-skyblue-50);--sf-dark-c-txt-skyblue-60:var(--sf-dark-c-skyblue-60);--sf-dark-c-txt-skyblue-70:var(--sf-dark-c-skyblue-70);--sf-dark-c-txt-skyblue-80:var(--sf-dark-c-skyblue-80);--sf-dark-c-txt-skyblue-90:var(--sf-dark-c-skyblue-90);--sf-dark-c-txt-skyblue-100:var(--sf-dark-c-skyblue-100);--sf-c-violet:300 76% 72%;--sf-c-violet-0:300 76% 0%;--sf-c-violet-10:300 76% 10%;--sf-c-violet-20:300 76% 20%;--sf-c-violet-30:300 76% 30%;--sf-c-violet-40:300 76% 40%;--sf-c-violet-50:300 76% 50%;--sf-c-violet-60:300 76% 60%;--sf-c-violet-70:300 76% 70%;--sf-c-violet-80:300 76% 80%;--sf-c-violet-90:300 76% 90%;--sf-c-violet-100:300 76% 100%;--sf-c-txt-violet:var(--sf-c-violet);--sf-c-txt-violet-0:var(--sf-c-violet-0);--sf-c-txt-violet-10:var(--sf-c-violet-10);--sf-c-txt-violet-20:var(--sf-c-violet-20);--sf-c-txt-violet-30:var(--sf-c-violet-30);--sf-c-txt-violet-40:var(--sf-c-violet-40);--sf-c-txt-violet-50:var(--sf-c-violet-50);--sf-c-txt-violet-60:var(--sf-c-violet-60);--sf-c-txt-violet-70:var(--sf-c-violet-70);--sf-c-txt-violet-80:var(--sf-c-violet-80);--sf-c-txt-violet-90:var(--sf-c-violet-90);--sf-c-txt-violet-100:var(--sf-c-violet-100);--sf-dark-c-violet:300 76% 28%;--sf-dark-c-violet-0:300 76% 0%;--sf-dark-c-violet-10:300 76% 10%;--sf-dark-c-violet-20:300 76% 20%;--sf-dark-c-violet-30:300 76% 30%;--sf-dark-c-violet-40:300 76% 40%;--sf-dark-c-violet-50:300 76% 50%;--sf-dark-c-violet-60:300 76% 60%;--sf-dark-c-violet-70:300 76% 70%;--sf-dark-c-violet-80:300 76% 80%;--sf-dark-c-violet-90:300 76% 90%;--sf-dark-c-violet-100:300 76% 100%;--sf-dark-c-txt-violet:var(--sf-dark-c-violet);--sf-dark-c-txt-violet-0:var(--sf-dark-c-violet-0);--sf-dark-c-txt-violet-10:var(--sf-dark-c-violet-10);--sf-dark-c-txt-violet-20:var(--sf-dark-c-violet-20);--sf-dark-c-txt-violet-30:var(--sf-dark-c-violet-30);--sf-dark-c-txt-violet-40:var(--sf-dark-c-violet-40);--sf-dark-c-txt-violet-50:var(--sf-dark-c-violet-50);--sf-dark-c-txt-violet-60:var(--sf-dark-c-violet-60);--sf-dark-c-txt-violet-70:var(--sf-dark-c-violet-70);--sf-dark-c-txt-violet-80:var(--sf-dark-c-violet-80);--sf-dark-c-txt-violet-90:var(--sf-dark-c-violet-90);--sf-dark-c-txt-violet-100:var(--sf-dark-c-violet-100);--sf-c-yellow:60 100% 50%;--sf-c-yellow-0:60 100% 0%;--sf-c-yellow-10:60 100% 10%;--sf-c-yellow-20:60 100% 20%;--sf-c-yellow-30:60 100% 30%;--sf-c-yellow-40:60 100% 40%;--sf-c-yellow-50:60 100% 50%;--sf-c-yellow-60:60 100% 60%;--sf-c-yellow-70:60 100% 70%;--sf-c-yellow-80:60 100% 80%;--sf-c-yellow-90:60 100% 90%;--sf-c-yellow-100:60 100% 100%;--sf-c-txt-yellow:var(--sf-c-yellow);--sf-c-txt-yellow-0:var(--sf-c-yellow-0);--sf-c-txt-yellow-10:var(--sf-c-yellow-10);--sf-c-txt-yellow-20:var(--sf-c-yellow-20);--sf-c-txt-yellow-30:var(--sf-c-yellow-30);--sf-c-txt-yellow-40:var(--sf-c-yellow-40);--sf-c-txt-yellow-50:var(--sf-c-yellow-50);--sf-c-txt-yellow-60:var(--sf-c-yellow-60);--sf-c-txt-yellow-70:var(--sf-c-yellow-70);--sf-c-txt-yellow-80:var(--sf-c-yellow-80);--sf-c-txt-yellow-90:var(--sf-c-yellow-90);--sf-c-txt-yellow-100:var(--sf-c-yellow-100);--sf-dark-c-yellow:60 100% 50%;--sf-dark-c-yellow-0:60 100% 0%;--sf-dark-c-yellow-10:60 100% 10%;--sf-dark-c-yellow-20:60 100% 20%;--sf-dark-c-yellow-30:60 100% 30%;--sf-dark-c-yellow-40:60 100% 40%;--sf-dark-c-yellow-50:60 100% 50%;--sf-dark-c-yellow-60:60 100% 60%;--sf-dark-c-yellow-70:60 100% 70%;--sf-dark-c-yellow-80:60 100% 80%;--sf-dark-c-yellow-90:60 100% 90%;--sf-dark-c-yellow-100:60 100% 100%;--sf-dark-c-txt-yellow:var(--sf-dark-c-yellow);--sf-dark-c-txt-yellow-0:var(--sf-dark-c-yellow-0);--sf-dark-c-txt-yellow-10:var(--sf-dark-c-yellow-10);--sf-dark-c-txt-yellow-20:var(--sf-dark-c-yellow-20);--sf-dark-c-txt-yellow-30:var(--sf-dark-c-yellow-30);--sf-dark-c-txt-yellow-40:var(--sf-dark-c-yellow-40);--sf-dark-c-txt-yellow-50:var(--sf-dark-c-yellow-50);--sf-dark-c-txt-yellow-60:var(--sf-dark-c-yellow-60);--sf-dark-c-txt-yellow-70:var(--sf-dark-c-yellow-70);--sf-dark-c-txt-yellow-80:var(--sf-dark-c-yellow-80);--sf-dark-c-txt-yellow-90:var(--sf-dark-c-yellow-90);--sf-dark-c-txt-yellow-100:var(--sf-dark-c-yellow-100)}.sf-c-black{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black))}.sf-c-black\:0{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}.sf-c-black\:10{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}.sf-c-black\:20{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}.sf-c-black\:30{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}.sf-c-black\:40{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}.sf-c-black\:50{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-50))}.sf-c-black\:60{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-60))}.sf-c-black\:70{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}.sf-c-black\:80{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}.sf-c-black\:90{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}.sf-c-black\:100{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-100))}html.var .sf-c-black{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-black\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-black\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-black\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-black\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-black\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-black\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-black\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-black\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-black{color:hsl(var(--sf-dark-c-txt-black))}.sf-c-txt-black\:0{color:hsl(var(--sf-dark-c-txt-black-100))}.sf-c-txt-black\:10{color:hsl(var(--sf-dark-c-txt-black-90))}.sf-c-txt-black\:20{color:hsl(var(--sf-dark-c-txt-black-80))}.sf-c-txt-black\:30{color:hsl(var(--sf-dark-c-txt-black-70))}.sf-c-txt-black\:40{color:hsl(var(--sf-dark-c-txt-black-60))}.sf-c-txt-black\:50{color:hsl(var(--sf-dark-c-txt-black-50))}.sf-c-txt-black\:60{color:hsl(var(--sf-dark-c-txt-black-40))}.sf-c-txt-black\:70{color:hsl(var(--sf-dark-c-txt-black-30))}.sf-c-txt-black\:80{color:hsl(var(--sf-dark-c-txt-black-20))}.sf-c-txt-black\:90{color:hsl(var(--sf-dark-c-txt-black-10))}.sf-c-txt-black\:100{color:hsl(var(--sf-dark-c-txt-black-0))}html.var .sf-c-txt-black{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-black\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-black\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-black\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-black\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-black\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-black\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-black\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-black\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-black,html.dark .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='dark'] .sf-c-black\:0,html.dark .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='dark'] .sf-c-black\:10,html.dark .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='dark'] .sf-c-black\:20,html.dark .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='dark'] .sf-c-black\:30,html.dark .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='dark'] .sf-c-black\:40,html.dark .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='dark'] .sf-c-black\:50,html.dark .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='dark'] .sf-c-black\:60,html.dark .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='dark'] .sf-c-black\:70,html.dark .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='dark'] .sf-c-black\:80,html.dark .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='dark'] .sf-c-black\:90,html.dark .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='dark'] .sf-c-black\:100,html.dark .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='dark'] .sf-c-black\:dark,html.dark .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='dark'] .sf-c-black\:0\:dark,html.dark .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='dark'] .sf-c-black\:10\:dark,html.dark .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='dark'] .sf-c-black\:20\:dark,html.dark .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='dark'] .sf-c-black\:30\:dark,html.dark .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='dark'] .sf-c-black\:40\:dark,html.dark .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='dark'] .sf-c-black\:50\:dark,html.dark .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='dark'] .sf-c-black\:60\:dark,html.dark .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='dark'] .sf-c-black\:70\:dark,html.dark .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='dark'] .sf-c-black\:80\:dark,html.dark .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='dark'] .sf-c-black\:90\:dark,html.dark .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='dark'] .sf-c-black\:100\:dark,html.dark .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-dark-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-dark-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-dark-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-dark-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-dark-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-dark-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-dark-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-dark-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-dark-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-dark-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-dark-c-txt-black-100))}html.var[data-theme='dark'] .sf-c-black,html.var.dark .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0,html.var.dark .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10,html.var.dark .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20,html.var.dark .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30,html.var.dark .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40,html.var.dark .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50,html.var.dark .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60,html.var.dark .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70,html.var.dark .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80,html.var.dark .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90,html.var.dark .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100,html.var.dark .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-black\:dark,html.var.dark .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0\:dark,html.var.dark .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10\:dark,html.var.dark .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20\:dark,html.var.dark .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30\:dark,html.var.dark .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40\:dark,html.var.dark .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50\:dark,html.var.dark .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60\:dark,html.var.dark .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70\:dark,html.var.dark .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80\:dark,html.var.dark .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90\:dark,html.var.dark .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100\:dark,html.var.dark .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-black,html.auto .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='auto'] .sf-c-black\:0,html.auto .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='auto'] .sf-c-black\:10,html.auto .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='auto'] .sf-c-black\:20,html.auto .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='auto'] .sf-c-black\:30,html.auto .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='auto'] .sf-c-black\:40,html.auto .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='auto'] .sf-c-black\:50,html.auto .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='auto'] .sf-c-black\:60,html.auto .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='auto'] .sf-c-black\:70,html.auto .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='auto'] .sf-c-black\:80,html.auto .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='auto'] .sf-c-black\:90,html.auto .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='auto'] .sf-c-black\:100,html.auto .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='auto'] .sf-c-black\:dark,html.auto .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='auto'] .sf-c-black\:0\:dark,html.auto .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='auto'] .sf-c-black\:10\:dark,html.auto .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='auto'] .sf-c-black\:20\:dark,html.auto .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='auto'] .sf-c-black\:30\:dark,html.auto .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='auto'] .sf-c-black\:40\:dark,html.auto .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='auto'] .sf-c-black\:50\:dark,html.auto .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='auto'] .sf-c-black\:60\:dark,html.auto .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='auto'] .sf-c-black\:70\:dark,html.auto .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='auto'] .sf-c-black\:80\:dark,html.auto .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='auto'] .sf-c-black\:90\:dark,html.auto .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='auto'] .sf-c-black\:100\:dark,html.auto .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-c-txt-black-100))}html.var[data-theme='auto'] .sf-c-black,html.var.auto .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0,html.var.auto .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10,html.var.auto .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20,html.var.auto .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30,html.var.auto .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40,html.var.auto .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50,html.var.auto .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60,html.var.auto .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70,html.var.auto .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80,html.var.auto .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90,html.var.auto .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100,html.var.auto .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-black\:dark,html.var.auto .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0\:dark,html.var.auto .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10\:dark,html.var.auto .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20\:dark,html.var.auto .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30\:dark,html.var.auto .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40\:dark,html.var.auto .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50\:dark,html.var.auto .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60\:dark,html.var.auto .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70\:dark,html.var.auto .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80\:dark,html.var.auto .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90\:dark,html.var.auto .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100\:dark,html.var.auto .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}}.sf-c-blue{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}.sf-c-blue\:0{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}.sf-c-blue\:10{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}.sf-c-blue\:20{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}.sf-c-blue\:30{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}.sf-c-blue\:40{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}.sf-c-blue\:50{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}.sf-c-blue\:60{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}.sf-c-blue\:70{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-70))}.sf-c-blue\:80{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-80))}.sf-c-blue\:90{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}.sf-c-blue\:100{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-100))}html.var .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-blue\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-blue\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-blue\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-blue\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-blue\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-blue{color:hsl(var(--sf-dark-c-txt-blue))}.sf-c-txt-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-100))}.sf-c-txt-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-90))}.sf-c-txt-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-80))}.sf-c-txt-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-70))}.sf-c-txt-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-60))}.sf-c-txt-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-50))}.sf-c-txt-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-40))}.sf-c-txt-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-30))}.sf-c-txt-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-20))}.sf-c-txt-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-10))}.sf-c-txt-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-0))}html.var .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-blue\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-blue\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-blue\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-blue\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-blue\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-blue\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-blue\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-blue\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-blue,html.dark .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='dark'] .sf-c-blue\:0,html.dark .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10,html.dark .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20,html.dark .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30,html.dark .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40,html.dark .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50,html.dark .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60,html.dark .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70,html.dark .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80,html.dark .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90,html.dark .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100,html.dark .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='dark'] .sf-c-blue\:dark,html.dark .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='dark'] .sf-c-blue\:0\:dark,html.dark .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10\:dark,html.dark .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20\:dark,html.dark .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30\:dark,html.dark .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40\:dark,html.dark .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50\:dark,html.dark .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60\:dark,html.dark .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70\:dark,html.dark .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80\:dark,html.dark .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90\:dark,html.dark .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100\:dark,html.dark .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-dark-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-dark-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-dark-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-dark-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-dark-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-dark-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-dark-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-dark-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-dark-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-dark-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-dark-c-txt-blue-100))}html.var[data-theme='dark'] .sf-c-blue,html.var.dark .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0,html.var.dark .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10,html.var.dark .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20,html.var.dark .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30,html.var.dark .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40,html.var.dark .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50,html.var.dark .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60,html.var.dark .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70,html.var.dark .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80,html.var.dark .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90,html.var.dark .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100,html.var.dark .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-blue\:dark,html.var.dark .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0\:dark,html.var.dark .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10\:dark,html.var.dark .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20\:dark,html.var.dark .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30\:dark,html.var.dark .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40\:dark,html.var.dark .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50\:dark,html.var.dark .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60\:dark,html.var.dark .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70\:dark,html.var.dark .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80\:dark,html.var.dark .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90\:dark,html.var.dark .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100\:dark,html.var.dark .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-blue,html.auto .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='auto'] .sf-c-blue\:0,html.auto .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10,html.auto .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20,html.auto .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30,html.auto .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40,html.auto .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50,html.auto .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60,html.auto .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70,html.auto .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80,html.auto .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90,html.auto .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100,html.auto .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='auto'] .sf-c-blue\:dark,html.auto .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='auto'] .sf-c-blue\:0\:dark,html.auto .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10\:dark,html.auto .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20\:dark,html.auto .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30\:dark,html.auto .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40\:dark,html.auto .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50\:dark,html.auto .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60\:dark,html.auto .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70\:dark,html.auto .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80\:dark,html.auto .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90\:dark,html.auto .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100\:dark,html.auto .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-100))}html.var[data-theme='auto'] .sf-c-blue,html.var.auto .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0,html.var.auto .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10,html.var.auto .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20,html.var.auto .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30,html.var.auto .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40,html.var.auto .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50,html.var.auto .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60,html.var.auto .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70,html.var.auto .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80,html.var.auto .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90,html.var.auto .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100,html.var.auto .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-blue\:dark,html.var.auto .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0\:dark,html.var.auto .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10\:dark,html.var.auto .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20\:dark,html.var.auto .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30\:dark,html.var.auto .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40\:dark,html.var.auto .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50\:dark,html.var.auto .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60\:dark,html.var.auto .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70\:dark,html.var.auto .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80\:dark,html.var.auto .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90\:dark,html.var.auto .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100\:dark,html.var.auto .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}}.sf-c-green{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green))}.sf-c-green\:0{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}.sf-c-green\:10{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}.sf-c-green\:20{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}.sf-c-green\:30{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-30))}.sf-c-green\:40{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-40))}.sf-c-green\:50{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}.sf-c-green\:60{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}.sf-c-green\:70{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}.sf-c-green\:80{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}.sf-c-green\:90{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}.sf-c-green\:100{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-100))}html.var .sf-c-green{color:hsl(120,100%,90%);background:hsl(120,100%,25%)}html.var .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-green\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-green\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-green\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-green\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-green\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-green\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-green\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-green{color:hsl(var(--sf-dark-c-txt-green))}.sf-c-txt-green\:0{color:hsl(var(--sf-dark-c-txt-green-100))}.sf-c-txt-green\:10{color:hsl(var(--sf-dark-c-txt-green-90))}.sf-c-txt-green\:20{color:hsl(var(--sf-dark-c-txt-green-80))}.sf-c-txt-green\:30{color:hsl(var(--sf-dark-c-txt-green-70))}.sf-c-txt-green\:40{color:hsl(var(--sf-dark-c-txt-green-60))}.sf-c-txt-green\:50{color:hsl(var(--sf-dark-c-txt-green-50))}.sf-c-txt-green\:60{color:hsl(var(--sf-dark-c-txt-green-40))}.sf-c-txt-green\:70{color:hsl(var(--sf-dark-c-txt-green-30))}.sf-c-txt-green\:80{color:hsl(var(--sf-dark-c-txt-green-20))}.sf-c-txt-green\:90{color:hsl(var(--sf-dark-c-txt-green-10))}.sf-c-txt-green\:100{color:hsl(var(--sf-dark-c-txt-green-0))}html.var .sf-c-txt-green{color:hsl(120,100%,75%)}html.var .sf-c-txt-green\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-green\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-green\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-green\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-green\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-green\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-green\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-green\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-green\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-green\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-green,html.dark .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='dark'] .sf-c-green\:0,html.dark .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='dark'] .sf-c-green\:10,html.dark .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='dark'] .sf-c-green\:20,html.dark .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='dark'] .sf-c-green\:30,html.dark .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='dark'] .sf-c-green\:40,html.dark .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='dark'] .sf-c-green\:50,html.dark .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='dark'] .sf-c-green\:60,html.dark .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='dark'] .sf-c-green\:70,html.dark .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='dark'] .sf-c-green\:80,html.dark .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='dark'] .sf-c-green\:90,html.dark .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='dark'] .sf-c-green\:100,html.dark .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='dark'] .sf-c-green\:dark,html.dark .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='dark'] .sf-c-green\:0\:dark,html.dark .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='dark'] .sf-c-green\:10\:dark,html.dark .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='dark'] .sf-c-green\:20\:dark,html.dark .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='dark'] .sf-c-green\:30\:dark,html.dark .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='dark'] .sf-c-green\:40\:dark,html.dark .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='dark'] .sf-c-green\:50\:dark,html.dark .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='dark'] .sf-c-green\:60\:dark,html.dark .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='dark'] .sf-c-green\:70\:dark,html.dark .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='dark'] .sf-c-green\:80\:dark,html.dark .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='dark'] .sf-c-green\:90\:dark,html.dark .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='dark'] .sf-c-green\:100\:dark,html.dark .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-dark-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-dark-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-dark-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-dark-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-dark-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-dark-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-dark-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-dark-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-dark-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-dark-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-dark-c-txt-green-100))}html.var[data-theme='dark'] .sf-c-green,html.var.dark .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0,html.var.dark .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10,html.var.dark .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20,html.var.dark .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30,html.var.dark .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40,html.var.dark .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50,html.var.dark .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60,html.var.dark .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70,html.var.dark .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80,html.var.dark .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90,html.var.dark .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100,html.var.dark .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-green\:dark,html.var.dark .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0\:dark,html.var.dark .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10\:dark,html.var.dark .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20\:dark,html.var.dark .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30\:dark,html.var.dark .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40\:dark,html.var.dark .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50\:dark,html.var.dark .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60\:dark,html.var.dark .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70\:dark,html.var.dark .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80\:dark,html.var.dark .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90\:dark,html.var.dark .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100\:dark,html.var.dark .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-green,html.auto .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='auto'] .sf-c-green\:0,html.auto .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='auto'] .sf-c-green\:10,html.auto .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='auto'] .sf-c-green\:20,html.auto .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='auto'] .sf-c-green\:30,html.auto .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='auto'] .sf-c-green\:40,html.auto .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='auto'] .sf-c-green\:50,html.auto .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='auto'] .sf-c-green\:60,html.auto .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='auto'] .sf-c-green\:70,html.auto .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='auto'] .sf-c-green\:80,html.auto .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='auto'] .sf-c-green\:90,html.auto .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='auto'] .sf-c-green\:100,html.auto .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='auto'] .sf-c-green\:dark,html.auto .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='auto'] .sf-c-green\:0\:dark,html.auto .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='auto'] .sf-c-green\:10\:dark,html.auto .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='auto'] .sf-c-green\:20\:dark,html.auto .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='auto'] .sf-c-green\:30\:dark,html.auto .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='auto'] .sf-c-green\:40\:dark,html.auto .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='auto'] .sf-c-green\:50\:dark,html.auto .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='auto'] .sf-c-green\:60\:dark,html.auto .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='auto'] .sf-c-green\:70\:dark,html.auto .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='auto'] .sf-c-green\:80\:dark,html.auto .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='auto'] .sf-c-green\:90\:dark,html.auto .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='auto'] .sf-c-green\:100\:dark,html.auto .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-c-txt-green-100))}html.var[data-theme='auto'] .sf-c-green,html.var.auto .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0,html.var.auto .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10,html.var.auto .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20,html.var.auto .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30,html.var.auto .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40,html.var.auto .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50,html.var.auto .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60,html.var.auto .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70,html.var.auto .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80,html.var.auto .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90,html.var.auto .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100,html.var.auto .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-green\:dark,html.var.auto .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0\:dark,html.var.auto .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10\:dark,html.var.auto .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20\:dark,html.var.auto .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30\:dark,html.var.auto .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40\:dark,html.var.auto .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50\:dark,html.var.auto .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60\:dark,html.var.auto .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70\:dark,html.var.auto .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80\:dark,html.var.auto .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90\:dark,html.var.auto .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100\:dark,html.var.auto .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}}.sf-c-orange{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}.sf-c-orange\:0{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}.sf-c-orange\:10{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}.sf-c-orange\:20{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}.sf-c-orange\:30{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}.sf-c-orange\:40{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-40))}.sf-c-orange\:50{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-50))}.sf-c-orange\:60{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}.sf-c-orange\:70{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}.sf-c-orange\:80{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}.sf-c-orange\:90{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}.sf-c-orange\:100{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-100))}html.var .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var .sf-c-orange\:10{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var .sf-c-orange\:20{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var .sf-c-orange\:30{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var .sf-c-orange\:40{color:hsl(39,100%,90%);background:hsl(39,100%,40%)}html.var .sf-c-orange\:50{color:hsl(39,100%,90%);background:hsl(39,100%,50%)}html.var .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var .sf-c-orange\:70{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var .sf-c-orange\:80{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var .sf-c-orange\:90{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var .sf-c-orange\:100{color:hsl(39,100%,10%);background:hsl(39,100%,100%)}.sf-c-txt-orange{color:hsl(var(--sf-dark-c-txt-orange))}.sf-c-txt-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-100))}.sf-c-txt-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-90))}.sf-c-txt-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-80))}.sf-c-txt-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-70))}.sf-c-txt-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-60))}.sf-c-txt-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-50))}.sf-c-txt-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-40))}.sf-c-txt-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-30))}.sf-c-txt-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-20))}.sf-c-txt-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-10))}.sf-c-txt-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-0))}html.var .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var .sf-c-txt-orange\:0{color:hsl(39,100%,100%)}html.var .sf-c-txt-orange\:10{color:hsl(39,100%,90%)}html.var .sf-c-txt-orange\:20{color:hsl(39,100%,80%)}html.var .sf-c-txt-orange\:30{color:hsl(39,100%,70%)}html.var .sf-c-txt-orange\:40{color:hsl(39,100%,60%)}html.var .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var .sf-c-txt-orange\:60{color:hsl(39,100%,40%)}html.var .sf-c-txt-orange\:70{color:hsl(39,100%,30%)}html.var .sf-c-txt-orange\:80{color:hsl(39,100%,20%)}html.var .sf-c-txt-orange\:90{color:hsl(39,100%,10%)}html.var .sf-c-txt-orange\:100{color:hsl(39,100%,0%)}html[data-theme='dark'] .sf-c-orange,html.dark .sf-c-orange{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange))}html[data-theme='dark'] .sf-c-orange\:0,html.dark .sf-c-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-100))}html[data-theme='dark'] .sf-c-orange\:10,html.dark .sf-c-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-90))}html[data-theme='dark'] .sf-c-orange\:20,html.dark .sf-c-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-80))}html[data-theme='dark'] .sf-c-orange\:30,html.dark .sf-c-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-70))}html[data-theme='dark'] .sf-c-orange\:40,html.dark .sf-c-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-60))}html[data-theme='dark'] .sf-c-orange\:50,html.dark .sf-c-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-50))}html[data-theme='dark'] .sf-c-orange\:60,html.dark .sf-c-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-40))}html[data-theme='dark'] .sf-c-orange\:70,html.dark .sf-c-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-30))}html[data-theme='dark'] .sf-c-orange\:80,html.dark .sf-c-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-20))}html[data-theme='dark'] .sf-c-orange\:90,html.dark .sf-c-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-10))}html[data-theme='dark'] .sf-c-orange\:100,html.dark .sf-c-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-0))}html[data-theme='dark'] .sf-c-orange\:dark,html.dark .sf-c-orange\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}html[data-theme='dark'] .sf-c-orange\:0\:dark,html.dark .sf-c-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-100))}html[data-theme='dark'] .sf-c-orange\:10\:dark,html.dark .sf-c-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}html[data-theme='dark'] .sf-c-orange\:20\:dark,html.dark .sf-c-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}html[data-theme='dark'] .sf-c-orange\:30\:dark,html.dark .sf-c-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}html[data-theme='dark'] .sf-c-orange\:40\:dark,html.dark .sf-c-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}html[data-theme='dark'] .sf-c-orange\:50\:dark,html.dark .sf-c-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-50))}html[data-theme='dark'] .sf-c-orange\:60\:dark,html.dark .sf-c-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-40))}html[data-theme='dark'] .sf-c-orange\:70\:dark,html.dark .sf-c-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}html[data-theme='dark'] .sf-c-orange\:80\:dark,html.dark .sf-c-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}html[data-theme='dark'] .sf-c-orange\:90\:dark,html.dark .sf-c-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}html[data-theme='dark'] .sf-c-orange\:100\:dark,html.dark .sf-c-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}html[data-theme='dark'] .sf-c-txt-orange,html.dark .sf-c-txt-orange{color:hsl(var(--sf-c-txt-orange))}html[data-theme='dark'] .sf-c-txt-orange\:0,html.dark .sf-c-txt-orange\:0{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='dark'] .sf-c-txt-orange\:10,html.dark .sf-c-txt-orange\:10{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='dark'] .sf-c-txt-orange\:20,html.dark .sf-c-txt-orange\:20{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='dark'] .sf-c-txt-orange\:30,html.dark .sf-c-txt-orange\:30{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='dark'] .sf-c-txt-orange\:40,html.dark .sf-c-txt-orange\:40{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='dark'] .sf-c-txt-orange\:50,html.dark .sf-c-txt-orange\:50{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='dark'] .sf-c-txt-orange\:60,html.dark .sf-c-txt-orange\:60{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='dark'] .sf-c-txt-orange\:70,html.dark .sf-c-txt-orange\:70{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='dark'] .sf-c-txt-orange\:80,html.dark .sf-c-txt-orange\:80{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='dark'] .sf-c-txt-orange\:90,html.dark .sf-c-txt-orange\:90{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='dark'] .sf-c-txt-orange\:100,html.dark .sf-c-txt-orange\:100{color:hsl(var(--sf-c-txt-orange-100))}html[data-theme='dark'] .sf-c-txt-orange\:dark,html.dark .sf-c-txt-orange\:dark{color:hsl(var(--sf-c-txt-orange))}html[data-theme='dark'] .sf-c-txt-orange\:0\:dark,html.dark .sf-c-txt-orange\:0\:dark{color:hsl(var(--sf-dark-c-txt-orange-0))}html[data-theme='dark'] .sf-c-txt-orange\:10\:dark,html.dark .sf-c-txt-orange\:10\:dark{color:hsl(var(--sf-dark-c-txt-orange-10))}html[data-theme='dark'] .sf-c-txt-orange\:20\:dark,html.dark .sf-c-txt-orange\:20\:dark{color:hsl(var(--sf-dark-c-txt-orange-20))}html[data-theme='dark'] .sf-c-txt-orange\:30\:dark,html.dark .sf-c-txt-orange\:30\:dark{color:hsl(var(--sf-dark-c-txt-orange-30))}html[data-theme='dark'] .sf-c-txt-orange\:40\:dark,html.dark .sf-c-txt-orange\:40\:dark{color:hsl(var(--sf-dark-c-txt-orange-40))}html[data-theme='dark'] .sf-c-txt-orange\:50\:dark,html.dark .sf-c-txt-orange\:50\:dark{color:hsl(var(--sf-dark-c-txt-orange-50))}html[data-theme='dark'] .sf-c-txt-orange\:60\:dark,html.dark .sf-c-txt-orange\:60\:dark{color:hsl(var(--sf-dark-c-txt-orange-60))}html[data-theme='dark'] .sf-c-txt-orange\:70\:dark,html.dark .sf-c-txt-orange\:70\:dark{color:hsl(var(--sf-dark-c-txt-orange-70))}html[data-theme='dark'] .sf-c-txt-orange\:80\:dark,html.dark .sf-c-txt-orange\:80\:dark{color:hsl(var(--sf-dark-c-txt-orange-80))}html[data-theme='dark'] .sf-c-txt-orange\:90\:dark,html.dark .sf-c-txt-orange\:90\:dark{color:hsl(var(--sf-dark-c-txt-orange-90))}html[data-theme='dark'] .sf-c-txt-orange\:100\:dark,html.dark .sf-c-txt-orange\:100\:dark{color:hsl(var(--sf-dark-c-txt-orange-100))}html.var[data-theme='dark'] .sf-c-orange,html.var.dark .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:0,html.var.dark .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-orange\:10,html.var.dark .sf-c-orange\:10{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-orange\:20,html.var.dark .sf-c-orange\:20{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-orange\:30,html.var.dark .sf-c-orange\:30{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-orange\:40,html.var.dark .sf-c-orange\:40{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-orange\:50,html.var.dark .sf-c-orange\:50{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:60,html.var.dark .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-orange\:70,html.var.dark .sf-c-orange\:70{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-orange\:80,html.var.dark .sf-c-orange\:80{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-orange\:90,html.var.dark .sf-c-orange\:90{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-orange\:100,html.var.dark .sf-c-orange\:100{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-orange\:dark,html.var.dark .sf-c-orange\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:0\:dark,html.var.dark .sf-c-orange\:0\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-orange\:10\:dark,html.var.dark .sf-c-orange\:10\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-orange\:20\:dark,html.var.dark .sf-c-orange\:20\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-orange\:30\:dark,html.var.dark .sf-c-orange\:30\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-orange\:40\:dark,html.var.dark .sf-c-orange\:40\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-orange\:50\:dark,html.var.dark .sf-c-orange\:50\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:60\:dark,html.var.dark .sf-c-orange\:60\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-orange\:70\:dark,html.var.dark .sf-c-orange\:70\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-orange\:80\:dark,html.var.dark .sf-c-orange\:80\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-orange\:90\:dark,html.var.dark .sf-c-orange\:90\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-orange\:100\:dark,html.var.dark .sf-c-orange\:100\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange,html.dark .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:0,html.dark .sf-c-txt-orange\:0{color:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange\:10,html.dark .sf-c-txt-orange\:10{color:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-orange\:20,html.dark .sf-c-txt-orange\:20{color:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-orange\:30,html.dark .sf-c-txt-orange\:30{color:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-orange\:40,html.dark .sf-c-txt-orange\:40{color:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-orange\:50,html.dark .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:60,html.dark .sf-c-txt-orange\:60{color:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-orange\:70,html.dark .sf-c-txt-orange\:70{color:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-orange\:80,html.dark .sf-c-txt-orange\:80{color:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-orange\:90,html.dark .sf-c-txt-orange\:90{color:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-orange\:100,html.dark .sf-c-txt-orange\:100{color:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-orange\:dark,html.dark .sf-c-txt-orange\:dark{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:0\:dark,html.dark .sf-c-txt-orange\:0\:dark{color:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange\:10\:dark,html.dark .sf-c-txt-orange\:10\:dark{color:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-orange\:20\:dark,html.dark .sf-c-txt-orange\:20\:dark{color:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-orange\:30\:dark,html.dark .sf-c-txt-orange\:30\:dark{color:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-orange\:40\:dark,html.dark .sf-c-txt-orange\:40\:dark{color:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-orange\:50\:dark,html.dark .sf-c-txt-orange\:50\:dark{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:60\:dark,html.dark .sf-c-txt-orange\:60\:dark{color:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-orange\:70\:dark,html.dark .sf-c-txt-orange\:70\:dark{color:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-orange\:80\:dark,html.dark .sf-c-txt-orange\:80\:dark{color:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-orange\:90\:dark,html.dark .sf-c-txt-orange\:90\:dark{color:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-orange\:100\:dark,html.dark .sf-c-txt-orange\:100\:dark{color:hsl(39,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-orange,html.auto .sf-c-orange{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange))}html[data-theme='auto'] .sf-c-orange\:0,html.auto .sf-c-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-100))}html[data-theme='auto'] .sf-c-orange\:10,html.auto .sf-c-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-90))}html[data-theme='auto'] .sf-c-orange\:20,html.auto .sf-c-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-80))}html[data-theme='auto'] .sf-c-orange\:30,html.auto .sf-c-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-70))}html[data-theme='auto'] .sf-c-orange\:40,html.auto .sf-c-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-60))}html[data-theme='auto'] .sf-c-orange\:50,html.auto .sf-c-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-50))}html[data-theme='auto'] .sf-c-orange\:60,html.auto .sf-c-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-40))}html[data-theme='auto'] .sf-c-orange\:70,html.auto .sf-c-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-30))}html[data-theme='auto'] .sf-c-orange\:80,html.auto .sf-c-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-20))}html[data-theme='auto'] .sf-c-orange\:90,html.auto .sf-c-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-10))}html[data-theme='auto'] .sf-c-orange\:100,html.auto .sf-c-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-0))}html[data-theme='auto'] .sf-c-orange\:dark,html.auto .sf-c-orange\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}html[data-theme='auto'] .sf-c-orange\:0\:dark,html.auto .sf-c-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-100))}html[data-theme='auto'] .sf-c-orange\:10\:dark,html.auto .sf-c-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}html[data-theme='auto'] .sf-c-orange\:20\:dark,html.auto .sf-c-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}html[data-theme='auto'] .sf-c-orange\:30\:dark,html.auto .sf-c-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}html[data-theme='auto'] .sf-c-orange\:40\:dark,html.auto .sf-c-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}html[data-theme='auto'] .sf-c-orange\:50\:dark,html.auto .sf-c-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-50))}html[data-theme='auto'] .sf-c-orange\:60\:dark,html.auto .sf-c-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-40))}html[data-theme='auto'] .sf-c-orange\:70\:dark,html.auto .sf-c-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}html[data-theme='auto'] .sf-c-orange\:80\:dark,html.auto .sf-c-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}html[data-theme='auto'] .sf-c-orange\:90\:dark,html.auto .sf-c-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}html[data-theme='auto'] .sf-c-orange\:100\:dark,html.auto .sf-c-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}html[data-theme='auto'] .sf-c-txt-orange,html.auto .sf-c-txt-orange{color:hsl(var(--sf-c-txt-orange))}html[data-theme='auto'] .sf-c-txt-orange\:0,html.auto .sf-c-txt-orange\:0{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='auto'] .sf-c-txt-orange\:10,html.auto .sf-c-txt-orange\:10{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='auto'] .sf-c-txt-orange\:20,html.auto .sf-c-txt-orange\:20{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='auto'] .sf-c-txt-orange\:30,html.auto .sf-c-txt-orange\:30{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='auto'] .sf-c-txt-orange\:40,html.auto .sf-c-txt-orange\:40{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='auto'] .sf-c-txt-orange\:50,html.auto .sf-c-txt-orange\:50{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='auto'] .sf-c-txt-orange\:60,html.auto .sf-c-txt-orange\:60{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='auto'] .sf-c-txt-orange\:70,html.auto .sf-c-txt-orange\:70{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='auto'] .sf-c-txt-orange\:80,html.auto .sf-c-txt-orange\:80{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='auto'] .sf-c-txt-orange\:90,html.auto .sf-c-txt-orange\:90{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='auto'] .sf-c-txt-orange\:100,html.auto .sf-c-txt-orange\:100{color:hsl(var(--sf-c-txt-orange-100))}html[data-theme='auto'] .sf-c-txt-orange\:dark,html.auto .sf-c-txt-orange\:dark{color:hsl(var(--sf-c-txt-orange))}html[data-theme='auto'] .sf-c-txt-orange\:0\:dark,html.auto .sf-c-txt-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='auto'] .sf-c-txt-orange\:10\:dark,html.auto .sf-c-txt-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='auto'] .sf-c-txt-orange\:20\:dark,html.auto .sf-c-txt-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='auto'] .sf-c-txt-orange\:30\:dark,html.auto .sf-c-txt-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='auto'] .sf-c-txt-orange\:40\:dark,html.auto .sf-c-txt-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='auto'] .sf-c-txt-orange\:50\:dark,html.auto .sf-c-txt-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='auto'] .sf-c-txt-orange\:60\:dark,html.auto .sf-c-txt-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='auto'] .sf-c-txt-orange\:70\:dark,html.auto .sf-c-txt-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='auto'] .sf-c-txt-orange\:80\:dark,html.auto .sf-c-txt-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='auto'] .sf-c-txt-orange\:90\:dark,html.auto .sf-c-txt-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='auto'] .sf-c-txt-orange\:100\:dark,html.auto .sf-c-txt-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-100))}html.var[data-theme='auto'] .sf-c-orange,html.var.auto .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:0,html.var.auto .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-orange\:10,html.var.auto .sf-c-orange\:10{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-orange\:20,html.var.auto .sf-c-orange\:20{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-orange\:30,html.var.auto .sf-c-orange\:30{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-orange\:40,html.var.auto .sf-c-orange\:40{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-orange\:50,html.var.auto .sf-c-orange\:50{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:60,html.var.auto .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-orange\:70,html.var.auto .sf-c-orange\:70{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-orange\:80,html.var.auto .sf-c-orange\:80{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-orange\:90,html.var.auto .sf-c-orange\:90{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-orange\:100,html.var.auto .sf-c-orange\:100{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-orange\:dark,html.var.auto .sf-c-orange\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:0\:dark,html.var.auto .sf-c-orange\:0\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-orange\:10\:dark,html.var.auto .sf-c-orange\:10\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-orange\:20\:dark,html.var.auto .sf-c-orange\:20\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-orange\:30\:dark,html.var.auto .sf-c-orange\:30\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-orange\:40\:dark,html.var.auto .sf-c-orange\:40\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-orange\:50\:dark,html.var.auto .sf-c-orange\:50\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:60\:dark,html.var.auto .sf-c-orange\:60\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-orange\:70\:dark,html.var.auto .sf-c-orange\:70\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-orange\:80\:dark,html.var.auto .sf-c-orange\:80\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-orange\:90\:dark,html.var.auto .sf-c-orange\:90\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-orange\:100\:dark,html.var.auto .sf-c-orange\:100\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange,html.auto .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:0,html.auto .sf-c-txt-orange\:0{color:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange\:10,html.auto .sf-c-txt-orange\:10{color:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-orange\:20,html.auto .sf-c-txt-orange\:20{color:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-orange\:30,html.auto .sf-c-txt-orange\:30{color:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-orange\:40,html.auto .sf-c-txt-orange\:40{color:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-orange\:50,html.auto .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:60,html.auto .sf-c-txt-orange\:60{color:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-orange\:70,html.auto .sf-c-txt-orange\:70{color:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-orange\:80,html.auto .sf-c-txt-orange\:80{color:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-orange\:90,html.auto .sf-c-txt-orange\:90{color:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-orange\:100,html.auto .sf-c-txt-orange\:100{color:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-orange\:dark,html.auto .sf-c-txt-orange\:dark{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark,html.auto .sf-c-txt-orange\:0\:dark{color:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark,html.auto .sf-c-txt-orange\:10\:dark{color:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark,html.auto .sf-c-txt-orange\:20\:dark{color:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark,html.auto .sf-c-txt-orange\:30\:dark{color:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark,html.auto .sf-c-txt-orange\:40\:dark{color:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark,html.auto .sf-c-txt-orange\:50\:dark{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark,html.auto .sf-c-txt-orange\:60\:dark{color:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark,html.auto .sf-c-txt-orange\:70\:dark{color:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark,html.auto .sf-c-txt-orange\:80\:dark{color:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark,html.auto .sf-c-txt-orange\:90\:dark{color:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark,html.auto .sf-c-txt-orange\:100\:dark{color:hsl(39,100%,100%)}}.sf-c-red{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}.sf-c-red\:0{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}.sf-c-red\:10{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}.sf-c-red\:20{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}.sf-c-red\:30{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}.sf-c-red\:40{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}.sf-c-red\:50{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}.sf-c-red\:60{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-60))}.sf-c-red\:70{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-70))}.sf-c-red\:80{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}.sf-c-red\:90{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}.sf-c-red\:100{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-100))}html.var .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-red\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-red\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-red\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-red\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-red\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-red\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-red\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-red{color:hsl(var(--sf-dark-c-txt-red))}.sf-c-txt-red\:0{color:hsl(var(--sf-dark-c-txt-red-100))}.sf-c-txt-red\:10{color:hsl(var(--sf-dark-c-txt-red-90))}.sf-c-txt-red\:20{color:hsl(var(--sf-dark-c-txt-red-80))}.sf-c-txt-red\:30{color:hsl(var(--sf-dark-c-txt-red-70))}.sf-c-txt-red\:40{color:hsl(var(--sf-dark-c-txt-red-60))}.sf-c-txt-red\:50{color:hsl(var(--sf-dark-c-txt-red-50))}.sf-c-txt-red\:60{color:hsl(var(--sf-dark-c-txt-red-40))}.sf-c-txt-red\:70{color:hsl(var(--sf-dark-c-txt-red-30))}.sf-c-txt-red\:80{color:hsl(var(--sf-dark-c-txt-red-20))}.sf-c-txt-red\:90{color:hsl(var(--sf-dark-c-txt-red-10))}.sf-c-txt-red\:100{color:hsl(var(--sf-dark-c-txt-red-0))}html.var .sf-c-txt-red{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-red\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-red\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-red\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-red\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-red\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-red\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-red\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-red\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-red,html.dark .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='dark'] .sf-c-red\:0,html.dark .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='dark'] .sf-c-red\:10,html.dark .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='dark'] .sf-c-red\:20,html.dark .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='dark'] .sf-c-red\:30,html.dark .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='dark'] .sf-c-red\:40,html.dark .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='dark'] .sf-c-red\:50,html.dark .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='dark'] .sf-c-red\:60,html.dark .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='dark'] .sf-c-red\:70,html.dark .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='dark'] .sf-c-red\:80,html.dark .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='dark'] .sf-c-red\:90,html.dark .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='dark'] .sf-c-red\:100,html.dark .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='dark'] .sf-c-red\:dark,html.dark .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='dark'] .sf-c-red\:0\:dark,html.dark .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='dark'] .sf-c-red\:10\:dark,html.dark .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='dark'] .sf-c-red\:20\:dark,html.dark .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='dark'] .sf-c-red\:30\:dark,html.dark .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='dark'] .sf-c-red\:40\:dark,html.dark .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='dark'] .sf-c-red\:50\:dark,html.dark .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='dark'] .sf-c-red\:60\:dark,html.dark .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='dark'] .sf-c-red\:70\:dark,html.dark .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='dark'] .sf-c-red\:80\:dark,html.dark .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='dark'] .sf-c-red\:90\:dark,html.dark .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='dark'] .sf-c-red\:100\:dark,html.dark .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-dark-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-dark-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-dark-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-dark-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-dark-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-dark-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-dark-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-dark-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-dark-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-dark-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-dark-c-txt-red-100))}html.var[data-theme='dark'] .sf-c-red,html.var.dark .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0,html.var.dark .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10,html.var.dark .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20,html.var.dark .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30,html.var.dark .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40,html.var.dark .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50,html.var.dark .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60,html.var.dark .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70,html.var.dark .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80,html.var.dark .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90,html.var.dark .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100,html.var.dark .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-red\:dark,html.var.dark .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0\:dark,html.var.dark .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10\:dark,html.var.dark .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20\:dark,html.var.dark .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30\:dark,html.var.dark .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40\:dark,html.var.dark .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50\:dark,html.var.dark .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60\:dark,html.var.dark .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70\:dark,html.var.dark .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80\:dark,html.var.dark .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90\:dark,html.var.dark .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100\:dark,html.var.dark .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-red,html.auto .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='auto'] .sf-c-red\:0,html.auto .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='auto'] .sf-c-red\:10,html.auto .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='auto'] .sf-c-red\:20,html.auto .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='auto'] .sf-c-red\:30,html.auto .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='auto'] .sf-c-red\:40,html.auto .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='auto'] .sf-c-red\:50,html.auto .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='auto'] .sf-c-red\:60,html.auto .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='auto'] .sf-c-red\:70,html.auto .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='auto'] .sf-c-red\:80,html.auto .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='auto'] .sf-c-red\:90,html.auto .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='auto'] .sf-c-red\:100,html.auto .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='auto'] .sf-c-red\:dark,html.auto .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='auto'] .sf-c-red\:0\:dark,html.auto .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='auto'] .sf-c-red\:10\:dark,html.auto .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='auto'] .sf-c-red\:20\:dark,html.auto .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='auto'] .sf-c-red\:30\:dark,html.auto .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='auto'] .sf-c-red\:40\:dark,html.auto .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='auto'] .sf-c-red\:50\:dark,html.auto .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='auto'] .sf-c-red\:60\:dark,html.auto .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='auto'] .sf-c-red\:70\:dark,html.auto .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='auto'] .sf-c-red\:80\:dark,html.auto .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='auto'] .sf-c-red\:90\:dark,html.auto .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='auto'] .sf-c-red\:100\:dark,html.auto .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-c-txt-red-100))}html.var[data-theme='auto'] .sf-c-red,html.var.auto .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0,html.var.auto .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10,html.var.auto .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20,html.var.auto .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30,html.var.auto .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40,html.var.auto .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50,html.var.auto .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60,html.var.auto .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70,html.var.auto .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80,html.var.auto .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90,html.var.auto .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100,html.var.auto .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-red\:dark,html.var.auto .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0\:dark,html.var.auto .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10\:dark,html.var.auto .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20\:dark,html.var.auto .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30\:dark,html.var.auto .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40\:dark,html.var.auto .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50\:dark,html.var.auto .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60\:dark,html.var.auto .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70\:dark,html.var.auto .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80\:dark,html.var.auto .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90\:dark,html.var.auto .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100\:dark,html.var.auto .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}}.sf-c-skyblue{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue))}.sf-c-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}.sf-c-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}.sf-c-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}.sf-c-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}.sf-c-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-40))}.sf-c-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-50))}.sf-c-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}.sf-c-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}.sf-c-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}.sf-c-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}.sf-c-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-100))}html.var .sf-c-skyblue{color:hsl(197,71%,10%);background:hsl(197,71%,73%)}html.var .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var .sf-c-skyblue\:10{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var .sf-c-skyblue\:20{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var .sf-c-skyblue\:30{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var .sf-c-skyblue\:40{color:hsl(197,71%,90%);background:hsl(197,71%,40%)}html.var .sf-c-skyblue\:50{color:hsl(197,71%,90%);background:hsl(197,71%,50%)}html.var .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var .sf-c-skyblue\:70{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var .sf-c-skyblue\:80{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var .sf-c-skyblue\:90{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var .sf-c-skyblue\:100{color:hsl(197,71%,10%);background:hsl(197,71%,100%)}.sf-c-txt-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue))}.sf-c-txt-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-100))}.sf-c-txt-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-90))}.sf-c-txt-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-80))}.sf-c-txt-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-70))}.sf-c-txt-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-60))}.sf-c-txt-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-50))}.sf-c-txt-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-40))}.sf-c-txt-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-30))}.sf-c-txt-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-20))}.sf-c-txt-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-10))}.sf-c-txt-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-0))}html.var .sf-c-txt-skyblue{color:hsl(197,71%,27%)}html.var .sf-c-txt-skyblue\:0{color:hsl(197,71%,100%)}html.var .sf-c-txt-skyblue\:10{color:hsl(197,71%,90%)}html.var .sf-c-txt-skyblue\:20{color:hsl(197,71%,80%)}html.var .sf-c-txt-skyblue\:30{color:hsl(197,71%,70%)}html.var .sf-c-txt-skyblue\:40{color:hsl(197,71%,60%)}html.var .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var .sf-c-txt-skyblue\:60{color:hsl(197,71%,40%)}html.var .sf-c-txt-skyblue\:70{color:hsl(197,71%,30%)}html.var .sf-c-txt-skyblue\:80{color:hsl(197,71%,20%)}html.var .sf-c-txt-skyblue\:90{color:hsl(197,71%,10%)}html.var .sf-c-txt-skyblue\:100{color:hsl(197,71%,0%)}html[data-theme='dark'] .sf-c-skyblue,html.dark .sf-c-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue))}html[data-theme='dark'] .sf-c-skyblue\:0,html.dark .sf-c-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-100))}html[data-theme='dark'] .sf-c-skyblue\:10,html.dark .sf-c-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-90))}html[data-theme='dark'] .sf-c-skyblue\:20,html.dark .sf-c-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-80))}html[data-theme='dark'] .sf-c-skyblue\:30,html.dark .sf-c-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-70))}html[data-theme='dark'] .sf-c-skyblue\:40,html.dark .sf-c-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-60))}html[data-theme='dark'] .sf-c-skyblue\:50,html.dark .sf-c-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-50))}html[data-theme='dark'] .sf-c-skyblue\:60,html.dark .sf-c-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-40))}html[data-theme='dark'] .sf-c-skyblue\:70,html.dark .sf-c-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-30))}html[data-theme='dark'] .sf-c-skyblue\:80,html.dark .sf-c-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-20))}html[data-theme='dark'] .sf-c-skyblue\:90,html.dark .sf-c-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-10))}html[data-theme='dark'] .sf-c-skyblue\:100,html.dark .sf-c-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-0))}html[data-theme='dark'] .sf-c-skyblue\:dark,html.dark .sf-c-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue))}html[data-theme='dark'] .sf-c-skyblue\:0\:dark,html.dark .sf-c-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-100))}html[data-theme='dark'] .sf-c-skyblue\:10\:dark,html.dark .sf-c-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}html[data-theme='dark'] .sf-c-skyblue\:20\:dark,html.dark .sf-c-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}html[data-theme='dark'] .sf-c-skyblue\:30\:dark,html.dark .sf-c-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}html[data-theme='dark'] .sf-c-skyblue\:40\:dark,html.dark .sf-c-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}html[data-theme='dark'] .sf-c-skyblue\:50\:dark,html.dark .sf-c-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-50))}html[data-theme='dark'] .sf-c-skyblue\:60\:dark,html.dark .sf-c-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-40))}html[data-theme='dark'] .sf-c-skyblue\:70\:dark,html.dark .sf-c-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}html[data-theme='dark'] .sf-c-skyblue\:80\:dark,html.dark .sf-c-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}html[data-theme='dark'] .sf-c-skyblue\:90\:dark,html.dark .sf-c-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}html[data-theme='dark'] .sf-c-skyblue\:100\:dark,html.dark .sf-c-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue,html.dark .sf-c-txt-skyblue{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='dark'] .sf-c-txt-skyblue\:0,html.dark .sf-c-txt-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue\:10,html.dark .sf-c-txt-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='dark'] .sf-c-txt-skyblue\:20,html.dark .sf-c-txt-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='dark'] .sf-c-txt-skyblue\:30,html.dark .sf-c-txt-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='dark'] .sf-c-txt-skyblue\:40,html.dark .sf-c-txt-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='dark'] .sf-c-txt-skyblue\:50,html.dark .sf-c-txt-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='dark'] .sf-c-txt-skyblue\:60,html.dark .sf-c-txt-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='dark'] .sf-c-txt-skyblue\:70,html.dark .sf-c-txt-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='dark'] .sf-c-txt-skyblue\:80,html.dark .sf-c-txt-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='dark'] .sf-c-txt-skyblue\:90,html.dark .sf-c-txt-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='dark'] .sf-c-txt-skyblue\:100,html.dark .sf-c-txt-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-100))}html[data-theme='dark'] .sf-c-txt-skyblue\:dark,html.dark .sf-c-txt-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='dark'] .sf-c-txt-skyblue\:0\:dark,html.dark .sf-c-txt-skyblue\:0\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue\:10\:dark,html.dark .sf-c-txt-skyblue\:10\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-10))}html[data-theme='dark'] .sf-c-txt-skyblue\:20\:dark,html.dark .sf-c-txt-skyblue\:20\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-20))}html[data-theme='dark'] .sf-c-txt-skyblue\:30\:dark,html.dark .sf-c-txt-skyblue\:30\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-30))}html[data-theme='dark'] .sf-c-txt-skyblue\:40\:dark,html.dark .sf-c-txt-skyblue\:40\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-40))}html[data-theme='dark'] .sf-c-txt-skyblue\:50\:dark,html.dark .sf-c-txt-skyblue\:50\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-50))}html[data-theme='dark'] .sf-c-txt-skyblue\:60\:dark,html.dark .sf-c-txt-skyblue\:60\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-60))}html[data-theme='dark'] .sf-c-txt-skyblue\:70\:dark,html.dark .sf-c-txt-skyblue\:70\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-70))}html[data-theme='dark'] .sf-c-txt-skyblue\:80\:dark,html.dark .sf-c-txt-skyblue\:80\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-80))}html[data-theme='dark'] .sf-c-txt-skyblue\:90\:dark,html.dark .sf-c-txt-skyblue\:90\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-90))}html[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark,html.dark .sf-c-txt-skyblue\:100\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-100))}html.var[data-theme='dark'] .sf-c-skyblue,html.var.dark .sf-c-skyblue{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='dark'] .sf-c-skyblue\:0,html.var.dark .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-skyblue\:10,html.var.dark .sf-c-skyblue\:10{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-skyblue\:20,html.var.dark .sf-c-skyblue\:20{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-skyblue\:30,html.var.dark .sf-c-skyblue\:30{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-skyblue\:40,html.var.dark .sf-c-skyblue\:40{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-skyblue\:50,html.var.dark .sf-c-skyblue\:50{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-skyblue\:60,html.var.dark .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-skyblue\:70,html.var.dark .sf-c-skyblue\:70{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-skyblue\:80,html.var.dark .sf-c-skyblue\:80{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-skyblue\:90,html.var.dark .sf-c-skyblue\:90{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-skyblue\:100,html.var.dark .sf-c-skyblue\:100{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-skyblue\:dark,html.var.dark .sf-c-skyblue\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='dark'] .sf-c-skyblue\:0\:dark,html.var.dark .sf-c-skyblue\:0\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-skyblue\:10\:dark,html.var.dark .sf-c-skyblue\:10\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-skyblue\:20\:dark,html.var.dark .sf-c-skyblue\:20\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-skyblue\:30\:dark,html.var.dark .sf-c-skyblue\:30\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-skyblue\:40\:dark,html.var.dark .sf-c-skyblue\:40\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-skyblue\:50\:dark,html.var.dark .sf-c-skyblue\:50\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-skyblue\:60\:dark,html.var.dark .sf-c-skyblue\:60\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-skyblue\:70\:dark,html.var.dark .sf-c-skyblue\:70\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-skyblue\:80\:dark,html.var.dark .sf-c-skyblue\:80\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-skyblue\:90\:dark,html.var.dark .sf-c-skyblue\:90\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-skyblue\:100\:dark,html.var.dark .sf-c-skyblue\:100\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue,html.dark .sf-c-txt-skyblue{color:hsl(197,71%,73%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:0,html.dark .sf-c-txt-skyblue\:0{color:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:10,html.dark .sf-c-txt-skyblue\:10{color:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:20,html.dark .sf-c-txt-skyblue\:20{color:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:30,html.dark .sf-c-txt-skyblue\:30{color:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:40,html.dark .sf-c-txt-skyblue\:40{color:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:50,html.dark .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:60,html.dark .sf-c-txt-skyblue\:60{color:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:70,html.dark .sf-c-txt-skyblue\:70{color:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:80,html.dark .sf-c-txt-skyblue\:80{color:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:90,html.dark .sf-c-txt-skyblue\:90{color:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:100,html.dark .sf-c-txt-skyblue\:100{color:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:dark,html.dark .sf-c-txt-skyblue\:dark{color:hsl(197,71%,73%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:0\:dark,html.dark .sf-c-txt-skyblue\:0\:dark{color:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:10\:dark,html.dark .sf-c-txt-skyblue\:10\:dark{color:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:20\:dark,html.dark .sf-c-txt-skyblue\:20\:dark{color:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:30\:dark,html.dark .sf-c-txt-skyblue\:30\:dark{color:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:40\:dark,html.dark .sf-c-txt-skyblue\:40\:dark{color:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:50\:dark,html.dark .sf-c-txt-skyblue\:50\:dark{color:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:60\:dark,html.dark .sf-c-txt-skyblue\:60\:dark{color:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:70\:dark,html.dark .sf-c-txt-skyblue\:70\:dark{color:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:80\:dark,html.dark .sf-c-txt-skyblue\:80\:dark{color:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:90\:dark,html.dark .sf-c-txt-skyblue\:90\:dark{color:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark,html.dark .sf-c-txt-skyblue\:100\:dark{color:hsl(197,71%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-skyblue,html.auto .sf-c-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue))}html[data-theme='auto'] .sf-c-skyblue\:0,html.auto .sf-c-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-100))}html[data-theme='auto'] .sf-c-skyblue\:10,html.auto .sf-c-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-90))}html[data-theme='auto'] .sf-c-skyblue\:20,html.auto .sf-c-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-80))}html[data-theme='auto'] .sf-c-skyblue\:30,html.auto .sf-c-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-70))}html[data-theme='auto'] .sf-c-skyblue\:40,html.auto .sf-c-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-60))}html[data-theme='auto'] .sf-c-skyblue\:50,html.auto .sf-c-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-50))}html[data-theme='auto'] .sf-c-skyblue\:60,html.auto .sf-c-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-40))}html[data-theme='auto'] .sf-c-skyblue\:70,html.auto .sf-c-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-30))}html[data-theme='auto'] .sf-c-skyblue\:80,html.auto .sf-c-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-20))}html[data-theme='auto'] .sf-c-skyblue\:90,html.auto .sf-c-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-10))}html[data-theme='auto'] .sf-c-skyblue\:100,html.auto .sf-c-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-0))}html[data-theme='auto'] .sf-c-skyblue\:dark,html.auto .sf-c-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue))}html[data-theme='auto'] .sf-c-skyblue\:0\:dark,html.auto .sf-c-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-100))}html[data-theme='auto'] .sf-c-skyblue\:10\:dark,html.auto .sf-c-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}html[data-theme='auto'] .sf-c-skyblue\:20\:dark,html.auto .sf-c-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}html[data-theme='auto'] .sf-c-skyblue\:30\:dark,html.auto .sf-c-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}html[data-theme='auto'] .sf-c-skyblue\:40\:dark,html.auto .sf-c-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}html[data-theme='auto'] .sf-c-skyblue\:50\:dark,html.auto .sf-c-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-50))}html[data-theme='auto'] .sf-c-skyblue\:60\:dark,html.auto .sf-c-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-40))}html[data-theme='auto'] .sf-c-skyblue\:70\:dark,html.auto .sf-c-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}html[data-theme='auto'] .sf-c-skyblue\:80\:dark,html.auto .sf-c-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}html[data-theme='auto'] .sf-c-skyblue\:90\:dark,html.auto .sf-c-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}html[data-theme='auto'] .sf-c-skyblue\:100\:dark,html.auto .sf-c-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue,html.auto .sf-c-txt-skyblue{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='auto'] .sf-c-txt-skyblue\:0,html.auto .sf-c-txt-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue\:10,html.auto .sf-c-txt-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='auto'] .sf-c-txt-skyblue\:20,html.auto .sf-c-txt-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='auto'] .sf-c-txt-skyblue\:30,html.auto .sf-c-txt-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='auto'] .sf-c-txt-skyblue\:40,html.auto .sf-c-txt-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='auto'] .sf-c-txt-skyblue\:50,html.auto .sf-c-txt-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='auto'] .sf-c-txt-skyblue\:60,html.auto .sf-c-txt-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='auto'] .sf-c-txt-skyblue\:70,html.auto .sf-c-txt-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='auto'] .sf-c-txt-skyblue\:80,html.auto .sf-c-txt-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='auto'] .sf-c-txt-skyblue\:90,html.auto .sf-c-txt-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='auto'] .sf-c-txt-skyblue\:100,html.auto .sf-c-txt-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-100))}html[data-theme='auto'] .sf-c-txt-skyblue\:dark,html.auto .sf-c-txt-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark,html.auto .sf-c-txt-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark,html.auto .sf-c-txt-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark,html.auto .sf-c-txt-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark,html.auto .sf-c-txt-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark,html.auto .sf-c-txt-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark,html.auto .sf-c-txt-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark,html.auto .sf-c-txt-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark,html.auto .sf-c-txt-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark,html.auto .sf-c-txt-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark,html.auto .sf-c-txt-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark,html.auto .sf-c-txt-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-100))}html.var[data-theme='auto'] .sf-c-skyblue,html.var.auto .sf-c-skyblue{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='auto'] .sf-c-skyblue\:0,html.var.auto .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-skyblue\:10,html.var.auto .sf-c-skyblue\:10{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-skyblue\:20,html.var.auto .sf-c-skyblue\:20{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-skyblue\:30,html.var.auto .sf-c-skyblue\:30{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-skyblue\:40,html.var.auto .sf-c-skyblue\:40{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-skyblue\:50,html.var.auto .sf-c-skyblue\:50{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-skyblue\:60,html.var.auto .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-skyblue\:70,html.var.auto .sf-c-skyblue\:70{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-skyblue\:80,html.var.auto .sf-c-skyblue\:80{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-skyblue\:90,html.var.auto .sf-c-skyblue\:90{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-skyblue\:100,html.var.auto .sf-c-skyblue\:100{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-skyblue\:dark,html.var.auto .sf-c-skyblue\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='auto'] .sf-c-skyblue\:0\:dark,html.var.auto .sf-c-skyblue\:0\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-skyblue\:10\:dark,html.var.auto .sf-c-skyblue\:10\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-skyblue\:20\:dark,html.var.auto .sf-c-skyblue\:20\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-skyblue\:30\:dark,html.var.auto .sf-c-skyblue\:30\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-skyblue\:40\:dark,html.var.auto .sf-c-skyblue\:40\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-skyblue\:50\:dark,html.var.auto .sf-c-skyblue\:50\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-skyblue\:60\:dark,html.var.auto .sf-c-skyblue\:60\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-skyblue\:70\:dark,html.var.auto .sf-c-skyblue\:70\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-skyblue\:80\:dark,html.var.auto .sf-c-skyblue\:80\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-skyblue\:90\:dark,html.var.auto .sf-c-skyblue\:90\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-skyblue\:100\:dark,html.var.auto .sf-c-skyblue\:100\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue,html.auto .sf-c-txt-skyblue{color:hsl(197,71%,73%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:0,html.auto .sf-c-txt-skyblue\:0{color:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:10,html.auto .sf-c-txt-skyblue\:10{color:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:20,html.auto .sf-c-txt-skyblue\:20{color:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:30,html.auto .sf-c-txt-skyblue\:30{color:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:40,html.auto .sf-c-txt-skyblue\:40{color:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:50,html.auto .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:60,html.auto .sf-c-txt-skyblue\:60{color:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:70,html.auto .sf-c-txt-skyblue\:70{color:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:80,html.auto .sf-c-txt-skyblue\:80{color:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:90,html.auto .sf-c-txt-skyblue\:90{color:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:100,html.auto .sf-c-txt-skyblue\:100{color:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark,html.auto .sf-c-txt-skyblue\:dark{color:hsl(197,71%,73%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark,html.auto .sf-c-txt-skyblue\:0\:dark{color:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark,html.auto .sf-c-txt-skyblue\:10\:dark{color:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark,html.auto .sf-c-txt-skyblue\:20\:dark{color:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark,html.auto .sf-c-txt-skyblue\:30\:dark{color:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark,html.auto .sf-c-txt-skyblue\:40\:dark{color:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark,html.auto .sf-c-txt-skyblue\:50\:dark{color:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark,html.auto .sf-c-txt-skyblue\:60\:dark{color:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark,html.auto .sf-c-txt-skyblue\:70\:dark{color:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark,html.auto .sf-c-txt-skyblue\:80\:dark{color:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark,html.auto .sf-c-txt-skyblue\:90\:dark{color:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark,html.auto .sf-c-txt-skyblue\:100\:dark{color:hsl(197,71%,100%)}}.sf-c-violet{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet))}.sf-c-violet\:0{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}.sf-c-violet\:10{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}.sf-c-violet\:20{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}.sf-c-violet\:30{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}.sf-c-violet\:40{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}.sf-c-violet\:50{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}.sf-c-violet\:60{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-60))}.sf-c-violet\:70{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-70))}.sf-c-violet\:80{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}.sf-c-violet\:90{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}.sf-c-violet\:100{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-100))}html.var .sf-c-violet{color:hsl(300,76%,10%);background:hsl(300,76%,72%)}html.var .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var .sf-c-violet\:10{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var .sf-c-violet\:20{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var .sf-c-violet\:30{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var .sf-c-violet\:40{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,60%)}html.var .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,70%)}html.var .sf-c-violet\:80{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var .sf-c-violet\:90{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var .sf-c-violet\:100{color:hsl(300,76%,10%);background:hsl(300,76%,100%)}.sf-c-txt-violet{color:hsl(var(--sf-dark-c-txt-violet))}.sf-c-txt-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-100))}.sf-c-txt-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-90))}.sf-c-txt-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-80))}.sf-c-txt-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-70))}.sf-c-txt-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-60))}.sf-c-txt-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-50))}.sf-c-txt-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-40))}.sf-c-txt-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-30))}.sf-c-txt-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-20))}.sf-c-txt-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-10))}.sf-c-txt-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-0))}html.var .sf-c-txt-violet{color:hsl(300,76%,28%)}html.var .sf-c-txt-violet\:0{color:hsl(300,76%,100%)}html.var .sf-c-txt-violet\:10{color:hsl(300,76%,90%)}html.var .sf-c-txt-violet\:20{color:hsl(300,76%,80%)}html.var .sf-c-txt-violet\:30{color:hsl(300,76%,70%)}html.var .sf-c-txt-violet\:40{color:hsl(300,76%,60%)}html.var .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var .sf-c-txt-violet\:60{color:hsl(300,76%,40%)}html.var .sf-c-txt-violet\:70{color:hsl(300,76%,30%)}html.var .sf-c-txt-violet\:80{color:hsl(300,76%,20%)}html.var .sf-c-txt-violet\:90{color:hsl(300,76%,10%)}html.var .sf-c-txt-violet\:100{color:hsl(300,76%,0%)}html[data-theme='dark'] .sf-c-violet,html.dark .sf-c-violet{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet))}html[data-theme='dark'] .sf-c-violet\:0,html.dark .sf-c-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-100))}html[data-theme='dark'] .sf-c-violet\:10,html.dark .sf-c-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-90))}html[data-theme='dark'] .sf-c-violet\:20,html.dark .sf-c-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-80))}html[data-theme='dark'] .sf-c-violet\:30,html.dark .sf-c-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-70))}html[data-theme='dark'] .sf-c-violet\:40,html.dark .sf-c-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-60))}html[data-theme='dark'] .sf-c-violet\:50,html.dark .sf-c-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-50))}html[data-theme='dark'] .sf-c-violet\:60,html.dark .sf-c-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-40))}html[data-theme='dark'] .sf-c-violet\:70,html.dark .sf-c-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-30))}html[data-theme='dark'] .sf-c-violet\:80,html.dark .sf-c-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-20))}html[data-theme='dark'] .sf-c-violet\:90,html.dark .sf-c-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-10))}html[data-theme='dark'] .sf-c-violet\:100,html.dark .sf-c-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-0))}html[data-theme='dark'] .sf-c-violet\:dark,html.dark .sf-c-violet\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet))}html[data-theme='dark'] .sf-c-violet\:0\:dark,html.dark .sf-c-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-100))}html[data-theme='dark'] .sf-c-violet\:10\:dark,html.dark .sf-c-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}html[data-theme='dark'] .sf-c-violet\:20\:dark,html.dark .sf-c-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}html[data-theme='dark'] .sf-c-violet\:30\:dark,html.dark .sf-c-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-70))}html[data-theme='dark'] .sf-c-violet\:40\:dark,html.dark .sf-c-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-60))}html[data-theme='dark'] .sf-c-violet\:50\:dark,html.dark .sf-c-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}html[data-theme='dark'] .sf-c-violet\:60\:dark,html.dark .sf-c-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}html[data-theme='dark'] .sf-c-violet\:70\:dark,html.dark .sf-c-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}html[data-theme='dark'] .sf-c-violet\:80\:dark,html.dark .sf-c-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}html[data-theme='dark'] .sf-c-violet\:90\:dark,html.dark .sf-c-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}html[data-theme='dark'] .sf-c-violet\:100\:dark,html.dark .sf-c-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}html[data-theme='dark'] .sf-c-txt-violet,html.dark .sf-c-txt-violet{color:hsl(var(--sf-c-txt-violet))}html[data-theme='dark'] .sf-c-txt-violet\:0,html.dark .sf-c-txt-violet\:0{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='dark'] .sf-c-txt-violet\:10,html.dark .sf-c-txt-violet\:10{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='dark'] .sf-c-txt-violet\:20,html.dark .sf-c-txt-violet\:20{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='dark'] .sf-c-txt-violet\:30,html.dark .sf-c-txt-violet\:30{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='dark'] .sf-c-txt-violet\:40,html.dark .sf-c-txt-violet\:40{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='dark'] .sf-c-txt-violet\:50,html.dark .sf-c-txt-violet\:50{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='dark'] .sf-c-txt-violet\:60,html.dark .sf-c-txt-violet\:60{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='dark'] .sf-c-txt-violet\:70,html.dark .sf-c-txt-violet\:70{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='dark'] .sf-c-txt-violet\:80,html.dark .sf-c-txt-violet\:80{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='dark'] .sf-c-txt-violet\:90,html.dark .sf-c-txt-violet\:90{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='dark'] .sf-c-txt-violet\:100,html.dark .sf-c-txt-violet\:100{color:hsl(var(--sf-c-txt-violet-100))}html[data-theme='dark'] .sf-c-txt-violet\:dark,html.dark .sf-c-txt-violet\:dark{color:hsl(var(--sf-c-txt-violet))}html[data-theme='dark'] .sf-c-txt-violet\:0\:dark,html.dark .sf-c-txt-violet\:0\:dark{color:hsl(var(--sf-dark-c-txt-violet-0))}html[data-theme='dark'] .sf-c-txt-violet\:10\:dark,html.dark .sf-c-txt-violet\:10\:dark{color:hsl(var(--sf-dark-c-txt-violet-10))}html[data-theme='dark'] .sf-c-txt-violet\:20\:dark,html.dark .sf-c-txt-violet\:20\:dark{color:hsl(var(--sf-dark-c-txt-violet-20))}html[data-theme='dark'] .sf-c-txt-violet\:30\:dark,html.dark .sf-c-txt-violet\:30\:dark{color:hsl(var(--sf-dark-c-txt-violet-30))}html[data-theme='dark'] .sf-c-txt-violet\:40\:dark,html.dark .sf-c-txt-violet\:40\:dark{color:hsl(var(--sf-dark-c-txt-violet-40))}html[data-theme='dark'] .sf-c-txt-violet\:50\:dark,html.dark .sf-c-txt-violet\:50\:dark{color:hsl(var(--sf-dark-c-txt-violet-50))}html[data-theme='dark'] .sf-c-txt-violet\:60\:dark,html.dark .sf-c-txt-violet\:60\:dark{color:hsl(var(--sf-dark-c-txt-violet-60))}html[data-theme='dark'] .sf-c-txt-violet\:70\:dark,html.dark .sf-c-txt-violet\:70\:dark{color:hsl(var(--sf-dark-c-txt-violet-70))}html[data-theme='dark'] .sf-c-txt-violet\:80\:dark,html.dark .sf-c-txt-violet\:80\:dark{color:hsl(var(--sf-dark-c-txt-violet-80))}html[data-theme='dark'] .sf-c-txt-violet\:90\:dark,html.dark .sf-c-txt-violet\:90\:dark{color:hsl(var(--sf-dark-c-txt-violet-90))}html[data-theme='dark'] .sf-c-txt-violet\:100\:dark,html.dark .sf-c-txt-violet\:100\:dark{color:hsl(var(--sf-dark-c-txt-violet-100))}html.var[data-theme='dark'] .sf-c-violet,html.var.dark .sf-c-violet{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='dark'] .sf-c-violet\:0,html.var.dark .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-violet\:10,html.var.dark .sf-c-violet\:10{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-violet\:20,html.var.dark .sf-c-violet\:20{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-violet\:30,html.var.dark .sf-c-violet\:30{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-violet\:40,html.var.dark .sf-c-violet\:40{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-violet\:50,html.var.dark .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-violet\:60,html.var.dark .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-violet\:70,html.var.dark .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-violet\:80,html.var.dark .sf-c-violet\:80{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-violet\:90,html.var.dark .sf-c-violet\:90{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-violet\:100,html.var.dark .sf-c-violet\:100{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-violet\:dark,html.var.dark .sf-c-violet\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='dark'] .sf-c-violet\:0\:dark,html.var.dark .sf-c-violet\:0\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-violet\:10\:dark,html.var.dark .sf-c-violet\:10\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-violet\:20\:dark,html.var.dark .sf-c-violet\:20\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-violet\:30\:dark,html.var.dark .sf-c-violet\:30\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-violet\:40\:dark,html.var.dark .sf-c-violet\:40\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-violet\:50\:dark,html.var.dark .sf-c-violet\:50\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-violet\:60\:dark,html.var.dark .sf-c-violet\:60\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-violet\:70\:dark,html.var.dark .sf-c-violet\:70\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-violet\:80\:dark,html.var.dark .sf-c-violet\:80\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-violet\:90\:dark,html.var.dark .sf-c-violet\:90\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-violet\:100\:dark,html.var.dark .sf-c-violet\:100\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet,html.dark .sf-c-txt-violet{color:hsl(300,76%,72%)}html.var[data-theme='dark'] .sf-c-txt-violet\:0,html.dark .sf-c-txt-violet\:0{color:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet\:10,html.dark .sf-c-txt-violet\:10{color:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-txt-violet\:20,html.dark .sf-c-txt-violet\:20{color:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-txt-violet\:30,html.dark .sf-c-txt-violet\:30{color:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-txt-violet\:40,html.dark .sf-c-txt-violet\:40{color:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-txt-violet\:50,html.dark .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-txt-violet\:60,html.dark .sf-c-txt-violet\:60{color:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-txt-violet\:70,html.dark .sf-c-txt-violet\:70{color:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-txt-violet\:80,html.dark .sf-c-txt-violet\:80{color:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-txt-violet\:90,html.dark .sf-c-txt-violet\:90{color:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-txt-violet\:100,html.dark .sf-c-txt-violet\:100{color:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-txt-violet\:dark,html.dark .sf-c-txt-violet\:dark{color:hsl(300,76%,72%)}html.var[data-theme='dark'] .sf-c-txt-violet\:0\:dark,html.dark .sf-c-txt-violet\:0\:dark{color:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet\:10\:dark,html.dark .sf-c-txt-violet\:10\:dark{color:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-txt-violet\:20\:dark,html.dark .sf-c-txt-violet\:20\:dark{color:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-txt-violet\:30\:dark,html.dark .sf-c-txt-violet\:30\:dark{color:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-txt-violet\:40\:dark,html.dark .sf-c-txt-violet\:40\:dark{color:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-txt-violet\:50\:dark,html.dark .sf-c-txt-violet\:50\:dark{color:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-txt-violet\:60\:dark,html.dark .sf-c-txt-violet\:60\:dark{color:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-txt-violet\:70\:dark,html.dark .sf-c-txt-violet\:70\:dark{color:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-txt-violet\:80\:dark,html.dark .sf-c-txt-violet\:80\:dark{color:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-txt-violet\:90\:dark,html.dark .sf-c-txt-violet\:90\:dark{color:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-txt-violet\:100\:dark,html.dark .sf-c-txt-violet\:100\:dark{color:hsl(300,76%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-violet,html.auto .sf-c-violet{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet))}html[data-theme='auto'] .sf-c-violet\:0,html.auto .sf-c-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-100))}html[data-theme='auto'] .sf-c-violet\:10,html.auto .sf-c-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-90))}html[data-theme='auto'] .sf-c-violet\:20,html.auto .sf-c-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-80))}html[data-theme='auto'] .sf-c-violet\:30,html.auto .sf-c-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-70))}html[data-theme='auto'] .sf-c-violet\:40,html.auto .sf-c-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-60))}html[data-theme='auto'] .sf-c-violet\:50,html.auto .sf-c-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-50))}html[data-theme='auto'] .sf-c-violet\:60,html.auto .sf-c-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-40))}html[data-theme='auto'] .sf-c-violet\:70,html.auto .sf-c-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-30))}html[data-theme='auto'] .sf-c-violet\:80,html.auto .sf-c-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-20))}html[data-theme='auto'] .sf-c-violet\:90,html.auto .sf-c-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-10))}html[data-theme='auto'] .sf-c-violet\:100,html.auto .sf-c-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-0))}html[data-theme='auto'] .sf-c-violet\:dark,html.auto .sf-c-violet\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet))}html[data-theme='auto'] .sf-c-violet\:0\:dark,html.auto .sf-c-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-100))}html[data-theme='auto'] .sf-c-violet\:10\:dark,html.auto .sf-c-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}html[data-theme='auto'] .sf-c-violet\:20\:dark,html.auto .sf-c-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}html[data-theme='auto'] .sf-c-violet\:30\:dark,html.auto .sf-c-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-70))}html[data-theme='auto'] .sf-c-violet\:40\:dark,html.auto .sf-c-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-60))}html[data-theme='auto'] .sf-c-violet\:50\:dark,html.auto .sf-c-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}html[data-theme='auto'] .sf-c-violet\:60\:dark,html.auto .sf-c-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}html[data-theme='auto'] .sf-c-violet\:70\:dark,html.auto .sf-c-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}html[data-theme='auto'] .sf-c-violet\:80\:dark,html.auto .sf-c-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}html[data-theme='auto'] .sf-c-violet\:90\:dark,html.auto .sf-c-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}html[data-theme='auto'] .sf-c-violet\:100\:dark,html.auto .sf-c-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}html[data-theme='auto'] .sf-c-txt-violet,html.auto .sf-c-txt-violet{color:hsl(var(--sf-c-txt-violet))}html[data-theme='auto'] .sf-c-txt-violet\:0,html.auto .sf-c-txt-violet\:0{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='auto'] .sf-c-txt-violet\:10,html.auto .sf-c-txt-violet\:10{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='auto'] .sf-c-txt-violet\:20,html.auto .sf-c-txt-violet\:20{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='auto'] .sf-c-txt-violet\:30,html.auto .sf-c-txt-violet\:30{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='auto'] .sf-c-txt-violet\:40,html.auto .sf-c-txt-violet\:40{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='auto'] .sf-c-txt-violet\:50,html.auto .sf-c-txt-violet\:50{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='auto'] .sf-c-txt-violet\:60,html.auto .sf-c-txt-violet\:60{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='auto'] .sf-c-txt-violet\:70,html.auto .sf-c-txt-violet\:70{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='auto'] .sf-c-txt-violet\:80,html.auto .sf-c-txt-violet\:80{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='auto'] .sf-c-txt-violet\:90,html.auto .sf-c-txt-violet\:90{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='auto'] .sf-c-txt-violet\:100,html.auto .sf-c-txt-violet\:100{color:hsl(var(--sf-c-txt-violet-100))}html[data-theme='auto'] .sf-c-txt-violet\:dark,html.auto .sf-c-txt-violet\:dark{color:hsl(var(--sf-c-txt-violet))}html[data-theme='auto'] .sf-c-txt-violet\:0\:dark,html.auto .sf-c-txt-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='auto'] .sf-c-txt-violet\:10\:dark,html.auto .sf-c-txt-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='auto'] .sf-c-txt-violet\:20\:dark,html.auto .sf-c-txt-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='auto'] .sf-c-txt-violet\:30\:dark,html.auto .sf-c-txt-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='auto'] .sf-c-txt-violet\:40\:dark,html.auto .sf-c-txt-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='auto'] .sf-c-txt-violet\:50\:dark,html.auto .sf-c-txt-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='auto'] .sf-c-txt-violet\:60\:dark,html.auto .sf-c-txt-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='auto'] .sf-c-txt-violet\:70\:dark,html.auto .sf-c-txt-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='auto'] .sf-c-txt-violet\:80\:dark,html.auto .sf-c-txt-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='auto'] .sf-c-txt-violet\:90\:dark,html.auto .sf-c-txt-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='auto'] .sf-c-txt-violet\:100\:dark,html.auto .sf-c-txt-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-100))}html.var[data-theme='auto'] .sf-c-violet,html.var.auto .sf-c-violet{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='auto'] .sf-c-violet\:0,html.var.auto .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-violet\:10,html.var.auto .sf-c-violet\:10{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-violet\:20,html.var.auto .sf-c-violet\:20{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-violet\:30,html.var.auto .sf-c-violet\:30{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-violet\:40,html.var.auto .sf-c-violet\:40{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-violet\:50,html.var.auto .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-violet\:60,html.var.auto .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-violet\:70,html.var.auto .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-violet\:80,html.var.auto .sf-c-violet\:80{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-violet\:90,html.var.auto .sf-c-violet\:90{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-violet\:100,html.var.auto .sf-c-violet\:100{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-violet\:dark,html.var.auto .sf-c-violet\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='auto'] .sf-c-violet\:0\:dark,html.var.auto .sf-c-violet\:0\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-violet\:10\:dark,html.var.auto .sf-c-violet\:10\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-violet\:20\:dark,html.var.auto .sf-c-violet\:20\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-violet\:30\:dark,html.var.auto .sf-c-violet\:30\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-violet\:40\:dark,html.var.auto .sf-c-violet\:40\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-violet\:50\:dark,html.var.auto .sf-c-violet\:50\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-violet\:60\:dark,html.var.auto .sf-c-violet\:60\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-violet\:70\:dark,html.var.auto .sf-c-violet\:70\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-violet\:80\:dark,html.var.auto .sf-c-violet\:80\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-violet\:90\:dark,html.var.auto .sf-c-violet\:90\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-violet\:100\:dark,html.var.auto .sf-c-violet\:100\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet,html.auto .sf-c-txt-violet{color:hsl(300,76%,72%)}html.var[data-theme='auto'] .sf-c-txt-violet\:0,html.auto .sf-c-txt-violet\:0{color:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet\:10,html.auto .sf-c-txt-violet\:10{color:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-txt-violet\:20,html.auto .sf-c-txt-violet\:20{color:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-txt-violet\:30,html.auto .sf-c-txt-violet\:30{color:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-txt-violet\:40,html.auto .sf-c-txt-violet\:40{color:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-txt-violet\:50,html.auto .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-txt-violet\:60,html.auto .sf-c-txt-violet\:60{color:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-txt-violet\:70,html.auto .sf-c-txt-violet\:70{color:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-txt-violet\:80,html.auto .sf-c-txt-violet\:80{color:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-txt-violet\:90,html.auto .sf-c-txt-violet\:90{color:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-txt-violet\:100,html.auto .sf-c-txt-violet\:100{color:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-txt-violet\:dark,html.auto .sf-c-txt-violet\:dark{color:hsl(300,76%,72%)}html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark,html.auto .sf-c-txt-violet\:0\:dark{color:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark,html.auto .sf-c-txt-violet\:10\:dark{color:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark,html.auto .sf-c-txt-violet\:20\:dark{color:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark,html.auto .sf-c-txt-violet\:30\:dark{color:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark,html.auto .sf-c-txt-violet\:40\:dark{color:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark,html.auto .sf-c-txt-violet\:50\:dark{color:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark,html.auto .sf-c-txt-violet\:60\:dark{color:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark,html.auto .sf-c-txt-violet\:70\:dark{color:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark,html.auto .sf-c-txt-violet\:80\:dark{color:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark,html.auto .sf-c-txt-violet\:90\:dark{color:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark,html.auto .sf-c-txt-violet\:100\:dark{color:hsl(300,76%,100%)}}.sf-c-yellow{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}.sf-c-yellow\:0{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}.sf-c-yellow\:10{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}.sf-c-yellow\:20{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}.sf-c-yellow\:30{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-30))}.sf-c-yellow\:40{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-40))}.sf-c-yellow\:50{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}.sf-c-yellow\:60{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}.sf-c-yellow\:70{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}.sf-c-yellow\:80{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}.sf-c-yellow\:90{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}.sf-c-yellow\:100{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-100))}html.var .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-yellow\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-yellow\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-yellow\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-yellow\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-yellow\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-yellow\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-yellow\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-yellow{color:hsl(var(--sf-dark-c-txt-yellow))}.sf-c-txt-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-100))}.sf-c-txt-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-90))}.sf-c-txt-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-80))}.sf-c-txt-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-70))}.sf-c-txt-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-60))}.sf-c-txt-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-50))}.sf-c-txt-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-40))}.sf-c-txt-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-30))}.sf-c-txt-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-20))}.sf-c-txt-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-10))}.sf-c-txt-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-0))}html.var .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-yellow\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-yellow\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-yellow\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-yellow\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-yellow\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-yellow\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-yellow\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-yellow\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-yellow,html.dark .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0,html.dark .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10,html.dark .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20,html.dark .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30,html.dark .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40,html.dark .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50,html.dark .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60,html.dark .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70,html.dark .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80,html.dark .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90,html.dark .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100,html.dark .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='dark'] .sf-c-yellow\:dark,html.dark .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0\:dark,html.dark .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10\:dark,html.dark .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20\:dark,html.dark .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30\:dark,html.dark .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40\:dark,html.dark .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50\:dark,html.dark .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60\:dark,html.dark .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70\:dark,html.dark .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80\:dark,html.dark .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90\:dark,html.dark .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100\:dark,html.dark .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-dark-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-dark-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-dark-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-dark-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-dark-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-dark-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-dark-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-dark-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-dark-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-dark-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-dark-c-txt-yellow-100))}html.var[data-theme='dark'] .sf-c-yellow,html.var.dark .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0,html.var.dark .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10,html.var.dark .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20,html.var.dark .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30,html.var.dark .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40,html.var.dark .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50,html.var.dark .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60,html.var.dark .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70,html.var.dark .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80,html.var.dark .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90,html.var.dark .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100,html.var.dark .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-yellow\:dark,html.var.dark .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0\:dark,html.var.dark .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10\:dark,html.var.dark .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20\:dark,html.var.dark .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30\:dark,html.var.dark .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40\:dark,html.var.dark .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50\:dark,html.var.dark .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60\:dark,html.var.dark .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70\:dark,html.var.dark .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80\:dark,html.var.dark .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90\:dark,html.var.dark .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100\:dark,html.var.dark .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-yellow,html.auto .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0,html.auto .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10,html.auto .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20,html.auto .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30,html.auto .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40,html.auto .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50,html.auto .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60,html.auto .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70,html.auto .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80,html.auto .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90,html.auto .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100,html.auto .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='auto'] .sf-c-yellow\:dark,html.auto .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0\:dark,html.auto .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10\:dark,html.auto .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20\:dark,html.auto .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30\:dark,html.auto .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40\:dark,html.auto .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50\:dark,html.auto .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60\:dark,html.auto .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70\:dark,html.auto .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80\:dark,html.auto .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90\:dark,html.auto .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100\:dark,html.auto .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-100))}html.var[data-theme='auto'] .sf-c-yellow,html.var.auto .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0,html.var.auto .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10,html.var.auto .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20,html.var.auto .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30,html.var.auto .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40,html.var.auto .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50,html.var.auto .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60,html.var.auto .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70,html.var.auto .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80,html.var.auto .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90,html.var.auto .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100,html.var.auto .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-yellow\:dark,html.var.auto .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0\:dark,html.var.auto .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10\:dark,html.var.auto .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20\:dark,html.var.auto .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30\:dark,html.var.auto .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40\:dark,html.var.auto .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50\:dark,html.var.auto .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60\:dark,html.var.auto .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70\:dark,html.var.auto .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80\:dark,html.var.auto .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90\:dark,html.var.auto .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100\:dark,html.var.auto .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}} \ No newline at end of file +[class*='black']{--sf-c-black:0 0% 0%;--sf-c-black-0:0 0% 0%;--sf-c-black-10:0 0% 10%;--sf-c-black-20:0 0% 20%;--sf-c-black-30:0 0% 30%;--sf-c-black-40:0 0% 40%;--sf-c-black-50:0 0% 50%;--sf-c-black-60:0 0% 60%;--sf-c-black-70:0 0% 70%;--sf-c-black-80:0 0% 80%;--sf-c-black-90:0 0% 90%;--sf-c-black-100:0 0% 100%;--sf-c-txt-black:var(--sf-c-black);--sf-c-txt-black-0:var(--sf-c-black-0);--sf-c-txt-black-10:var(--sf-c-black-10);--sf-c-txt-black-20:var(--sf-c-black-20);--sf-c-txt-black-30:var(--sf-c-black-30);--sf-c-txt-black-40:var(--sf-c-black-40);--sf-c-txt-black-50:var(--sf-c-black-50);--sf-c-txt-black-60:var(--sf-c-black-60);--sf-c-txt-black-70:var(--sf-c-black-70);--sf-c-txt-black-80:var(--sf-c-black-80);--sf-c-txt-black-90:var(--sf-c-black-90);--sf-c-txt-black-100:var(--sf-c-black-100);--sf-dark-c-black:0 0% 100%;--sf-dark-c-black-0:0 0% 0%;--sf-dark-c-black-10:0 0% 10%;--sf-dark-c-black-20:0 0% 20%;--sf-dark-c-black-30:0 0% 30%;--sf-dark-c-black-40:0 0% 40%;--sf-dark-c-black-50:0 0% 50%;--sf-dark-c-black-60:0 0% 60%;--sf-dark-c-black-70:0 0% 70%;--sf-dark-c-black-80:0 0% 80%;--sf-dark-c-black-90:0 0% 90%;--sf-dark-c-black-100:0 0% 100%;--sf-dark-c-txt-black:var(--sf-dark-c-black);--sf-dark-c-txt-black-0:var(--sf-dark-c-black-0);--sf-dark-c-txt-black-10:var(--sf-dark-c-black-10);--sf-dark-c-txt-black-20:var(--sf-dark-c-black-20);--sf-dark-c-txt-black-30:var(--sf-dark-c-black-30);--sf-dark-c-txt-black-40:var(--sf-dark-c-black-40);--sf-dark-c-txt-black-50:var(--sf-dark-c-black-50);--sf-dark-c-txt-black-60:var(--sf-dark-c-black-60);--sf-dark-c-txt-black-70:var(--sf-dark-c-black-70);--sf-dark-c-txt-black-80:var(--sf-dark-c-black-80);--sf-dark-c-txt-black-90:var(--sf-dark-c-black-90);--sf-dark-c-txt-black-100:var(--sf-dark-c-black-100)}.sf-c-black{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black))}.sf-c-black\:0{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}.sf-c-black\:10{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}.sf-c-black\:20{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}.sf-c-black\:30{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}.sf-c-black\:40{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}.sf-c-black\:50{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-50))}.sf-c-black\:60{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-60))}.sf-c-black\:70{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}.sf-c-black\:80{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}.sf-c-black\:90{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}.sf-c-black\:100{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-100))}html.var .sf-c-black{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-black\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-black\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-black\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-black\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-black\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-black\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-black\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-black\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-black{color:hsl(var(--sf-dark-c-txt-black))}.sf-c-txt-black\:0{color:hsl(var(--sf-dark-c-txt-black-100))}.sf-c-txt-black\:10{color:hsl(var(--sf-dark-c-txt-black-90))}.sf-c-txt-black\:20{color:hsl(var(--sf-dark-c-txt-black-80))}.sf-c-txt-black\:30{color:hsl(var(--sf-dark-c-txt-black-70))}.sf-c-txt-black\:40{color:hsl(var(--sf-dark-c-txt-black-60))}.sf-c-txt-black\:50{color:hsl(var(--sf-dark-c-txt-black-50))}.sf-c-txt-black\:60{color:hsl(var(--sf-dark-c-txt-black-40))}.sf-c-txt-black\:70{color:hsl(var(--sf-dark-c-txt-black-30))}.sf-c-txt-black\:80{color:hsl(var(--sf-dark-c-txt-black-20))}.sf-c-txt-black\:90{color:hsl(var(--sf-dark-c-txt-black-10))}.sf-c-txt-black\:100{color:hsl(var(--sf-dark-c-txt-black-0))}html.var .sf-c-txt-black{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-black\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-black\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-black\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-black\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-black\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-black\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-black\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-black\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-black,html.dark .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='dark'] .sf-c-black\:0,html.dark .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='dark'] .sf-c-black\:10,html.dark .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='dark'] .sf-c-black\:20,html.dark .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='dark'] .sf-c-black\:30,html.dark .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='dark'] .sf-c-black\:40,html.dark .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='dark'] .sf-c-black\:50,html.dark .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='dark'] .sf-c-black\:60,html.dark .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='dark'] .sf-c-black\:70,html.dark .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='dark'] .sf-c-black\:80,html.dark .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='dark'] .sf-c-black\:90,html.dark .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='dark'] .sf-c-black\:100,html.dark .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='dark'] .sf-c-black\:dark,html.dark .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='dark'] .sf-c-black\:0\:dark,html.dark .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='dark'] .sf-c-black\:10\:dark,html.dark .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='dark'] .sf-c-black\:20\:dark,html.dark .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='dark'] .sf-c-black\:30\:dark,html.dark .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='dark'] .sf-c-black\:40\:dark,html.dark .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='dark'] .sf-c-black\:50\:dark,html.dark .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='dark'] .sf-c-black\:60\:dark,html.dark .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='dark'] .sf-c-black\:70\:dark,html.dark .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='dark'] .sf-c-black\:80\:dark,html.dark .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='dark'] .sf-c-black\:90\:dark,html.dark .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='dark'] .sf-c-black\:100\:dark,html.dark .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-dark-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-dark-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-dark-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-dark-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-dark-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-dark-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-dark-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-dark-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-dark-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-dark-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-dark-c-txt-black-100))}html.var[data-theme='dark'] .sf-c-black,html.var.dark .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0,html.var.dark .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10,html.var.dark .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20,html.var.dark .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30,html.var.dark .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40,html.var.dark .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50,html.var.dark .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60,html.var.dark .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70,html.var.dark .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80,html.var.dark .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90,html.var.dark .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100,html.var.dark .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-black\:dark,html.var.dark .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0\:dark,html.var.dark .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10\:dark,html.var.dark .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20\:dark,html.var.dark .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30\:dark,html.var.dark .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40\:dark,html.var.dark .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50\:dark,html.var.dark .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60\:dark,html.var.dark .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70\:dark,html.var.dark .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80\:dark,html.var.dark .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90\:dark,html.var.dark .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100\:dark,html.var.dark .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-black,html.auto .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='auto'] .sf-c-black\:0,html.auto .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='auto'] .sf-c-black\:10,html.auto .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='auto'] .sf-c-black\:20,html.auto .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='auto'] .sf-c-black\:30,html.auto .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='auto'] .sf-c-black\:40,html.auto .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='auto'] .sf-c-black\:50,html.auto .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='auto'] .sf-c-black\:60,html.auto .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='auto'] .sf-c-black\:70,html.auto .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='auto'] .sf-c-black\:80,html.auto .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='auto'] .sf-c-black\:90,html.auto .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='auto'] .sf-c-black\:100,html.auto .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='auto'] .sf-c-black\:dark,html.auto .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='auto'] .sf-c-black\:0\:dark,html.auto .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='auto'] .sf-c-black\:10\:dark,html.auto .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='auto'] .sf-c-black\:20\:dark,html.auto .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='auto'] .sf-c-black\:30\:dark,html.auto .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='auto'] .sf-c-black\:40\:dark,html.auto .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='auto'] .sf-c-black\:50\:dark,html.auto .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='auto'] .sf-c-black\:60\:dark,html.auto .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='auto'] .sf-c-black\:70\:dark,html.auto .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='auto'] .sf-c-black\:80\:dark,html.auto .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='auto'] .sf-c-black\:90\:dark,html.auto .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='auto'] .sf-c-black\:100\:dark,html.auto .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-c-txt-black-100))}html.var[data-theme='auto'] .sf-c-black,html.var.auto .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0,html.var.auto .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10,html.var.auto .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20,html.var.auto .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30,html.var.auto .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40,html.var.auto .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50,html.var.auto .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60,html.var.auto .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70,html.var.auto .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80,html.var.auto .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90,html.var.auto .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100,html.var.auto .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-black\:dark,html.var.auto .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0\:dark,html.var.auto .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10\:dark,html.var.auto .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20\:dark,html.var.auto .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30\:dark,html.var.auto .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40\:dark,html.var.auto .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50\:dark,html.var.auto .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60\:dark,html.var.auto .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70\:dark,html.var.auto .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80\:dark,html.var.auto .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90\:dark,html.var.auto .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100\:dark,html.var.auto .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}}[class*='blue']{--sf-c-blue:240 100% 50%;--sf-c-blue-0:240 100% 0%;--sf-c-blue-10:240 100% 10%;--sf-c-blue-20:240 100% 20%;--sf-c-blue-30:240 100% 30%;--sf-c-blue-40:240 100% 40%;--sf-c-blue-50:240 100% 50%;--sf-c-blue-60:240 100% 60%;--sf-c-blue-70:240 100% 70%;--sf-c-blue-80:240 100% 80%;--sf-c-blue-90:240 100% 90%;--sf-c-blue-100:240 100% 100%;--sf-c-txt-blue:var(--sf-c-blue);--sf-c-txt-blue-0:var(--sf-c-blue-0);--sf-c-txt-blue-10:var(--sf-c-blue-10);--sf-c-txt-blue-20:var(--sf-c-blue-20);--sf-c-txt-blue-30:var(--sf-c-blue-30);--sf-c-txt-blue-40:var(--sf-c-blue-40);--sf-c-txt-blue-50:var(--sf-c-blue-50);--sf-c-txt-blue-60:var(--sf-c-blue-60);--sf-c-txt-blue-70:var(--sf-c-blue-70);--sf-c-txt-blue-80:var(--sf-c-blue-80);--sf-c-txt-blue-90:var(--sf-c-blue-90);--sf-c-txt-blue-100:var(--sf-c-blue-100);--sf-dark-c-blue:240 100% 50%;--sf-dark-c-blue-0:240 100% 0%;--sf-dark-c-blue-10:240 100% 10%;--sf-dark-c-blue-20:240 100% 20%;--sf-dark-c-blue-30:240 100% 30%;--sf-dark-c-blue-40:240 100% 40%;--sf-dark-c-blue-50:240 100% 50%;--sf-dark-c-blue-60:240 100% 60%;--sf-dark-c-blue-70:240 100% 70%;--sf-dark-c-blue-80:240 100% 80%;--sf-dark-c-blue-90:240 100% 90%;--sf-dark-c-blue-100:240 100% 100%;--sf-dark-c-txt-blue:var(--sf-dark-c-blue);--sf-dark-c-txt-blue-0:var(--sf-dark-c-blue-0);--sf-dark-c-txt-blue-10:var(--sf-dark-c-blue-10);--sf-dark-c-txt-blue-20:var(--sf-dark-c-blue-20);--sf-dark-c-txt-blue-30:var(--sf-dark-c-blue-30);--sf-dark-c-txt-blue-40:var(--sf-dark-c-blue-40);--sf-dark-c-txt-blue-50:var(--sf-dark-c-blue-50);--sf-dark-c-txt-blue-60:var(--sf-dark-c-blue-60);--sf-dark-c-txt-blue-70:var(--sf-dark-c-blue-70);--sf-dark-c-txt-blue-80:var(--sf-dark-c-blue-80);--sf-dark-c-txt-blue-90:var(--sf-dark-c-blue-90);--sf-dark-c-txt-blue-100:var(--sf-dark-c-blue-100)}.sf-c-blue{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}.sf-c-blue\:0{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}.sf-c-blue\:10{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}.sf-c-blue\:20{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}.sf-c-blue\:30{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}.sf-c-blue\:40{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}.sf-c-blue\:50{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}.sf-c-blue\:60{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}.sf-c-blue\:70{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-70))}.sf-c-blue\:80{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-80))}.sf-c-blue\:90{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}.sf-c-blue\:100{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-100))}html.var .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-blue\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-blue\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-blue\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-blue\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-blue\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-blue{color:hsl(var(--sf-dark-c-txt-blue))}.sf-c-txt-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-100))}.sf-c-txt-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-90))}.sf-c-txt-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-80))}.sf-c-txt-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-70))}.sf-c-txt-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-60))}.sf-c-txt-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-50))}.sf-c-txt-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-40))}.sf-c-txt-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-30))}.sf-c-txt-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-20))}.sf-c-txt-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-10))}.sf-c-txt-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-0))}html.var .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-blue\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-blue\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-blue\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-blue\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-blue\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-blue\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-blue\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-blue\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-blue,html.dark .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='dark'] .sf-c-blue\:0,html.dark .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10,html.dark .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20,html.dark .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30,html.dark .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40,html.dark .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50,html.dark .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60,html.dark .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70,html.dark .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80,html.dark .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90,html.dark .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100,html.dark .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='dark'] .sf-c-blue\:dark,html.dark .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='dark'] .sf-c-blue\:0\:dark,html.dark .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10\:dark,html.dark .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20\:dark,html.dark .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30\:dark,html.dark .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40\:dark,html.dark .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50\:dark,html.dark .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60\:dark,html.dark .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70\:dark,html.dark .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80\:dark,html.dark .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90\:dark,html.dark .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100\:dark,html.dark .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-dark-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-dark-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-dark-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-dark-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-dark-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-dark-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-dark-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-dark-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-dark-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-dark-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-dark-c-txt-blue-100))}html.var[data-theme='dark'] .sf-c-blue,html.var.dark .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0,html.var.dark .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10,html.var.dark .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20,html.var.dark .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30,html.var.dark .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40,html.var.dark .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50,html.var.dark .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60,html.var.dark .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70,html.var.dark .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80,html.var.dark .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90,html.var.dark .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100,html.var.dark .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-blue\:dark,html.var.dark .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0\:dark,html.var.dark .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10\:dark,html.var.dark .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20\:dark,html.var.dark .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30\:dark,html.var.dark .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40\:dark,html.var.dark .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50\:dark,html.var.dark .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60\:dark,html.var.dark .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70\:dark,html.var.dark .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80\:dark,html.var.dark .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90\:dark,html.var.dark .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100\:dark,html.var.dark .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-blue,html.auto .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='auto'] .sf-c-blue\:0,html.auto .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10,html.auto .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20,html.auto .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30,html.auto .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40,html.auto .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50,html.auto .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60,html.auto .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70,html.auto .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80,html.auto .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90,html.auto .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100,html.auto .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='auto'] .sf-c-blue\:dark,html.auto .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='auto'] .sf-c-blue\:0\:dark,html.auto .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10\:dark,html.auto .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20\:dark,html.auto .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30\:dark,html.auto .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40\:dark,html.auto .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50\:dark,html.auto .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60\:dark,html.auto .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70\:dark,html.auto .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80\:dark,html.auto .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90\:dark,html.auto .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100\:dark,html.auto .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-100))}html.var[data-theme='auto'] .sf-c-blue,html.var.auto .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0,html.var.auto .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10,html.var.auto .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20,html.var.auto .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30,html.var.auto .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40,html.var.auto .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50,html.var.auto .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60,html.var.auto .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70,html.var.auto .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80,html.var.auto .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90,html.var.auto .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100,html.var.auto .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-blue\:dark,html.var.auto .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0\:dark,html.var.auto .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10\:dark,html.var.auto .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20\:dark,html.var.auto .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30\:dark,html.var.auto .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40\:dark,html.var.auto .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50\:dark,html.var.auto .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60\:dark,html.var.auto .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70\:dark,html.var.auto .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80\:dark,html.var.auto .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90\:dark,html.var.auto .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100\:dark,html.var.auto .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}}[class*='green']{--sf-c-green:120 100% 25%;--sf-c-green-0:120 100% 0%;--sf-c-green-10:120 100% 10%;--sf-c-green-20:120 100% 20%;--sf-c-green-30:120 100% 30%;--sf-c-green-40:120 100% 40%;--sf-c-green-50:120 100% 50%;--sf-c-green-60:120 100% 60%;--sf-c-green-70:120 100% 70%;--sf-c-green-80:120 100% 80%;--sf-c-green-90:120 100% 90%;--sf-c-green-100:120 100% 100%;--sf-c-txt-green:var(--sf-c-green);--sf-c-txt-green-0:var(--sf-c-green-0);--sf-c-txt-green-10:var(--sf-c-green-10);--sf-c-txt-green-20:var(--sf-c-green-20);--sf-c-txt-green-30:var(--sf-c-green-30);--sf-c-txt-green-40:var(--sf-c-green-40);--sf-c-txt-green-50:var(--sf-c-green-50);--sf-c-txt-green-60:var(--sf-c-green-60);--sf-c-txt-green-70:var(--sf-c-green-70);--sf-c-txt-green-80:var(--sf-c-green-80);--sf-c-txt-green-90:var(--sf-c-green-90);--sf-c-txt-green-100:var(--sf-c-green-100);--sf-dark-c-green:120 100% 75%;--sf-dark-c-green-0:120 100% 0%;--sf-dark-c-green-10:120 100% 10%;--sf-dark-c-green-20:120 100% 20%;--sf-dark-c-green-30:120 100% 30%;--sf-dark-c-green-40:120 100% 40%;--sf-dark-c-green-50:120 100% 50%;--sf-dark-c-green-60:120 100% 60%;--sf-dark-c-green-70:120 100% 70%;--sf-dark-c-green-80:120 100% 80%;--sf-dark-c-green-90:120 100% 90%;--sf-dark-c-green-100:120 100% 100%;--sf-dark-c-txt-green:var(--sf-dark-c-green);--sf-dark-c-txt-green-0:var(--sf-dark-c-green-0);--sf-dark-c-txt-green-10:var(--sf-dark-c-green-10);--sf-dark-c-txt-green-20:var(--sf-dark-c-green-20);--sf-dark-c-txt-green-30:var(--sf-dark-c-green-30);--sf-dark-c-txt-green-40:var(--sf-dark-c-green-40);--sf-dark-c-txt-green-50:var(--sf-dark-c-green-50);--sf-dark-c-txt-green-60:var(--sf-dark-c-green-60);--sf-dark-c-txt-green-70:var(--sf-dark-c-green-70);--sf-dark-c-txt-green-80:var(--sf-dark-c-green-80);--sf-dark-c-txt-green-90:var(--sf-dark-c-green-90);--sf-dark-c-txt-green-100:var(--sf-dark-c-green-100)}.sf-c-green{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green))}.sf-c-green\:0{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}.sf-c-green\:10{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}.sf-c-green\:20{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}.sf-c-green\:30{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-30))}.sf-c-green\:40{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-40))}.sf-c-green\:50{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}.sf-c-green\:60{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}.sf-c-green\:70{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}.sf-c-green\:80{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}.sf-c-green\:90{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}.sf-c-green\:100{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-100))}html.var .sf-c-green{color:hsl(120,100%,90%);background:hsl(120,100%,25%)}html.var .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-green\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-green\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-green\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-green\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-green\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-green\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-green\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-green{color:hsl(var(--sf-dark-c-txt-green))}.sf-c-txt-green\:0{color:hsl(var(--sf-dark-c-txt-green-100))}.sf-c-txt-green\:10{color:hsl(var(--sf-dark-c-txt-green-90))}.sf-c-txt-green\:20{color:hsl(var(--sf-dark-c-txt-green-80))}.sf-c-txt-green\:30{color:hsl(var(--sf-dark-c-txt-green-70))}.sf-c-txt-green\:40{color:hsl(var(--sf-dark-c-txt-green-60))}.sf-c-txt-green\:50{color:hsl(var(--sf-dark-c-txt-green-50))}.sf-c-txt-green\:60{color:hsl(var(--sf-dark-c-txt-green-40))}.sf-c-txt-green\:70{color:hsl(var(--sf-dark-c-txt-green-30))}.sf-c-txt-green\:80{color:hsl(var(--sf-dark-c-txt-green-20))}.sf-c-txt-green\:90{color:hsl(var(--sf-dark-c-txt-green-10))}.sf-c-txt-green\:100{color:hsl(var(--sf-dark-c-txt-green-0))}html.var .sf-c-txt-green{color:hsl(120,100%,75%)}html.var .sf-c-txt-green\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-green\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-green\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-green\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-green\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-green\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-green\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-green\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-green\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-green\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-green,html.dark .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='dark'] .sf-c-green\:0,html.dark .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='dark'] .sf-c-green\:10,html.dark .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='dark'] .sf-c-green\:20,html.dark .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='dark'] .sf-c-green\:30,html.dark .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='dark'] .sf-c-green\:40,html.dark .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='dark'] .sf-c-green\:50,html.dark .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='dark'] .sf-c-green\:60,html.dark .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='dark'] .sf-c-green\:70,html.dark .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='dark'] .sf-c-green\:80,html.dark .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='dark'] .sf-c-green\:90,html.dark .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='dark'] .sf-c-green\:100,html.dark .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='dark'] .sf-c-green\:dark,html.dark .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='dark'] .sf-c-green\:0\:dark,html.dark .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='dark'] .sf-c-green\:10\:dark,html.dark .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='dark'] .sf-c-green\:20\:dark,html.dark .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='dark'] .sf-c-green\:30\:dark,html.dark .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='dark'] .sf-c-green\:40\:dark,html.dark .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='dark'] .sf-c-green\:50\:dark,html.dark .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='dark'] .sf-c-green\:60\:dark,html.dark .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='dark'] .sf-c-green\:70\:dark,html.dark .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='dark'] .sf-c-green\:80\:dark,html.dark .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='dark'] .sf-c-green\:90\:dark,html.dark .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='dark'] .sf-c-green\:100\:dark,html.dark .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-dark-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-dark-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-dark-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-dark-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-dark-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-dark-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-dark-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-dark-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-dark-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-dark-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-dark-c-txt-green-100))}html.var[data-theme='dark'] .sf-c-green,html.var.dark .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0,html.var.dark .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10,html.var.dark .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20,html.var.dark .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30,html.var.dark .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40,html.var.dark .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50,html.var.dark .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60,html.var.dark .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70,html.var.dark .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80,html.var.dark .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90,html.var.dark .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100,html.var.dark .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-green\:dark,html.var.dark .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0\:dark,html.var.dark .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10\:dark,html.var.dark .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20\:dark,html.var.dark .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30\:dark,html.var.dark .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40\:dark,html.var.dark .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50\:dark,html.var.dark .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60\:dark,html.var.dark .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70\:dark,html.var.dark .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80\:dark,html.var.dark .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90\:dark,html.var.dark .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100\:dark,html.var.dark .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-green,html.auto .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='auto'] .sf-c-green\:0,html.auto .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='auto'] .sf-c-green\:10,html.auto .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='auto'] .sf-c-green\:20,html.auto .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='auto'] .sf-c-green\:30,html.auto .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='auto'] .sf-c-green\:40,html.auto .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='auto'] .sf-c-green\:50,html.auto .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='auto'] .sf-c-green\:60,html.auto .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='auto'] .sf-c-green\:70,html.auto .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='auto'] .sf-c-green\:80,html.auto .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='auto'] .sf-c-green\:90,html.auto .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='auto'] .sf-c-green\:100,html.auto .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='auto'] .sf-c-green\:dark,html.auto .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='auto'] .sf-c-green\:0\:dark,html.auto .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='auto'] .sf-c-green\:10\:dark,html.auto .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='auto'] .sf-c-green\:20\:dark,html.auto .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='auto'] .sf-c-green\:30\:dark,html.auto .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='auto'] .sf-c-green\:40\:dark,html.auto .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='auto'] .sf-c-green\:50\:dark,html.auto .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='auto'] .sf-c-green\:60\:dark,html.auto .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='auto'] .sf-c-green\:70\:dark,html.auto .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='auto'] .sf-c-green\:80\:dark,html.auto .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='auto'] .sf-c-green\:90\:dark,html.auto .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='auto'] .sf-c-green\:100\:dark,html.auto .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-c-txt-green-100))}html.var[data-theme='auto'] .sf-c-green,html.var.auto .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0,html.var.auto .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10,html.var.auto .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20,html.var.auto .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30,html.var.auto .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40,html.var.auto .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50,html.var.auto .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60,html.var.auto .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70,html.var.auto .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80,html.var.auto .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90,html.var.auto .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100,html.var.auto .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-green\:dark,html.var.auto .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0\:dark,html.var.auto .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10\:dark,html.var.auto .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20\:dark,html.var.auto .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30\:dark,html.var.auto .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40\:dark,html.var.auto .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50\:dark,html.var.auto .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60\:dark,html.var.auto .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70\:dark,html.var.auto .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80\:dark,html.var.auto .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90\:dark,html.var.auto .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100\:dark,html.var.auto .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}}[class*='orange']{--sf-c-orange:39 100% 50%;--sf-c-orange-0:39 100% 0%;--sf-c-orange-10:39 100% 10%;--sf-c-orange-20:39 100% 20%;--sf-c-orange-30:39 100% 30%;--sf-c-orange-40:39 100% 40%;--sf-c-orange-50:39 100% 50%;--sf-c-orange-60:39 100% 60%;--sf-c-orange-70:39 100% 70%;--sf-c-orange-80:39 100% 80%;--sf-c-orange-90:39 100% 90%;--sf-c-orange-100:39 100% 100%;--sf-c-txt-orange:var(--sf-c-orange);--sf-c-txt-orange-0:var(--sf-c-orange-0);--sf-c-txt-orange-10:var(--sf-c-orange-10);--sf-c-txt-orange-20:var(--sf-c-orange-20);--sf-c-txt-orange-30:var(--sf-c-orange-30);--sf-c-txt-orange-40:var(--sf-c-orange-40);--sf-c-txt-orange-50:var(--sf-c-orange-50);--sf-c-txt-orange-60:var(--sf-c-orange-60);--sf-c-txt-orange-70:var(--sf-c-orange-70);--sf-c-txt-orange-80:var(--sf-c-orange-80);--sf-c-txt-orange-90:var(--sf-c-orange-90);--sf-c-txt-orange-100:var(--sf-c-orange-100);--sf-dark-c-orange:39 100% 50%;--sf-dark-c-orange-0:39 100% 0%;--sf-dark-c-orange-10:39 100% 10%;--sf-dark-c-orange-20:39 100% 20%;--sf-dark-c-orange-30:39 100% 30%;--sf-dark-c-orange-40:39 100% 40%;--sf-dark-c-orange-50:39 100% 50%;--sf-dark-c-orange-60:39 100% 60%;--sf-dark-c-orange-70:39 100% 70%;--sf-dark-c-orange-80:39 100% 80%;--sf-dark-c-orange-90:39 100% 90%;--sf-dark-c-orange-100:39 100% 100%;--sf-dark-c-txt-orange:var(--sf-dark-c-orange);--sf-dark-c-txt-orange-0:var(--sf-dark-c-orange-0);--sf-dark-c-txt-orange-10:var(--sf-dark-c-orange-10);--sf-dark-c-txt-orange-20:var(--sf-dark-c-orange-20);--sf-dark-c-txt-orange-30:var(--sf-dark-c-orange-30);--sf-dark-c-txt-orange-40:var(--sf-dark-c-orange-40);--sf-dark-c-txt-orange-50:var(--sf-dark-c-orange-50);--sf-dark-c-txt-orange-60:var(--sf-dark-c-orange-60);--sf-dark-c-txt-orange-70:var(--sf-dark-c-orange-70);--sf-dark-c-txt-orange-80:var(--sf-dark-c-orange-80);--sf-dark-c-txt-orange-90:var(--sf-dark-c-orange-90);--sf-dark-c-txt-orange-100:var(--sf-dark-c-orange-100)}.sf-c-orange{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}.sf-c-orange\:0{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}.sf-c-orange\:10{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}.sf-c-orange\:20{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}.sf-c-orange\:30{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}.sf-c-orange\:40{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-40))}.sf-c-orange\:50{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-50))}.sf-c-orange\:60{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}.sf-c-orange\:70{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}.sf-c-orange\:80{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}.sf-c-orange\:90{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}.sf-c-orange\:100{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-100))}html.var .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var .sf-c-orange\:10{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var .sf-c-orange\:20{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var .sf-c-orange\:30{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var .sf-c-orange\:40{color:hsl(39,100%,90%);background:hsl(39,100%,40%)}html.var .sf-c-orange\:50{color:hsl(39,100%,90%);background:hsl(39,100%,50%)}html.var .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var .sf-c-orange\:70{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var .sf-c-orange\:80{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var .sf-c-orange\:90{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var .sf-c-orange\:100{color:hsl(39,100%,10%);background:hsl(39,100%,100%)}.sf-c-txt-orange{color:hsl(var(--sf-dark-c-txt-orange))}.sf-c-txt-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-100))}.sf-c-txt-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-90))}.sf-c-txt-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-80))}.sf-c-txt-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-70))}.sf-c-txt-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-60))}.sf-c-txt-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-50))}.sf-c-txt-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-40))}.sf-c-txt-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-30))}.sf-c-txt-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-20))}.sf-c-txt-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-10))}.sf-c-txt-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-0))}html.var .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var .sf-c-txt-orange\:0{color:hsl(39,100%,100%)}html.var .sf-c-txt-orange\:10{color:hsl(39,100%,90%)}html.var .sf-c-txt-orange\:20{color:hsl(39,100%,80%)}html.var .sf-c-txt-orange\:30{color:hsl(39,100%,70%)}html.var .sf-c-txt-orange\:40{color:hsl(39,100%,60%)}html.var .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var .sf-c-txt-orange\:60{color:hsl(39,100%,40%)}html.var .sf-c-txt-orange\:70{color:hsl(39,100%,30%)}html.var .sf-c-txt-orange\:80{color:hsl(39,100%,20%)}html.var .sf-c-txt-orange\:90{color:hsl(39,100%,10%)}html.var .sf-c-txt-orange\:100{color:hsl(39,100%,0%)}html[data-theme='dark'] .sf-c-orange,html.dark .sf-c-orange{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange))}html[data-theme='dark'] .sf-c-orange\:0,html.dark .sf-c-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-100))}html[data-theme='dark'] .sf-c-orange\:10,html.dark .sf-c-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-90))}html[data-theme='dark'] .sf-c-orange\:20,html.dark .sf-c-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-80))}html[data-theme='dark'] .sf-c-orange\:30,html.dark .sf-c-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-70))}html[data-theme='dark'] .sf-c-orange\:40,html.dark .sf-c-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-60))}html[data-theme='dark'] .sf-c-orange\:50,html.dark .sf-c-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-50))}html[data-theme='dark'] .sf-c-orange\:60,html.dark .sf-c-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-40))}html[data-theme='dark'] .sf-c-orange\:70,html.dark .sf-c-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-30))}html[data-theme='dark'] .sf-c-orange\:80,html.dark .sf-c-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-20))}html[data-theme='dark'] .sf-c-orange\:90,html.dark .sf-c-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-10))}html[data-theme='dark'] .sf-c-orange\:100,html.dark .sf-c-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-0))}html[data-theme='dark'] .sf-c-orange\:dark,html.dark .sf-c-orange\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}html[data-theme='dark'] .sf-c-orange\:0\:dark,html.dark .sf-c-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-100))}html[data-theme='dark'] .sf-c-orange\:10\:dark,html.dark .sf-c-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}html[data-theme='dark'] .sf-c-orange\:20\:dark,html.dark .sf-c-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}html[data-theme='dark'] .sf-c-orange\:30\:dark,html.dark .sf-c-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}html[data-theme='dark'] .sf-c-orange\:40\:dark,html.dark .sf-c-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}html[data-theme='dark'] .sf-c-orange\:50\:dark,html.dark .sf-c-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-50))}html[data-theme='dark'] .sf-c-orange\:60\:dark,html.dark .sf-c-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-40))}html[data-theme='dark'] .sf-c-orange\:70\:dark,html.dark .sf-c-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}html[data-theme='dark'] .sf-c-orange\:80\:dark,html.dark .sf-c-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}html[data-theme='dark'] .sf-c-orange\:90\:dark,html.dark .sf-c-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}html[data-theme='dark'] .sf-c-orange\:100\:dark,html.dark .sf-c-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}html[data-theme='dark'] .sf-c-txt-orange,html.dark .sf-c-txt-orange{color:hsl(var(--sf-c-txt-orange))}html[data-theme='dark'] .sf-c-txt-orange\:0,html.dark .sf-c-txt-orange\:0{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='dark'] .sf-c-txt-orange\:10,html.dark .sf-c-txt-orange\:10{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='dark'] .sf-c-txt-orange\:20,html.dark .sf-c-txt-orange\:20{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='dark'] .sf-c-txt-orange\:30,html.dark .sf-c-txt-orange\:30{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='dark'] .sf-c-txt-orange\:40,html.dark .sf-c-txt-orange\:40{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='dark'] .sf-c-txt-orange\:50,html.dark .sf-c-txt-orange\:50{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='dark'] .sf-c-txt-orange\:60,html.dark .sf-c-txt-orange\:60{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='dark'] .sf-c-txt-orange\:70,html.dark .sf-c-txt-orange\:70{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='dark'] .sf-c-txt-orange\:80,html.dark .sf-c-txt-orange\:80{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='dark'] .sf-c-txt-orange\:90,html.dark .sf-c-txt-orange\:90{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='dark'] .sf-c-txt-orange\:100,html.dark .sf-c-txt-orange\:100{color:hsl(var(--sf-c-txt-orange-100))}html[data-theme='dark'] .sf-c-txt-orange\:dark,html.dark .sf-c-txt-orange\:dark{color:hsl(var(--sf-c-txt-orange))}html[data-theme='dark'] .sf-c-txt-orange\:0\:dark,html.dark .sf-c-txt-orange\:0\:dark{color:hsl(var(--sf-dark-c-txt-orange-0))}html[data-theme='dark'] .sf-c-txt-orange\:10\:dark,html.dark .sf-c-txt-orange\:10\:dark{color:hsl(var(--sf-dark-c-txt-orange-10))}html[data-theme='dark'] .sf-c-txt-orange\:20\:dark,html.dark .sf-c-txt-orange\:20\:dark{color:hsl(var(--sf-dark-c-txt-orange-20))}html[data-theme='dark'] .sf-c-txt-orange\:30\:dark,html.dark .sf-c-txt-orange\:30\:dark{color:hsl(var(--sf-dark-c-txt-orange-30))}html[data-theme='dark'] .sf-c-txt-orange\:40\:dark,html.dark .sf-c-txt-orange\:40\:dark{color:hsl(var(--sf-dark-c-txt-orange-40))}html[data-theme='dark'] .sf-c-txt-orange\:50\:dark,html.dark .sf-c-txt-orange\:50\:dark{color:hsl(var(--sf-dark-c-txt-orange-50))}html[data-theme='dark'] .sf-c-txt-orange\:60\:dark,html.dark .sf-c-txt-orange\:60\:dark{color:hsl(var(--sf-dark-c-txt-orange-60))}html[data-theme='dark'] .sf-c-txt-orange\:70\:dark,html.dark .sf-c-txt-orange\:70\:dark{color:hsl(var(--sf-dark-c-txt-orange-70))}html[data-theme='dark'] .sf-c-txt-orange\:80\:dark,html.dark .sf-c-txt-orange\:80\:dark{color:hsl(var(--sf-dark-c-txt-orange-80))}html[data-theme='dark'] .sf-c-txt-orange\:90\:dark,html.dark .sf-c-txt-orange\:90\:dark{color:hsl(var(--sf-dark-c-txt-orange-90))}html[data-theme='dark'] .sf-c-txt-orange\:100\:dark,html.dark .sf-c-txt-orange\:100\:dark{color:hsl(var(--sf-dark-c-txt-orange-100))}html.var[data-theme='dark'] .sf-c-orange,html.var.dark .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:0,html.var.dark .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-orange\:10,html.var.dark .sf-c-orange\:10{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-orange\:20,html.var.dark .sf-c-orange\:20{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-orange\:30,html.var.dark .sf-c-orange\:30{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-orange\:40,html.var.dark .sf-c-orange\:40{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-orange\:50,html.var.dark .sf-c-orange\:50{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:60,html.var.dark .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-orange\:70,html.var.dark .sf-c-orange\:70{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-orange\:80,html.var.dark .sf-c-orange\:80{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-orange\:90,html.var.dark .sf-c-orange\:90{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-orange\:100,html.var.dark .sf-c-orange\:100{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-orange\:dark,html.var.dark .sf-c-orange\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:0\:dark,html.var.dark .sf-c-orange\:0\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-orange\:10\:dark,html.var.dark .sf-c-orange\:10\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-orange\:20\:dark,html.var.dark .sf-c-orange\:20\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-orange\:30\:dark,html.var.dark .sf-c-orange\:30\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-orange\:40\:dark,html.var.dark .sf-c-orange\:40\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-orange\:50\:dark,html.var.dark .sf-c-orange\:50\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-orange\:60\:dark,html.var.dark .sf-c-orange\:60\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-orange\:70\:dark,html.var.dark .sf-c-orange\:70\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-orange\:80\:dark,html.var.dark .sf-c-orange\:80\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-orange\:90\:dark,html.var.dark .sf-c-orange\:90\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-orange\:100\:dark,html.var.dark .sf-c-orange\:100\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange,html.dark .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:0,html.dark .sf-c-txt-orange\:0{color:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange\:10,html.dark .sf-c-txt-orange\:10{color:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-orange\:20,html.dark .sf-c-txt-orange\:20{color:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-orange\:30,html.dark .sf-c-txt-orange\:30{color:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-orange\:40,html.dark .sf-c-txt-orange\:40{color:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-orange\:50,html.dark .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:60,html.dark .sf-c-txt-orange\:60{color:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-orange\:70,html.dark .sf-c-txt-orange\:70{color:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-orange\:80,html.dark .sf-c-txt-orange\:80{color:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-orange\:90,html.dark .sf-c-txt-orange\:90{color:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-orange\:100,html.dark .sf-c-txt-orange\:100{color:hsl(39,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-orange\:dark,html.dark .sf-c-txt-orange\:dark{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:0\:dark,html.dark .sf-c-txt-orange\:0\:dark{color:hsl(39,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-orange\:10\:dark,html.dark .sf-c-txt-orange\:10\:dark{color:hsl(39,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-orange\:20\:dark,html.dark .sf-c-txt-orange\:20\:dark{color:hsl(39,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-orange\:30\:dark,html.dark .sf-c-txt-orange\:30\:dark{color:hsl(39,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-orange\:40\:dark,html.dark .sf-c-txt-orange\:40\:dark{color:hsl(39,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-orange\:50\:dark,html.dark .sf-c-txt-orange\:50\:dark{color:hsl(39,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-orange\:60\:dark,html.dark .sf-c-txt-orange\:60\:dark{color:hsl(39,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-orange\:70\:dark,html.dark .sf-c-txt-orange\:70\:dark{color:hsl(39,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-orange\:80\:dark,html.dark .sf-c-txt-orange\:80\:dark{color:hsl(39,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-orange\:90\:dark,html.dark .sf-c-txt-orange\:90\:dark{color:hsl(39,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-orange\:100\:dark,html.dark .sf-c-txt-orange\:100\:dark{color:hsl(39,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-orange,html.auto .sf-c-orange{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange))}html[data-theme='auto'] .sf-c-orange\:0,html.auto .sf-c-orange\:0{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-100))}html[data-theme='auto'] .sf-c-orange\:10,html.auto .sf-c-orange\:10{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-90))}html[data-theme='auto'] .sf-c-orange\:20,html.auto .sf-c-orange\:20{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-80))}html[data-theme='auto'] .sf-c-orange\:30,html.auto .sf-c-orange\:30{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-70))}html[data-theme='auto'] .sf-c-orange\:40,html.auto .sf-c-orange\:40{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-60))}html[data-theme='auto'] .sf-c-orange\:50,html.auto .sf-c-orange\:50{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-50))}html[data-theme='auto'] .sf-c-orange\:60,html.auto .sf-c-orange\:60{color:hsl(var(--sf-dark-c-txt-orange-10));background:hsl(var(--sf-dark-c-orange-40))}html[data-theme='auto'] .sf-c-orange\:70,html.auto .sf-c-orange\:70{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-30))}html[data-theme='auto'] .sf-c-orange\:80,html.auto .sf-c-orange\:80{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-20))}html[data-theme='auto'] .sf-c-orange\:90,html.auto .sf-c-orange\:90{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-10))}html[data-theme='auto'] .sf-c-orange\:100,html.auto .sf-c-orange\:100{color:hsl(var(--sf-dark-c-txt-orange-90));background:hsl(var(--sf-dark-c-orange-0))}html[data-theme='auto'] .sf-c-orange\:dark,html.auto .sf-c-orange\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange))}html[data-theme='auto'] .sf-c-orange\:0\:dark,html.auto .sf-c-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-100))}html[data-theme='auto'] .sf-c-orange\:10\:dark,html.auto .sf-c-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-90))}html[data-theme='auto'] .sf-c-orange\:20\:dark,html.auto .sf-c-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-80))}html[data-theme='auto'] .sf-c-orange\:30\:dark,html.auto .sf-c-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-70))}html[data-theme='auto'] .sf-c-orange\:40\:dark,html.auto .sf-c-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-60))}html[data-theme='auto'] .sf-c-orange\:50\:dark,html.auto .sf-c-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-50))}html[data-theme='auto'] .sf-c-orange\:60\:dark,html.auto .sf-c-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-10));background:hsl(var(--sf-c-orange-40))}html[data-theme='auto'] .sf-c-orange\:70\:dark,html.auto .sf-c-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-30))}html[data-theme='auto'] .sf-c-orange\:80\:dark,html.auto .sf-c-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-20))}html[data-theme='auto'] .sf-c-orange\:90\:dark,html.auto .sf-c-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-10))}html[data-theme='auto'] .sf-c-orange\:100\:dark,html.auto .sf-c-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-90));background:hsl(var(--sf-c-orange-0))}html[data-theme='auto'] .sf-c-txt-orange,html.auto .sf-c-txt-orange{color:hsl(var(--sf-c-txt-orange))}html[data-theme='auto'] .sf-c-txt-orange\:0,html.auto .sf-c-txt-orange\:0{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='auto'] .sf-c-txt-orange\:10,html.auto .sf-c-txt-orange\:10{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='auto'] .sf-c-txt-orange\:20,html.auto .sf-c-txt-orange\:20{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='auto'] .sf-c-txt-orange\:30,html.auto .sf-c-txt-orange\:30{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='auto'] .sf-c-txt-orange\:40,html.auto .sf-c-txt-orange\:40{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='auto'] .sf-c-txt-orange\:50,html.auto .sf-c-txt-orange\:50{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='auto'] .sf-c-txt-orange\:60,html.auto .sf-c-txt-orange\:60{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='auto'] .sf-c-txt-orange\:70,html.auto .sf-c-txt-orange\:70{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='auto'] .sf-c-txt-orange\:80,html.auto .sf-c-txt-orange\:80{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='auto'] .sf-c-txt-orange\:90,html.auto .sf-c-txt-orange\:90{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='auto'] .sf-c-txt-orange\:100,html.auto .sf-c-txt-orange\:100{color:hsl(var(--sf-c-txt-orange-100))}html[data-theme='auto'] .sf-c-txt-orange\:dark,html.auto .sf-c-txt-orange\:dark{color:hsl(var(--sf-c-txt-orange))}html[data-theme='auto'] .sf-c-txt-orange\:0\:dark,html.auto .sf-c-txt-orange\:0\:dark{color:hsl(var(--sf-c-txt-orange-0))}html[data-theme='auto'] .sf-c-txt-orange\:10\:dark,html.auto .sf-c-txt-orange\:10\:dark{color:hsl(var(--sf-c-txt-orange-10))}html[data-theme='auto'] .sf-c-txt-orange\:20\:dark,html.auto .sf-c-txt-orange\:20\:dark{color:hsl(var(--sf-c-txt-orange-20))}html[data-theme='auto'] .sf-c-txt-orange\:30\:dark,html.auto .sf-c-txt-orange\:30\:dark{color:hsl(var(--sf-c-txt-orange-30))}html[data-theme='auto'] .sf-c-txt-orange\:40\:dark,html.auto .sf-c-txt-orange\:40\:dark{color:hsl(var(--sf-c-txt-orange-40))}html[data-theme='auto'] .sf-c-txt-orange\:50\:dark,html.auto .sf-c-txt-orange\:50\:dark{color:hsl(var(--sf-c-txt-orange-50))}html[data-theme='auto'] .sf-c-txt-orange\:60\:dark,html.auto .sf-c-txt-orange\:60\:dark{color:hsl(var(--sf-c-txt-orange-60))}html[data-theme='auto'] .sf-c-txt-orange\:70\:dark,html.auto .sf-c-txt-orange\:70\:dark{color:hsl(var(--sf-c-txt-orange-70))}html[data-theme='auto'] .sf-c-txt-orange\:80\:dark,html.auto .sf-c-txt-orange\:80\:dark{color:hsl(var(--sf-c-txt-orange-80))}html[data-theme='auto'] .sf-c-txt-orange\:90\:dark,html.auto .sf-c-txt-orange\:90\:dark{color:hsl(var(--sf-c-txt-orange-90))}html[data-theme='auto'] .sf-c-txt-orange\:100\:dark,html.auto .sf-c-txt-orange\:100\:dark{color:hsl(var(--sf-c-txt-orange-100))}html.var[data-theme='auto'] .sf-c-orange,html.var.auto .sf-c-orange{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:0,html.var.auto .sf-c-orange\:0{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-orange\:10,html.var.auto .sf-c-orange\:10{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-orange\:20,html.var.auto .sf-c-orange\:20{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-orange\:30,html.var.auto .sf-c-orange\:30{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-orange\:40,html.var.auto .sf-c-orange\:40{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-orange\:50,html.var.auto .sf-c-orange\:50{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:60,html.var.auto .sf-c-orange\:60{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-orange\:70,html.var.auto .sf-c-orange\:70{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-orange\:80,html.var.auto .sf-c-orange\:80{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-orange\:90,html.var.auto .sf-c-orange\:90{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-orange\:100,html.var.auto .sf-c-orange\:100{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-orange\:dark,html.var.auto .sf-c-orange\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:0\:dark,html.var.auto .sf-c-orange\:0\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-orange\:10\:dark,html.var.auto .sf-c-orange\:10\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-orange\:20\:dark,html.var.auto .sf-c-orange\:20\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-orange\:30\:dark,html.var.auto .sf-c-orange\:30\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-orange\:40\:dark,html.var.auto .sf-c-orange\:40\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-orange\:50\:dark,html.var.auto .sf-c-orange\:50\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-orange\:60\:dark,html.var.auto .sf-c-orange\:60\:dark{color:hsl(39,100%,10%);background:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-orange\:70\:dark,html.var.auto .sf-c-orange\:70\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-orange\:80\:dark,html.var.auto .sf-c-orange\:80\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-orange\:90\:dark,html.var.auto .sf-c-orange\:90\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-orange\:100\:dark,html.var.auto .sf-c-orange\:100\:dark{color:hsl(39,100%,90%);background:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange,html.auto .sf-c-txt-orange{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:0,html.auto .sf-c-txt-orange\:0{color:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange\:10,html.auto .sf-c-txt-orange\:10{color:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-orange\:20,html.auto .sf-c-txt-orange\:20{color:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-orange\:30,html.auto .sf-c-txt-orange\:30{color:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-orange\:40,html.auto .sf-c-txt-orange\:40{color:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-orange\:50,html.auto .sf-c-txt-orange\:50{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:60,html.auto .sf-c-txt-orange\:60{color:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-orange\:70,html.auto .sf-c-txt-orange\:70{color:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-orange\:80,html.auto .sf-c-txt-orange\:80{color:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-orange\:90,html.auto .sf-c-txt-orange\:90{color:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-orange\:100,html.auto .sf-c-txt-orange\:100{color:hsl(39,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-orange\:dark,html.auto .sf-c-txt-orange\:dark{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark,html.auto .sf-c-txt-orange\:0\:dark{color:hsl(39,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark,html.auto .sf-c-txt-orange\:10\:dark{color:hsl(39,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark,html.auto .sf-c-txt-orange\:20\:dark{color:hsl(39,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark,html.auto .sf-c-txt-orange\:30\:dark{color:hsl(39,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark,html.auto .sf-c-txt-orange\:40\:dark{color:hsl(39,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark,html.auto .sf-c-txt-orange\:50\:dark{color:hsl(39,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark,html.auto .sf-c-txt-orange\:60\:dark{color:hsl(39,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark,html.auto .sf-c-txt-orange\:70\:dark{color:hsl(39,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark,html.auto .sf-c-txt-orange\:80\:dark{color:hsl(39,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark,html.auto .sf-c-txt-orange\:90\:dark{color:hsl(39,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark,html.auto .sf-c-txt-orange\:100\:dark{color:hsl(39,100%,100%)}}[class*='red']{--sf-c-red:0 100% 50%;--sf-c-red-0:0 100% 0%;--sf-c-red-10:0 100% 10%;--sf-c-red-20:0 100% 20%;--sf-c-red-30:0 100% 30%;--sf-c-red-40:0 100% 40%;--sf-c-red-50:0 100% 50%;--sf-c-red-60:0 100% 60%;--sf-c-red-70:0 100% 70%;--sf-c-red-80:0 100% 80%;--sf-c-red-90:0 100% 90%;--sf-c-red-100:0 100% 100%;--sf-c-txt-red:var(--sf-c-red);--sf-c-txt-red-0:var(--sf-c-red-0);--sf-c-txt-red-10:var(--sf-c-red-10);--sf-c-txt-red-20:var(--sf-c-red-20);--sf-c-txt-red-30:var(--sf-c-red-30);--sf-c-txt-red-40:var(--sf-c-red-40);--sf-c-txt-red-50:var(--sf-c-red-50);--sf-c-txt-red-60:var(--sf-c-red-60);--sf-c-txt-red-70:var(--sf-c-red-70);--sf-c-txt-red-80:var(--sf-c-red-80);--sf-c-txt-red-90:var(--sf-c-red-90);--sf-c-txt-red-100:var(--sf-c-red-100);--sf-dark-c-red:0 100% 50%;--sf-dark-c-red-0:0 100% 0%;--sf-dark-c-red-10:0 100% 10%;--sf-dark-c-red-20:0 100% 20%;--sf-dark-c-red-30:0 100% 30%;--sf-dark-c-red-40:0 100% 40%;--sf-dark-c-red-50:0 100% 50%;--sf-dark-c-red-60:0 100% 60%;--sf-dark-c-red-70:0 100% 70%;--sf-dark-c-red-80:0 100% 80%;--sf-dark-c-red-90:0 100% 90%;--sf-dark-c-red-100:0 100% 100%;--sf-dark-c-txt-red:var(--sf-dark-c-red);--sf-dark-c-txt-red-0:var(--sf-dark-c-red-0);--sf-dark-c-txt-red-10:var(--sf-dark-c-red-10);--sf-dark-c-txt-red-20:var(--sf-dark-c-red-20);--sf-dark-c-txt-red-30:var(--sf-dark-c-red-30);--sf-dark-c-txt-red-40:var(--sf-dark-c-red-40);--sf-dark-c-txt-red-50:var(--sf-dark-c-red-50);--sf-dark-c-txt-red-60:var(--sf-dark-c-red-60);--sf-dark-c-txt-red-70:var(--sf-dark-c-red-70);--sf-dark-c-txt-red-80:var(--sf-dark-c-red-80);--sf-dark-c-txt-red-90:var(--sf-dark-c-red-90);--sf-dark-c-txt-red-100:var(--sf-dark-c-red-100)}.sf-c-red{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}.sf-c-red\:0{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}.sf-c-red\:10{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}.sf-c-red\:20{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}.sf-c-red\:30{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}.sf-c-red\:40{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}.sf-c-red\:50{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}.sf-c-red\:60{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-60))}.sf-c-red\:70{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-70))}.sf-c-red\:80{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}.sf-c-red\:90{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}.sf-c-red\:100{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-100))}html.var .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-red\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-red\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-red\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-red\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-red\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-red\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-red\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-red{color:hsl(var(--sf-dark-c-txt-red))}.sf-c-txt-red\:0{color:hsl(var(--sf-dark-c-txt-red-100))}.sf-c-txt-red\:10{color:hsl(var(--sf-dark-c-txt-red-90))}.sf-c-txt-red\:20{color:hsl(var(--sf-dark-c-txt-red-80))}.sf-c-txt-red\:30{color:hsl(var(--sf-dark-c-txt-red-70))}.sf-c-txt-red\:40{color:hsl(var(--sf-dark-c-txt-red-60))}.sf-c-txt-red\:50{color:hsl(var(--sf-dark-c-txt-red-50))}.sf-c-txt-red\:60{color:hsl(var(--sf-dark-c-txt-red-40))}.sf-c-txt-red\:70{color:hsl(var(--sf-dark-c-txt-red-30))}.sf-c-txt-red\:80{color:hsl(var(--sf-dark-c-txt-red-20))}.sf-c-txt-red\:90{color:hsl(var(--sf-dark-c-txt-red-10))}.sf-c-txt-red\:100{color:hsl(var(--sf-dark-c-txt-red-0))}html.var .sf-c-txt-red{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-red\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-red\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-red\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-red\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-red\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-red\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-red\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-red\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-red,html.dark .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='dark'] .sf-c-red\:0,html.dark .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='dark'] .sf-c-red\:10,html.dark .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='dark'] .sf-c-red\:20,html.dark .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='dark'] .sf-c-red\:30,html.dark .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='dark'] .sf-c-red\:40,html.dark .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='dark'] .sf-c-red\:50,html.dark .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='dark'] .sf-c-red\:60,html.dark .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='dark'] .sf-c-red\:70,html.dark .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='dark'] .sf-c-red\:80,html.dark .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='dark'] .sf-c-red\:90,html.dark .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='dark'] .sf-c-red\:100,html.dark .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='dark'] .sf-c-red\:dark,html.dark .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='dark'] .sf-c-red\:0\:dark,html.dark .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='dark'] .sf-c-red\:10\:dark,html.dark .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='dark'] .sf-c-red\:20\:dark,html.dark .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='dark'] .sf-c-red\:30\:dark,html.dark .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='dark'] .sf-c-red\:40\:dark,html.dark .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='dark'] .sf-c-red\:50\:dark,html.dark .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='dark'] .sf-c-red\:60\:dark,html.dark .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='dark'] .sf-c-red\:70\:dark,html.dark .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='dark'] .sf-c-red\:80\:dark,html.dark .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='dark'] .sf-c-red\:90\:dark,html.dark .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='dark'] .sf-c-red\:100\:dark,html.dark .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-dark-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-dark-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-dark-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-dark-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-dark-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-dark-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-dark-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-dark-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-dark-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-dark-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-dark-c-txt-red-100))}html.var[data-theme='dark'] .sf-c-red,html.var.dark .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0,html.var.dark .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10,html.var.dark .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20,html.var.dark .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30,html.var.dark .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40,html.var.dark .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50,html.var.dark .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60,html.var.dark .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70,html.var.dark .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80,html.var.dark .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90,html.var.dark .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100,html.var.dark .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-red\:dark,html.var.dark .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0\:dark,html.var.dark .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10\:dark,html.var.dark .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20\:dark,html.var.dark .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30\:dark,html.var.dark .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40\:dark,html.var.dark .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50\:dark,html.var.dark .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60\:dark,html.var.dark .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70\:dark,html.var.dark .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80\:dark,html.var.dark .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90\:dark,html.var.dark .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100\:dark,html.var.dark .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-red,html.auto .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='auto'] .sf-c-red\:0,html.auto .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='auto'] .sf-c-red\:10,html.auto .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='auto'] .sf-c-red\:20,html.auto .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='auto'] .sf-c-red\:30,html.auto .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='auto'] .sf-c-red\:40,html.auto .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='auto'] .sf-c-red\:50,html.auto .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='auto'] .sf-c-red\:60,html.auto .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='auto'] .sf-c-red\:70,html.auto .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='auto'] .sf-c-red\:80,html.auto .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='auto'] .sf-c-red\:90,html.auto .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='auto'] .sf-c-red\:100,html.auto .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='auto'] .sf-c-red\:dark,html.auto .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='auto'] .sf-c-red\:0\:dark,html.auto .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='auto'] .sf-c-red\:10\:dark,html.auto .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='auto'] .sf-c-red\:20\:dark,html.auto .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='auto'] .sf-c-red\:30\:dark,html.auto .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='auto'] .sf-c-red\:40\:dark,html.auto .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='auto'] .sf-c-red\:50\:dark,html.auto .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='auto'] .sf-c-red\:60\:dark,html.auto .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='auto'] .sf-c-red\:70\:dark,html.auto .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='auto'] .sf-c-red\:80\:dark,html.auto .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='auto'] .sf-c-red\:90\:dark,html.auto .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='auto'] .sf-c-red\:100\:dark,html.auto .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-c-txt-red-100))}html.var[data-theme='auto'] .sf-c-red,html.var.auto .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0,html.var.auto .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10,html.var.auto .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20,html.var.auto .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30,html.var.auto .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40,html.var.auto .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50,html.var.auto .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60,html.var.auto .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70,html.var.auto .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80,html.var.auto .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90,html.var.auto .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100,html.var.auto .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-red\:dark,html.var.auto .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0\:dark,html.var.auto .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10\:dark,html.var.auto .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20\:dark,html.var.auto .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30\:dark,html.var.auto .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40\:dark,html.var.auto .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50\:dark,html.var.auto .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60\:dark,html.var.auto .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70\:dark,html.var.auto .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80\:dark,html.var.auto .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90\:dark,html.var.auto .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100\:dark,html.var.auto .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}}[class*='skyblue']{--sf-c-skyblue:197 71% 73%;--sf-c-skyblue-0:197 71% 0%;--sf-c-skyblue-10:197 71% 10%;--sf-c-skyblue-20:197 71% 20%;--sf-c-skyblue-30:197 71% 30%;--sf-c-skyblue-40:197 71% 40%;--sf-c-skyblue-50:197 71% 50%;--sf-c-skyblue-60:197 71% 60%;--sf-c-skyblue-70:197 71% 70%;--sf-c-skyblue-80:197 71% 80%;--sf-c-skyblue-90:197 71% 90%;--sf-c-skyblue-100:197 71% 100%;--sf-c-txt-skyblue:var(--sf-c-skyblue);--sf-c-txt-skyblue-0:var(--sf-c-skyblue-0);--sf-c-txt-skyblue-10:var(--sf-c-skyblue-10);--sf-c-txt-skyblue-20:var(--sf-c-skyblue-20);--sf-c-txt-skyblue-30:var(--sf-c-skyblue-30);--sf-c-txt-skyblue-40:var(--sf-c-skyblue-40);--sf-c-txt-skyblue-50:var(--sf-c-skyblue-50);--sf-c-txt-skyblue-60:var(--sf-c-skyblue-60);--sf-c-txt-skyblue-70:var(--sf-c-skyblue-70);--sf-c-txt-skyblue-80:var(--sf-c-skyblue-80);--sf-c-txt-skyblue-90:var(--sf-c-skyblue-90);--sf-c-txt-skyblue-100:var(--sf-c-skyblue-100);--sf-dark-c-skyblue:197 71% 27%;--sf-dark-c-skyblue-0:197 71% 0%;--sf-dark-c-skyblue-10:197 71% 10%;--sf-dark-c-skyblue-20:197 71% 20%;--sf-dark-c-skyblue-30:197 71% 30%;--sf-dark-c-skyblue-40:197 71% 40%;--sf-dark-c-skyblue-50:197 71% 50%;--sf-dark-c-skyblue-60:197 71% 60%;--sf-dark-c-skyblue-70:197 71% 70%;--sf-dark-c-skyblue-80:197 71% 80%;--sf-dark-c-skyblue-90:197 71% 90%;--sf-dark-c-skyblue-100:197 71% 100%;--sf-dark-c-txt-skyblue:var(--sf-dark-c-skyblue);--sf-dark-c-txt-skyblue-0:var(--sf-dark-c-skyblue-0);--sf-dark-c-txt-skyblue-10:var(--sf-dark-c-skyblue-10);--sf-dark-c-txt-skyblue-20:var(--sf-dark-c-skyblue-20);--sf-dark-c-txt-skyblue-30:var(--sf-dark-c-skyblue-30);--sf-dark-c-txt-skyblue-40:var(--sf-dark-c-skyblue-40);--sf-dark-c-txt-skyblue-50:var(--sf-dark-c-skyblue-50);--sf-dark-c-txt-skyblue-60:var(--sf-dark-c-skyblue-60);--sf-dark-c-txt-skyblue-70:var(--sf-dark-c-skyblue-70);--sf-dark-c-txt-skyblue-80:var(--sf-dark-c-skyblue-80);--sf-dark-c-txt-skyblue-90:var(--sf-dark-c-skyblue-90);--sf-dark-c-txt-skyblue-100:var(--sf-dark-c-skyblue-100)}.sf-c-skyblue{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue))}.sf-c-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}.sf-c-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}.sf-c-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}.sf-c-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}.sf-c-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-40))}.sf-c-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-50))}.sf-c-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}.sf-c-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}.sf-c-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}.sf-c-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}.sf-c-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-100))}html.var .sf-c-skyblue{color:hsl(197,71%,10%);background:hsl(197,71%,73%)}html.var .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var .sf-c-skyblue\:10{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var .sf-c-skyblue\:20{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var .sf-c-skyblue\:30{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var .sf-c-skyblue\:40{color:hsl(197,71%,90%);background:hsl(197,71%,40%)}html.var .sf-c-skyblue\:50{color:hsl(197,71%,90%);background:hsl(197,71%,50%)}html.var .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var .sf-c-skyblue\:70{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var .sf-c-skyblue\:80{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var .sf-c-skyblue\:90{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var .sf-c-skyblue\:100{color:hsl(197,71%,10%);background:hsl(197,71%,100%)}.sf-c-txt-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue))}.sf-c-txt-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-100))}.sf-c-txt-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-90))}.sf-c-txt-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-80))}.sf-c-txt-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-70))}.sf-c-txt-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-60))}.sf-c-txt-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-50))}.sf-c-txt-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-40))}.sf-c-txt-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-30))}.sf-c-txt-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-20))}.sf-c-txt-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-10))}.sf-c-txt-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-0))}html.var .sf-c-txt-skyblue{color:hsl(197,71%,27%)}html.var .sf-c-txt-skyblue\:0{color:hsl(197,71%,100%)}html.var .sf-c-txt-skyblue\:10{color:hsl(197,71%,90%)}html.var .sf-c-txt-skyblue\:20{color:hsl(197,71%,80%)}html.var .sf-c-txt-skyblue\:30{color:hsl(197,71%,70%)}html.var .sf-c-txt-skyblue\:40{color:hsl(197,71%,60%)}html.var .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var .sf-c-txt-skyblue\:60{color:hsl(197,71%,40%)}html.var .sf-c-txt-skyblue\:70{color:hsl(197,71%,30%)}html.var .sf-c-txt-skyblue\:80{color:hsl(197,71%,20%)}html.var .sf-c-txt-skyblue\:90{color:hsl(197,71%,10%)}html.var .sf-c-txt-skyblue\:100{color:hsl(197,71%,0%)}html[data-theme='dark'] .sf-c-skyblue,html.dark .sf-c-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue))}html[data-theme='dark'] .sf-c-skyblue\:0,html.dark .sf-c-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-100))}html[data-theme='dark'] .sf-c-skyblue\:10,html.dark .sf-c-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-90))}html[data-theme='dark'] .sf-c-skyblue\:20,html.dark .sf-c-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-80))}html[data-theme='dark'] .sf-c-skyblue\:30,html.dark .sf-c-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-70))}html[data-theme='dark'] .sf-c-skyblue\:40,html.dark .sf-c-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-60))}html[data-theme='dark'] .sf-c-skyblue\:50,html.dark .sf-c-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-50))}html[data-theme='dark'] .sf-c-skyblue\:60,html.dark .sf-c-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-40))}html[data-theme='dark'] .sf-c-skyblue\:70,html.dark .sf-c-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-30))}html[data-theme='dark'] .sf-c-skyblue\:80,html.dark .sf-c-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-20))}html[data-theme='dark'] .sf-c-skyblue\:90,html.dark .sf-c-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-10))}html[data-theme='dark'] .sf-c-skyblue\:100,html.dark .sf-c-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-0))}html[data-theme='dark'] .sf-c-skyblue\:dark,html.dark .sf-c-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue))}html[data-theme='dark'] .sf-c-skyblue\:0\:dark,html.dark .sf-c-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-100))}html[data-theme='dark'] .sf-c-skyblue\:10\:dark,html.dark .sf-c-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}html[data-theme='dark'] .sf-c-skyblue\:20\:dark,html.dark .sf-c-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}html[data-theme='dark'] .sf-c-skyblue\:30\:dark,html.dark .sf-c-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}html[data-theme='dark'] .sf-c-skyblue\:40\:dark,html.dark .sf-c-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}html[data-theme='dark'] .sf-c-skyblue\:50\:dark,html.dark .sf-c-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-50))}html[data-theme='dark'] .sf-c-skyblue\:60\:dark,html.dark .sf-c-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-40))}html[data-theme='dark'] .sf-c-skyblue\:70\:dark,html.dark .sf-c-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}html[data-theme='dark'] .sf-c-skyblue\:80\:dark,html.dark .sf-c-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}html[data-theme='dark'] .sf-c-skyblue\:90\:dark,html.dark .sf-c-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}html[data-theme='dark'] .sf-c-skyblue\:100\:dark,html.dark .sf-c-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue,html.dark .sf-c-txt-skyblue{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='dark'] .sf-c-txt-skyblue\:0,html.dark .sf-c-txt-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue\:10,html.dark .sf-c-txt-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='dark'] .sf-c-txt-skyblue\:20,html.dark .sf-c-txt-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='dark'] .sf-c-txt-skyblue\:30,html.dark .sf-c-txt-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='dark'] .sf-c-txt-skyblue\:40,html.dark .sf-c-txt-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='dark'] .sf-c-txt-skyblue\:50,html.dark .sf-c-txt-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='dark'] .sf-c-txt-skyblue\:60,html.dark .sf-c-txt-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='dark'] .sf-c-txt-skyblue\:70,html.dark .sf-c-txt-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='dark'] .sf-c-txt-skyblue\:80,html.dark .sf-c-txt-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='dark'] .sf-c-txt-skyblue\:90,html.dark .sf-c-txt-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='dark'] .sf-c-txt-skyblue\:100,html.dark .sf-c-txt-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-100))}html[data-theme='dark'] .sf-c-txt-skyblue\:dark,html.dark .sf-c-txt-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='dark'] .sf-c-txt-skyblue\:0\:dark,html.dark .sf-c-txt-skyblue\:0\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-0))}html[data-theme='dark'] .sf-c-txt-skyblue\:10\:dark,html.dark .sf-c-txt-skyblue\:10\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-10))}html[data-theme='dark'] .sf-c-txt-skyblue\:20\:dark,html.dark .sf-c-txt-skyblue\:20\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-20))}html[data-theme='dark'] .sf-c-txt-skyblue\:30\:dark,html.dark .sf-c-txt-skyblue\:30\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-30))}html[data-theme='dark'] .sf-c-txt-skyblue\:40\:dark,html.dark .sf-c-txt-skyblue\:40\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-40))}html[data-theme='dark'] .sf-c-txt-skyblue\:50\:dark,html.dark .sf-c-txt-skyblue\:50\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-50))}html[data-theme='dark'] .sf-c-txt-skyblue\:60\:dark,html.dark .sf-c-txt-skyblue\:60\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-60))}html[data-theme='dark'] .sf-c-txt-skyblue\:70\:dark,html.dark .sf-c-txt-skyblue\:70\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-70))}html[data-theme='dark'] .sf-c-txt-skyblue\:80\:dark,html.dark .sf-c-txt-skyblue\:80\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-80))}html[data-theme='dark'] .sf-c-txt-skyblue\:90\:dark,html.dark .sf-c-txt-skyblue\:90\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-90))}html[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark,html.dark .sf-c-txt-skyblue\:100\:dark{color:hsl(var(--sf-dark-c-txt-skyblue-100))}html.var[data-theme='dark'] .sf-c-skyblue,html.var.dark .sf-c-skyblue{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='dark'] .sf-c-skyblue\:0,html.var.dark .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-skyblue\:10,html.var.dark .sf-c-skyblue\:10{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-skyblue\:20,html.var.dark .sf-c-skyblue\:20{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-skyblue\:30,html.var.dark .sf-c-skyblue\:30{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-skyblue\:40,html.var.dark .sf-c-skyblue\:40{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-skyblue\:50,html.var.dark .sf-c-skyblue\:50{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-skyblue\:60,html.var.dark .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-skyblue\:70,html.var.dark .sf-c-skyblue\:70{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-skyblue\:80,html.var.dark .sf-c-skyblue\:80{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-skyblue\:90,html.var.dark .sf-c-skyblue\:90{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-skyblue\:100,html.var.dark .sf-c-skyblue\:100{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-skyblue\:dark,html.var.dark .sf-c-skyblue\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='dark'] .sf-c-skyblue\:0\:dark,html.var.dark .sf-c-skyblue\:0\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-skyblue\:10\:dark,html.var.dark .sf-c-skyblue\:10\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-skyblue\:20\:dark,html.var.dark .sf-c-skyblue\:20\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-skyblue\:30\:dark,html.var.dark .sf-c-skyblue\:30\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-skyblue\:40\:dark,html.var.dark .sf-c-skyblue\:40\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-skyblue\:50\:dark,html.var.dark .sf-c-skyblue\:50\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-skyblue\:60\:dark,html.var.dark .sf-c-skyblue\:60\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-skyblue\:70\:dark,html.var.dark .sf-c-skyblue\:70\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-skyblue\:80\:dark,html.var.dark .sf-c-skyblue\:80\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-skyblue\:90\:dark,html.var.dark .sf-c-skyblue\:90\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-skyblue\:100\:dark,html.var.dark .sf-c-skyblue\:100\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue,html.dark .sf-c-txt-skyblue{color:hsl(197,71%,73%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:0,html.dark .sf-c-txt-skyblue\:0{color:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:10,html.dark .sf-c-txt-skyblue\:10{color:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:20,html.dark .sf-c-txt-skyblue\:20{color:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:30,html.dark .sf-c-txt-skyblue\:30{color:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:40,html.dark .sf-c-txt-skyblue\:40{color:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:50,html.dark .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:60,html.dark .sf-c-txt-skyblue\:60{color:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:70,html.dark .sf-c-txt-skyblue\:70{color:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:80,html.dark .sf-c-txt-skyblue\:80{color:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:90,html.dark .sf-c-txt-skyblue\:90{color:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:100,html.dark .sf-c-txt-skyblue\:100{color:hsl(197,71%,100%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:dark,html.dark .sf-c-txt-skyblue\:dark{color:hsl(197,71%,73%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:0\:dark,html.dark .sf-c-txt-skyblue\:0\:dark{color:hsl(197,71%,0%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:10\:dark,html.dark .sf-c-txt-skyblue\:10\:dark{color:hsl(197,71%,10%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:20\:dark,html.dark .sf-c-txt-skyblue\:20\:dark{color:hsl(197,71%,20%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:30\:dark,html.dark .sf-c-txt-skyblue\:30\:dark{color:hsl(197,71%,30%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:40\:dark,html.dark .sf-c-txt-skyblue\:40\:dark{color:hsl(197,71%,40%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:50\:dark,html.dark .sf-c-txt-skyblue\:50\:dark{color:hsl(197,71%,50%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:60\:dark,html.dark .sf-c-txt-skyblue\:60\:dark{color:hsl(197,71%,60%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:70\:dark,html.dark .sf-c-txt-skyblue\:70\:dark{color:hsl(197,71%,70%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:80\:dark,html.dark .sf-c-txt-skyblue\:80\:dark{color:hsl(197,71%,80%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:90\:dark,html.dark .sf-c-txt-skyblue\:90\:dark{color:hsl(197,71%,90%)}html.var[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark,html.dark .sf-c-txt-skyblue\:100\:dark{color:hsl(197,71%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-skyblue,html.auto .sf-c-skyblue{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue))}html[data-theme='auto'] .sf-c-skyblue\:0,html.auto .sf-c-skyblue\:0{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-100))}html[data-theme='auto'] .sf-c-skyblue\:10,html.auto .sf-c-skyblue\:10{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-90))}html[data-theme='auto'] .sf-c-skyblue\:20,html.auto .sf-c-skyblue\:20{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-80))}html[data-theme='auto'] .sf-c-skyblue\:30,html.auto .sf-c-skyblue\:30{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-70))}html[data-theme='auto'] .sf-c-skyblue\:40,html.auto .sf-c-skyblue\:40{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-60))}html[data-theme='auto'] .sf-c-skyblue\:50,html.auto .sf-c-skyblue\:50{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-50))}html[data-theme='auto'] .sf-c-skyblue\:60,html.auto .sf-c-skyblue\:60{color:hsl(var(--sf-dark-c-txt-skyblue-10));background:hsl(var(--sf-dark-c-skyblue-40))}html[data-theme='auto'] .sf-c-skyblue\:70,html.auto .sf-c-skyblue\:70{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-30))}html[data-theme='auto'] .sf-c-skyblue\:80,html.auto .sf-c-skyblue\:80{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-20))}html[data-theme='auto'] .sf-c-skyblue\:90,html.auto .sf-c-skyblue\:90{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-10))}html[data-theme='auto'] .sf-c-skyblue\:100,html.auto .sf-c-skyblue\:100{color:hsl(var(--sf-dark-c-txt-skyblue-90));background:hsl(var(--sf-dark-c-skyblue-0))}html[data-theme='auto'] .sf-c-skyblue\:dark,html.auto .sf-c-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue))}html[data-theme='auto'] .sf-c-skyblue\:0\:dark,html.auto .sf-c-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-100))}html[data-theme='auto'] .sf-c-skyblue\:10\:dark,html.auto .sf-c-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-90))}html[data-theme='auto'] .sf-c-skyblue\:20\:dark,html.auto .sf-c-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-80))}html[data-theme='auto'] .sf-c-skyblue\:30\:dark,html.auto .sf-c-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-70))}html[data-theme='auto'] .sf-c-skyblue\:40\:dark,html.auto .sf-c-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-60))}html[data-theme='auto'] .sf-c-skyblue\:50\:dark,html.auto .sf-c-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-50))}html[data-theme='auto'] .sf-c-skyblue\:60\:dark,html.auto .sf-c-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-10));background:hsl(var(--sf-c-skyblue-40))}html[data-theme='auto'] .sf-c-skyblue\:70\:dark,html.auto .sf-c-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-30))}html[data-theme='auto'] .sf-c-skyblue\:80\:dark,html.auto .sf-c-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-20))}html[data-theme='auto'] .sf-c-skyblue\:90\:dark,html.auto .sf-c-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-10))}html[data-theme='auto'] .sf-c-skyblue\:100\:dark,html.auto .sf-c-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-90));background:hsl(var(--sf-c-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue,html.auto .sf-c-txt-skyblue{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='auto'] .sf-c-txt-skyblue\:0,html.auto .sf-c-txt-skyblue\:0{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue\:10,html.auto .sf-c-txt-skyblue\:10{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='auto'] .sf-c-txt-skyblue\:20,html.auto .sf-c-txt-skyblue\:20{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='auto'] .sf-c-txt-skyblue\:30,html.auto .sf-c-txt-skyblue\:30{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='auto'] .sf-c-txt-skyblue\:40,html.auto .sf-c-txt-skyblue\:40{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='auto'] .sf-c-txt-skyblue\:50,html.auto .sf-c-txt-skyblue\:50{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='auto'] .sf-c-txt-skyblue\:60,html.auto .sf-c-txt-skyblue\:60{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='auto'] .sf-c-txt-skyblue\:70,html.auto .sf-c-txt-skyblue\:70{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='auto'] .sf-c-txt-skyblue\:80,html.auto .sf-c-txt-skyblue\:80{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='auto'] .sf-c-txt-skyblue\:90,html.auto .sf-c-txt-skyblue\:90{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='auto'] .sf-c-txt-skyblue\:100,html.auto .sf-c-txt-skyblue\:100{color:hsl(var(--sf-c-txt-skyblue-100))}html[data-theme='auto'] .sf-c-txt-skyblue\:dark,html.auto .sf-c-txt-skyblue\:dark{color:hsl(var(--sf-c-txt-skyblue))}html[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark,html.auto .sf-c-txt-skyblue\:0\:dark{color:hsl(var(--sf-c-txt-skyblue-0))}html[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark,html.auto .sf-c-txt-skyblue\:10\:dark{color:hsl(var(--sf-c-txt-skyblue-10))}html[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark,html.auto .sf-c-txt-skyblue\:20\:dark{color:hsl(var(--sf-c-txt-skyblue-20))}html[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark,html.auto .sf-c-txt-skyblue\:30\:dark{color:hsl(var(--sf-c-txt-skyblue-30))}html[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark,html.auto .sf-c-txt-skyblue\:40\:dark{color:hsl(var(--sf-c-txt-skyblue-40))}html[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark,html.auto .sf-c-txt-skyblue\:50\:dark{color:hsl(var(--sf-c-txt-skyblue-50))}html[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark,html.auto .sf-c-txt-skyblue\:60\:dark{color:hsl(var(--sf-c-txt-skyblue-60))}html[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark,html.auto .sf-c-txt-skyblue\:70\:dark{color:hsl(var(--sf-c-txt-skyblue-70))}html[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark,html.auto .sf-c-txt-skyblue\:80\:dark{color:hsl(var(--sf-c-txt-skyblue-80))}html[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark,html.auto .sf-c-txt-skyblue\:90\:dark{color:hsl(var(--sf-c-txt-skyblue-90))}html[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark,html.auto .sf-c-txt-skyblue\:100\:dark{color:hsl(var(--sf-c-txt-skyblue-100))}html.var[data-theme='auto'] .sf-c-skyblue,html.var.auto .sf-c-skyblue{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='auto'] .sf-c-skyblue\:0,html.var.auto .sf-c-skyblue\:0{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-skyblue\:10,html.var.auto .sf-c-skyblue\:10{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-skyblue\:20,html.var.auto .sf-c-skyblue\:20{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-skyblue\:30,html.var.auto .sf-c-skyblue\:30{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-skyblue\:40,html.var.auto .sf-c-skyblue\:40{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-skyblue\:50,html.var.auto .sf-c-skyblue\:50{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-skyblue\:60,html.var.auto .sf-c-skyblue\:60{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-skyblue\:70,html.var.auto .sf-c-skyblue\:70{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-skyblue\:80,html.var.auto .sf-c-skyblue\:80{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-skyblue\:90,html.var.auto .sf-c-skyblue\:90{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-skyblue\:100,html.var.auto .sf-c-skyblue\:100{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-skyblue\:dark,html.var.auto .sf-c-skyblue\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,27%)}html.var[data-theme='auto'] .sf-c-skyblue\:0\:dark,html.var.auto .sf-c-skyblue\:0\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-skyblue\:10\:dark,html.var.auto .sf-c-skyblue\:10\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-skyblue\:20\:dark,html.var.auto .sf-c-skyblue\:20\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-skyblue\:30\:dark,html.var.auto .sf-c-skyblue\:30\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-skyblue\:40\:dark,html.var.auto .sf-c-skyblue\:40\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-skyblue\:50\:dark,html.var.auto .sf-c-skyblue\:50\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-skyblue\:60\:dark,html.var.auto .sf-c-skyblue\:60\:dark{color:hsl(197,71%,10%);background:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-skyblue\:70\:dark,html.var.auto .sf-c-skyblue\:70\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-skyblue\:80\:dark,html.var.auto .sf-c-skyblue\:80\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-skyblue\:90\:dark,html.var.auto .sf-c-skyblue\:90\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-skyblue\:100\:dark,html.var.auto .sf-c-skyblue\:100\:dark{color:hsl(197,71%,90%);background:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue,html.auto .sf-c-txt-skyblue{color:hsl(197,71%,73%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:0,html.auto .sf-c-txt-skyblue\:0{color:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:10,html.auto .sf-c-txt-skyblue\:10{color:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:20,html.auto .sf-c-txt-skyblue\:20{color:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:30,html.auto .sf-c-txt-skyblue\:30{color:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:40,html.auto .sf-c-txt-skyblue\:40{color:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:50,html.auto .sf-c-txt-skyblue\:50{color:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:60,html.auto .sf-c-txt-skyblue\:60{color:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:70,html.auto .sf-c-txt-skyblue\:70{color:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:80,html.auto .sf-c-txt-skyblue\:80{color:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:90,html.auto .sf-c-txt-skyblue\:90{color:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:100,html.auto .sf-c-txt-skyblue\:100{color:hsl(197,71%,100%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark,html.auto .sf-c-txt-skyblue\:dark{color:hsl(197,71%,73%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark,html.auto .sf-c-txt-skyblue\:0\:dark{color:hsl(197,71%,0%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark,html.auto .sf-c-txt-skyblue\:10\:dark{color:hsl(197,71%,10%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark,html.auto .sf-c-txt-skyblue\:20\:dark{color:hsl(197,71%,20%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark,html.auto .sf-c-txt-skyblue\:30\:dark{color:hsl(197,71%,30%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark,html.auto .sf-c-txt-skyblue\:40\:dark{color:hsl(197,71%,40%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark,html.auto .sf-c-txt-skyblue\:50\:dark{color:hsl(197,71%,50%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark,html.auto .sf-c-txt-skyblue\:60\:dark{color:hsl(197,71%,60%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark,html.auto .sf-c-txt-skyblue\:70\:dark{color:hsl(197,71%,70%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark,html.auto .sf-c-txt-skyblue\:80\:dark{color:hsl(197,71%,80%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark,html.auto .sf-c-txt-skyblue\:90\:dark{color:hsl(197,71%,90%)}html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark,html.auto .sf-c-txt-skyblue\:100\:dark{color:hsl(197,71%,100%)}}[class*='violet']{--sf-c-violet:300 76% 72%;--sf-c-violet-0:300 76% 0%;--sf-c-violet-10:300 76% 10%;--sf-c-violet-20:300 76% 20%;--sf-c-violet-30:300 76% 30%;--sf-c-violet-40:300 76% 40%;--sf-c-violet-50:300 76% 50%;--sf-c-violet-60:300 76% 60%;--sf-c-violet-70:300 76% 70%;--sf-c-violet-80:300 76% 80%;--sf-c-violet-90:300 76% 90%;--sf-c-violet-100:300 76% 100%;--sf-c-txt-violet:var(--sf-c-violet);--sf-c-txt-violet-0:var(--sf-c-violet-0);--sf-c-txt-violet-10:var(--sf-c-violet-10);--sf-c-txt-violet-20:var(--sf-c-violet-20);--sf-c-txt-violet-30:var(--sf-c-violet-30);--sf-c-txt-violet-40:var(--sf-c-violet-40);--sf-c-txt-violet-50:var(--sf-c-violet-50);--sf-c-txt-violet-60:var(--sf-c-violet-60);--sf-c-txt-violet-70:var(--sf-c-violet-70);--sf-c-txt-violet-80:var(--sf-c-violet-80);--sf-c-txt-violet-90:var(--sf-c-violet-90);--sf-c-txt-violet-100:var(--sf-c-violet-100);--sf-dark-c-violet:300 76% 28%;--sf-dark-c-violet-0:300 76% 0%;--sf-dark-c-violet-10:300 76% 10%;--sf-dark-c-violet-20:300 76% 20%;--sf-dark-c-violet-30:300 76% 30%;--sf-dark-c-violet-40:300 76% 40%;--sf-dark-c-violet-50:300 76% 50%;--sf-dark-c-violet-60:300 76% 60%;--sf-dark-c-violet-70:300 76% 70%;--sf-dark-c-violet-80:300 76% 80%;--sf-dark-c-violet-90:300 76% 90%;--sf-dark-c-violet-100:300 76% 100%;--sf-dark-c-txt-violet:var(--sf-dark-c-violet);--sf-dark-c-txt-violet-0:var(--sf-dark-c-violet-0);--sf-dark-c-txt-violet-10:var(--sf-dark-c-violet-10);--sf-dark-c-txt-violet-20:var(--sf-dark-c-violet-20);--sf-dark-c-txt-violet-30:var(--sf-dark-c-violet-30);--sf-dark-c-txt-violet-40:var(--sf-dark-c-violet-40);--sf-dark-c-txt-violet-50:var(--sf-dark-c-violet-50);--sf-dark-c-txt-violet-60:var(--sf-dark-c-violet-60);--sf-dark-c-txt-violet-70:var(--sf-dark-c-violet-70);--sf-dark-c-txt-violet-80:var(--sf-dark-c-violet-80);--sf-dark-c-txt-violet-90:var(--sf-dark-c-violet-90);--sf-dark-c-txt-violet-100:var(--sf-dark-c-violet-100)}.sf-c-violet{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet))}.sf-c-violet\:0{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}.sf-c-violet\:10{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}.sf-c-violet\:20{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}.sf-c-violet\:30{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}.sf-c-violet\:40{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}.sf-c-violet\:50{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}.sf-c-violet\:60{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-60))}.sf-c-violet\:70{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-70))}.sf-c-violet\:80{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}.sf-c-violet\:90{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}.sf-c-violet\:100{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-100))}html.var .sf-c-violet{color:hsl(300,76%,10%);background:hsl(300,76%,72%)}html.var .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var .sf-c-violet\:10{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var .sf-c-violet\:20{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var .sf-c-violet\:30{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var .sf-c-violet\:40{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,60%)}html.var .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,70%)}html.var .sf-c-violet\:80{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var .sf-c-violet\:90{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var .sf-c-violet\:100{color:hsl(300,76%,10%);background:hsl(300,76%,100%)}.sf-c-txt-violet{color:hsl(var(--sf-dark-c-txt-violet))}.sf-c-txt-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-100))}.sf-c-txt-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-90))}.sf-c-txt-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-80))}.sf-c-txt-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-70))}.sf-c-txt-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-60))}.sf-c-txt-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-50))}.sf-c-txt-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-40))}.sf-c-txt-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-30))}.sf-c-txt-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-20))}.sf-c-txt-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-10))}.sf-c-txt-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-0))}html.var .sf-c-txt-violet{color:hsl(300,76%,28%)}html.var .sf-c-txt-violet\:0{color:hsl(300,76%,100%)}html.var .sf-c-txt-violet\:10{color:hsl(300,76%,90%)}html.var .sf-c-txt-violet\:20{color:hsl(300,76%,80%)}html.var .sf-c-txt-violet\:30{color:hsl(300,76%,70%)}html.var .sf-c-txt-violet\:40{color:hsl(300,76%,60%)}html.var .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var .sf-c-txt-violet\:60{color:hsl(300,76%,40%)}html.var .sf-c-txt-violet\:70{color:hsl(300,76%,30%)}html.var .sf-c-txt-violet\:80{color:hsl(300,76%,20%)}html.var .sf-c-txt-violet\:90{color:hsl(300,76%,10%)}html.var .sf-c-txt-violet\:100{color:hsl(300,76%,0%)}html[data-theme='dark'] .sf-c-violet,html.dark .sf-c-violet{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet))}html[data-theme='dark'] .sf-c-violet\:0,html.dark .sf-c-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-100))}html[data-theme='dark'] .sf-c-violet\:10,html.dark .sf-c-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-90))}html[data-theme='dark'] .sf-c-violet\:20,html.dark .sf-c-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-80))}html[data-theme='dark'] .sf-c-violet\:30,html.dark .sf-c-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-70))}html[data-theme='dark'] .sf-c-violet\:40,html.dark .sf-c-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-60))}html[data-theme='dark'] .sf-c-violet\:50,html.dark .sf-c-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-50))}html[data-theme='dark'] .sf-c-violet\:60,html.dark .sf-c-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-40))}html[data-theme='dark'] .sf-c-violet\:70,html.dark .sf-c-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-30))}html[data-theme='dark'] .sf-c-violet\:80,html.dark .sf-c-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-20))}html[data-theme='dark'] .sf-c-violet\:90,html.dark .sf-c-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-10))}html[data-theme='dark'] .sf-c-violet\:100,html.dark .sf-c-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-0))}html[data-theme='dark'] .sf-c-violet\:dark,html.dark .sf-c-violet\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet))}html[data-theme='dark'] .sf-c-violet\:0\:dark,html.dark .sf-c-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-100))}html[data-theme='dark'] .sf-c-violet\:10\:dark,html.dark .sf-c-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}html[data-theme='dark'] .sf-c-violet\:20\:dark,html.dark .sf-c-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}html[data-theme='dark'] .sf-c-violet\:30\:dark,html.dark .sf-c-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-70))}html[data-theme='dark'] .sf-c-violet\:40\:dark,html.dark .sf-c-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-60))}html[data-theme='dark'] .sf-c-violet\:50\:dark,html.dark .sf-c-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}html[data-theme='dark'] .sf-c-violet\:60\:dark,html.dark .sf-c-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}html[data-theme='dark'] .sf-c-violet\:70\:dark,html.dark .sf-c-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}html[data-theme='dark'] .sf-c-violet\:80\:dark,html.dark .sf-c-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}html[data-theme='dark'] .sf-c-violet\:90\:dark,html.dark .sf-c-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}html[data-theme='dark'] .sf-c-violet\:100\:dark,html.dark .sf-c-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}html[data-theme='dark'] .sf-c-txt-violet,html.dark .sf-c-txt-violet{color:hsl(var(--sf-c-txt-violet))}html[data-theme='dark'] .sf-c-txt-violet\:0,html.dark .sf-c-txt-violet\:0{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='dark'] .sf-c-txt-violet\:10,html.dark .sf-c-txt-violet\:10{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='dark'] .sf-c-txt-violet\:20,html.dark .sf-c-txt-violet\:20{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='dark'] .sf-c-txt-violet\:30,html.dark .sf-c-txt-violet\:30{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='dark'] .sf-c-txt-violet\:40,html.dark .sf-c-txt-violet\:40{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='dark'] .sf-c-txt-violet\:50,html.dark .sf-c-txt-violet\:50{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='dark'] .sf-c-txt-violet\:60,html.dark .sf-c-txt-violet\:60{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='dark'] .sf-c-txt-violet\:70,html.dark .sf-c-txt-violet\:70{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='dark'] .sf-c-txt-violet\:80,html.dark .sf-c-txt-violet\:80{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='dark'] .sf-c-txt-violet\:90,html.dark .sf-c-txt-violet\:90{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='dark'] .sf-c-txt-violet\:100,html.dark .sf-c-txt-violet\:100{color:hsl(var(--sf-c-txt-violet-100))}html[data-theme='dark'] .sf-c-txt-violet\:dark,html.dark .sf-c-txt-violet\:dark{color:hsl(var(--sf-c-txt-violet))}html[data-theme='dark'] .sf-c-txt-violet\:0\:dark,html.dark .sf-c-txt-violet\:0\:dark{color:hsl(var(--sf-dark-c-txt-violet-0))}html[data-theme='dark'] .sf-c-txt-violet\:10\:dark,html.dark .sf-c-txt-violet\:10\:dark{color:hsl(var(--sf-dark-c-txt-violet-10))}html[data-theme='dark'] .sf-c-txt-violet\:20\:dark,html.dark .sf-c-txt-violet\:20\:dark{color:hsl(var(--sf-dark-c-txt-violet-20))}html[data-theme='dark'] .sf-c-txt-violet\:30\:dark,html.dark .sf-c-txt-violet\:30\:dark{color:hsl(var(--sf-dark-c-txt-violet-30))}html[data-theme='dark'] .sf-c-txt-violet\:40\:dark,html.dark .sf-c-txt-violet\:40\:dark{color:hsl(var(--sf-dark-c-txt-violet-40))}html[data-theme='dark'] .sf-c-txt-violet\:50\:dark,html.dark .sf-c-txt-violet\:50\:dark{color:hsl(var(--sf-dark-c-txt-violet-50))}html[data-theme='dark'] .sf-c-txt-violet\:60\:dark,html.dark .sf-c-txt-violet\:60\:dark{color:hsl(var(--sf-dark-c-txt-violet-60))}html[data-theme='dark'] .sf-c-txt-violet\:70\:dark,html.dark .sf-c-txt-violet\:70\:dark{color:hsl(var(--sf-dark-c-txt-violet-70))}html[data-theme='dark'] .sf-c-txt-violet\:80\:dark,html.dark .sf-c-txt-violet\:80\:dark{color:hsl(var(--sf-dark-c-txt-violet-80))}html[data-theme='dark'] .sf-c-txt-violet\:90\:dark,html.dark .sf-c-txt-violet\:90\:dark{color:hsl(var(--sf-dark-c-txt-violet-90))}html[data-theme='dark'] .sf-c-txt-violet\:100\:dark,html.dark .sf-c-txt-violet\:100\:dark{color:hsl(var(--sf-dark-c-txt-violet-100))}html.var[data-theme='dark'] .sf-c-violet,html.var.dark .sf-c-violet{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='dark'] .sf-c-violet\:0,html.var.dark .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-violet\:10,html.var.dark .sf-c-violet\:10{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-violet\:20,html.var.dark .sf-c-violet\:20{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-violet\:30,html.var.dark .sf-c-violet\:30{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-violet\:40,html.var.dark .sf-c-violet\:40{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-violet\:50,html.var.dark .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-violet\:60,html.var.dark .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-violet\:70,html.var.dark .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-violet\:80,html.var.dark .sf-c-violet\:80{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-violet\:90,html.var.dark .sf-c-violet\:90{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-violet\:100,html.var.dark .sf-c-violet\:100{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-violet\:dark,html.var.dark .sf-c-violet\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='dark'] .sf-c-violet\:0\:dark,html.var.dark .sf-c-violet\:0\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-violet\:10\:dark,html.var.dark .sf-c-violet\:10\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-violet\:20\:dark,html.var.dark .sf-c-violet\:20\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-violet\:30\:dark,html.var.dark .sf-c-violet\:30\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-violet\:40\:dark,html.var.dark .sf-c-violet\:40\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-violet\:50\:dark,html.var.dark .sf-c-violet\:50\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-violet\:60\:dark,html.var.dark .sf-c-violet\:60\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-violet\:70\:dark,html.var.dark .sf-c-violet\:70\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-violet\:80\:dark,html.var.dark .sf-c-violet\:80\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-violet\:90\:dark,html.var.dark .sf-c-violet\:90\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-violet\:100\:dark,html.var.dark .sf-c-violet\:100\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet,html.dark .sf-c-txt-violet{color:hsl(300,76%,72%)}html.var[data-theme='dark'] .sf-c-txt-violet\:0,html.dark .sf-c-txt-violet\:0{color:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet\:10,html.dark .sf-c-txt-violet\:10{color:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-txt-violet\:20,html.dark .sf-c-txt-violet\:20{color:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-txt-violet\:30,html.dark .sf-c-txt-violet\:30{color:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-txt-violet\:40,html.dark .sf-c-txt-violet\:40{color:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-txt-violet\:50,html.dark .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-txt-violet\:60,html.dark .sf-c-txt-violet\:60{color:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-txt-violet\:70,html.dark .sf-c-txt-violet\:70{color:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-txt-violet\:80,html.dark .sf-c-txt-violet\:80{color:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-txt-violet\:90,html.dark .sf-c-txt-violet\:90{color:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-txt-violet\:100,html.dark .sf-c-txt-violet\:100{color:hsl(300,76%,100%)}html.var[data-theme='dark'] .sf-c-txt-violet\:dark,html.dark .sf-c-txt-violet\:dark{color:hsl(300,76%,72%)}html.var[data-theme='dark'] .sf-c-txt-violet\:0\:dark,html.dark .sf-c-txt-violet\:0\:dark{color:hsl(300,76%,0%)}html.var[data-theme='dark'] .sf-c-txt-violet\:10\:dark,html.dark .sf-c-txt-violet\:10\:dark{color:hsl(300,76%,10%)}html.var[data-theme='dark'] .sf-c-txt-violet\:20\:dark,html.dark .sf-c-txt-violet\:20\:dark{color:hsl(300,76%,20%)}html.var[data-theme='dark'] .sf-c-txt-violet\:30\:dark,html.dark .sf-c-txt-violet\:30\:dark{color:hsl(300,76%,30%)}html.var[data-theme='dark'] .sf-c-txt-violet\:40\:dark,html.dark .sf-c-txt-violet\:40\:dark{color:hsl(300,76%,40%)}html.var[data-theme='dark'] .sf-c-txt-violet\:50\:dark,html.dark .sf-c-txt-violet\:50\:dark{color:hsl(300,76%,50%)}html.var[data-theme='dark'] .sf-c-txt-violet\:60\:dark,html.dark .sf-c-txt-violet\:60\:dark{color:hsl(300,76%,60%)}html.var[data-theme='dark'] .sf-c-txt-violet\:70\:dark,html.dark .sf-c-txt-violet\:70\:dark{color:hsl(300,76%,70%)}html.var[data-theme='dark'] .sf-c-txt-violet\:80\:dark,html.dark .sf-c-txt-violet\:80\:dark{color:hsl(300,76%,80%)}html.var[data-theme='dark'] .sf-c-txt-violet\:90\:dark,html.dark .sf-c-txt-violet\:90\:dark{color:hsl(300,76%,90%)}html.var[data-theme='dark'] .sf-c-txt-violet\:100\:dark,html.dark .sf-c-txt-violet\:100\:dark{color:hsl(300,76%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-violet,html.auto .sf-c-violet{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet))}html[data-theme='auto'] .sf-c-violet\:0,html.auto .sf-c-violet\:0{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-100))}html[data-theme='auto'] .sf-c-violet\:10,html.auto .sf-c-violet\:10{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-90))}html[data-theme='auto'] .sf-c-violet\:20,html.auto .sf-c-violet\:20{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-80))}html[data-theme='auto'] .sf-c-violet\:30,html.auto .sf-c-violet\:30{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-70))}html[data-theme='auto'] .sf-c-violet\:40,html.auto .sf-c-violet\:40{color:hsl(var(--sf-dark-c-txt-violet-10));background:hsl(var(--sf-dark-c-violet-60))}html[data-theme='auto'] .sf-c-violet\:50,html.auto .sf-c-violet\:50{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-50))}html[data-theme='auto'] .sf-c-violet\:60,html.auto .sf-c-violet\:60{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-40))}html[data-theme='auto'] .sf-c-violet\:70,html.auto .sf-c-violet\:70{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-30))}html[data-theme='auto'] .sf-c-violet\:80,html.auto .sf-c-violet\:80{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-20))}html[data-theme='auto'] .sf-c-violet\:90,html.auto .sf-c-violet\:90{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-10))}html[data-theme='auto'] .sf-c-violet\:100,html.auto .sf-c-violet\:100{color:hsl(var(--sf-dark-c-txt-violet-90));background:hsl(var(--sf-dark-c-violet-0))}html[data-theme='auto'] .sf-c-violet\:dark,html.auto .sf-c-violet\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet))}html[data-theme='auto'] .sf-c-violet\:0\:dark,html.auto .sf-c-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-100))}html[data-theme='auto'] .sf-c-violet\:10\:dark,html.auto .sf-c-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-90))}html[data-theme='auto'] .sf-c-violet\:20\:dark,html.auto .sf-c-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-80))}html[data-theme='auto'] .sf-c-violet\:30\:dark,html.auto .sf-c-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-70))}html[data-theme='auto'] .sf-c-violet\:40\:dark,html.auto .sf-c-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-10));background:hsl(var(--sf-c-violet-60))}html[data-theme='auto'] .sf-c-violet\:50\:dark,html.auto .sf-c-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-50))}html[data-theme='auto'] .sf-c-violet\:60\:dark,html.auto .sf-c-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-40))}html[data-theme='auto'] .sf-c-violet\:70\:dark,html.auto .sf-c-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-30))}html[data-theme='auto'] .sf-c-violet\:80\:dark,html.auto .sf-c-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-20))}html[data-theme='auto'] .sf-c-violet\:90\:dark,html.auto .sf-c-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-10))}html[data-theme='auto'] .sf-c-violet\:100\:dark,html.auto .sf-c-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-90));background:hsl(var(--sf-c-violet-0))}html[data-theme='auto'] .sf-c-txt-violet,html.auto .sf-c-txt-violet{color:hsl(var(--sf-c-txt-violet))}html[data-theme='auto'] .sf-c-txt-violet\:0,html.auto .sf-c-txt-violet\:0{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='auto'] .sf-c-txt-violet\:10,html.auto .sf-c-txt-violet\:10{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='auto'] .sf-c-txt-violet\:20,html.auto .sf-c-txt-violet\:20{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='auto'] .sf-c-txt-violet\:30,html.auto .sf-c-txt-violet\:30{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='auto'] .sf-c-txt-violet\:40,html.auto .sf-c-txt-violet\:40{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='auto'] .sf-c-txt-violet\:50,html.auto .sf-c-txt-violet\:50{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='auto'] .sf-c-txt-violet\:60,html.auto .sf-c-txt-violet\:60{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='auto'] .sf-c-txt-violet\:70,html.auto .sf-c-txt-violet\:70{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='auto'] .sf-c-txt-violet\:80,html.auto .sf-c-txt-violet\:80{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='auto'] .sf-c-txt-violet\:90,html.auto .sf-c-txt-violet\:90{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='auto'] .sf-c-txt-violet\:100,html.auto .sf-c-txt-violet\:100{color:hsl(var(--sf-c-txt-violet-100))}html[data-theme='auto'] .sf-c-txt-violet\:dark,html.auto .sf-c-txt-violet\:dark{color:hsl(var(--sf-c-txt-violet))}html[data-theme='auto'] .sf-c-txt-violet\:0\:dark,html.auto .sf-c-txt-violet\:0\:dark{color:hsl(var(--sf-c-txt-violet-0))}html[data-theme='auto'] .sf-c-txt-violet\:10\:dark,html.auto .sf-c-txt-violet\:10\:dark{color:hsl(var(--sf-c-txt-violet-10))}html[data-theme='auto'] .sf-c-txt-violet\:20\:dark,html.auto .sf-c-txt-violet\:20\:dark{color:hsl(var(--sf-c-txt-violet-20))}html[data-theme='auto'] .sf-c-txt-violet\:30\:dark,html.auto .sf-c-txt-violet\:30\:dark{color:hsl(var(--sf-c-txt-violet-30))}html[data-theme='auto'] .sf-c-txt-violet\:40\:dark,html.auto .sf-c-txt-violet\:40\:dark{color:hsl(var(--sf-c-txt-violet-40))}html[data-theme='auto'] .sf-c-txt-violet\:50\:dark,html.auto .sf-c-txt-violet\:50\:dark{color:hsl(var(--sf-c-txt-violet-50))}html[data-theme='auto'] .sf-c-txt-violet\:60\:dark,html.auto .sf-c-txt-violet\:60\:dark{color:hsl(var(--sf-c-txt-violet-60))}html[data-theme='auto'] .sf-c-txt-violet\:70\:dark,html.auto .sf-c-txt-violet\:70\:dark{color:hsl(var(--sf-c-txt-violet-70))}html[data-theme='auto'] .sf-c-txt-violet\:80\:dark,html.auto .sf-c-txt-violet\:80\:dark{color:hsl(var(--sf-c-txt-violet-80))}html[data-theme='auto'] .sf-c-txt-violet\:90\:dark,html.auto .sf-c-txt-violet\:90\:dark{color:hsl(var(--sf-c-txt-violet-90))}html[data-theme='auto'] .sf-c-txt-violet\:100\:dark,html.auto .sf-c-txt-violet\:100\:dark{color:hsl(var(--sf-c-txt-violet-100))}html.var[data-theme='auto'] .sf-c-violet,html.var.auto .sf-c-violet{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='auto'] .sf-c-violet\:0,html.var.auto .sf-c-violet\:0{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-violet\:10,html.var.auto .sf-c-violet\:10{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-violet\:20,html.var.auto .sf-c-violet\:20{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-violet\:30,html.var.auto .sf-c-violet\:30{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-violet\:40,html.var.auto .sf-c-violet\:40{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-violet\:50,html.var.auto .sf-c-violet\:50{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-violet\:60,html.var.auto .sf-c-violet\:60{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-violet\:70,html.var.auto .sf-c-violet\:70{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-violet\:80,html.var.auto .sf-c-violet\:80{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-violet\:90,html.var.auto .sf-c-violet\:90{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-violet\:100,html.var.auto .sf-c-violet\:100{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-violet\:dark,html.var.auto .sf-c-violet\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,28%)}html.var[data-theme='auto'] .sf-c-violet\:0\:dark,html.var.auto .sf-c-violet\:0\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-violet\:10\:dark,html.var.auto .sf-c-violet\:10\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-violet\:20\:dark,html.var.auto .sf-c-violet\:20\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-violet\:30\:dark,html.var.auto .sf-c-violet\:30\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-violet\:40\:dark,html.var.auto .sf-c-violet\:40\:dark{color:hsl(300,76%,10%);background:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-violet\:50\:dark,html.var.auto .sf-c-violet\:50\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-violet\:60\:dark,html.var.auto .sf-c-violet\:60\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-violet\:70\:dark,html.var.auto .sf-c-violet\:70\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-violet\:80\:dark,html.var.auto .sf-c-violet\:80\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-violet\:90\:dark,html.var.auto .sf-c-violet\:90\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-violet\:100\:dark,html.var.auto .sf-c-violet\:100\:dark{color:hsl(300,76%,90%);background:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet,html.auto .sf-c-txt-violet{color:hsl(300,76%,72%)}html.var[data-theme='auto'] .sf-c-txt-violet\:0,html.auto .sf-c-txt-violet\:0{color:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet\:10,html.auto .sf-c-txt-violet\:10{color:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-txt-violet\:20,html.auto .sf-c-txt-violet\:20{color:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-txt-violet\:30,html.auto .sf-c-txt-violet\:30{color:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-txt-violet\:40,html.auto .sf-c-txt-violet\:40{color:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-txt-violet\:50,html.auto .sf-c-txt-violet\:50{color:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-txt-violet\:60,html.auto .sf-c-txt-violet\:60{color:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-txt-violet\:70,html.auto .sf-c-txt-violet\:70{color:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-txt-violet\:80,html.auto .sf-c-txt-violet\:80{color:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-txt-violet\:90,html.auto .sf-c-txt-violet\:90{color:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-txt-violet\:100,html.auto .sf-c-txt-violet\:100{color:hsl(300,76%,100%)}html.var[data-theme='auto'] .sf-c-txt-violet\:dark,html.auto .sf-c-txt-violet\:dark{color:hsl(300,76%,72%)}html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark,html.auto .sf-c-txt-violet\:0\:dark{color:hsl(300,76%,0%)}html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark,html.auto .sf-c-txt-violet\:10\:dark{color:hsl(300,76%,10%)}html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark,html.auto .sf-c-txt-violet\:20\:dark{color:hsl(300,76%,20%)}html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark,html.auto .sf-c-txt-violet\:30\:dark{color:hsl(300,76%,30%)}html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark,html.auto .sf-c-txt-violet\:40\:dark{color:hsl(300,76%,40%)}html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark,html.auto .sf-c-txt-violet\:50\:dark{color:hsl(300,76%,50%)}html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark,html.auto .sf-c-txt-violet\:60\:dark{color:hsl(300,76%,60%)}html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark,html.auto .sf-c-txt-violet\:70\:dark{color:hsl(300,76%,70%)}html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark,html.auto .sf-c-txt-violet\:80\:dark{color:hsl(300,76%,80%)}html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark,html.auto .sf-c-txt-violet\:90\:dark{color:hsl(300,76%,90%)}html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark,html.auto .sf-c-txt-violet\:100\:dark{color:hsl(300,76%,100%)}}[class*='yellow']{--sf-c-yellow:60 100% 50%;--sf-c-yellow-0:60 100% 0%;--sf-c-yellow-10:60 100% 10%;--sf-c-yellow-20:60 100% 20%;--sf-c-yellow-30:60 100% 30%;--sf-c-yellow-40:60 100% 40%;--sf-c-yellow-50:60 100% 50%;--sf-c-yellow-60:60 100% 60%;--sf-c-yellow-70:60 100% 70%;--sf-c-yellow-80:60 100% 80%;--sf-c-yellow-90:60 100% 90%;--sf-c-yellow-100:60 100% 100%;--sf-c-txt-yellow:var(--sf-c-yellow);--sf-c-txt-yellow-0:var(--sf-c-yellow-0);--sf-c-txt-yellow-10:var(--sf-c-yellow-10);--sf-c-txt-yellow-20:var(--sf-c-yellow-20);--sf-c-txt-yellow-30:var(--sf-c-yellow-30);--sf-c-txt-yellow-40:var(--sf-c-yellow-40);--sf-c-txt-yellow-50:var(--sf-c-yellow-50);--sf-c-txt-yellow-60:var(--sf-c-yellow-60);--sf-c-txt-yellow-70:var(--sf-c-yellow-70);--sf-c-txt-yellow-80:var(--sf-c-yellow-80);--sf-c-txt-yellow-90:var(--sf-c-yellow-90);--sf-c-txt-yellow-100:var(--sf-c-yellow-100);--sf-dark-c-yellow:60 100% 50%;--sf-dark-c-yellow-0:60 100% 0%;--sf-dark-c-yellow-10:60 100% 10%;--sf-dark-c-yellow-20:60 100% 20%;--sf-dark-c-yellow-30:60 100% 30%;--sf-dark-c-yellow-40:60 100% 40%;--sf-dark-c-yellow-50:60 100% 50%;--sf-dark-c-yellow-60:60 100% 60%;--sf-dark-c-yellow-70:60 100% 70%;--sf-dark-c-yellow-80:60 100% 80%;--sf-dark-c-yellow-90:60 100% 90%;--sf-dark-c-yellow-100:60 100% 100%;--sf-dark-c-txt-yellow:var(--sf-dark-c-yellow);--sf-dark-c-txt-yellow-0:var(--sf-dark-c-yellow-0);--sf-dark-c-txt-yellow-10:var(--sf-dark-c-yellow-10);--sf-dark-c-txt-yellow-20:var(--sf-dark-c-yellow-20);--sf-dark-c-txt-yellow-30:var(--sf-dark-c-yellow-30);--sf-dark-c-txt-yellow-40:var(--sf-dark-c-yellow-40);--sf-dark-c-txt-yellow-50:var(--sf-dark-c-yellow-50);--sf-dark-c-txt-yellow-60:var(--sf-dark-c-yellow-60);--sf-dark-c-txt-yellow-70:var(--sf-dark-c-yellow-70);--sf-dark-c-txt-yellow-80:var(--sf-dark-c-yellow-80);--sf-dark-c-txt-yellow-90:var(--sf-dark-c-yellow-90);--sf-dark-c-txt-yellow-100:var(--sf-dark-c-yellow-100)}.sf-c-yellow{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}.sf-c-yellow\:0{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}.sf-c-yellow\:10{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}.sf-c-yellow\:20{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}.sf-c-yellow\:30{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-30))}.sf-c-yellow\:40{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-40))}.sf-c-yellow\:50{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}.sf-c-yellow\:60{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}.sf-c-yellow\:70{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}.sf-c-yellow\:80{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}.sf-c-yellow\:90{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}.sf-c-yellow\:100{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-100))}html.var .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-yellow\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-yellow\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-yellow\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-yellow\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-yellow\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-yellow\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-yellow\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-yellow{color:hsl(var(--sf-dark-c-txt-yellow))}.sf-c-txt-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-100))}.sf-c-txt-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-90))}.sf-c-txt-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-80))}.sf-c-txt-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-70))}.sf-c-txt-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-60))}.sf-c-txt-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-50))}.sf-c-txt-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-40))}.sf-c-txt-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-30))}.sf-c-txt-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-20))}.sf-c-txt-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-10))}.sf-c-txt-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-0))}html.var .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-yellow\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-yellow\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-yellow\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-yellow\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-yellow\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-yellow\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-yellow\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-yellow\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-yellow,html.dark .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0,html.dark .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10,html.dark .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20,html.dark .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30,html.dark .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40,html.dark .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50,html.dark .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60,html.dark .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70,html.dark .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80,html.dark .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90,html.dark .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100,html.dark .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='dark'] .sf-c-yellow\:dark,html.dark .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0\:dark,html.dark .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10\:dark,html.dark .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20\:dark,html.dark .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30\:dark,html.dark .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40\:dark,html.dark .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50\:dark,html.dark .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60\:dark,html.dark .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70\:dark,html.dark .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80\:dark,html.dark .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90\:dark,html.dark .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100\:dark,html.dark .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-dark-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-dark-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-dark-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-dark-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-dark-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-dark-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-dark-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-dark-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-dark-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-dark-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-dark-c-txt-yellow-100))}html.var[data-theme='dark'] .sf-c-yellow,html.var.dark .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0,html.var.dark .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10,html.var.dark .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20,html.var.dark .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30,html.var.dark .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40,html.var.dark .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50,html.var.dark .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60,html.var.dark .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70,html.var.dark .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80,html.var.dark .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90,html.var.dark .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100,html.var.dark .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-yellow\:dark,html.var.dark .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0\:dark,html.var.dark .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10\:dark,html.var.dark .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20\:dark,html.var.dark .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30\:dark,html.var.dark .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40\:dark,html.var.dark .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50\:dark,html.var.dark .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60\:dark,html.var.dark .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70\:dark,html.var.dark .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80\:dark,html.var.dark .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90\:dark,html.var.dark .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100\:dark,html.var.dark .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-yellow,html.auto .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0,html.auto .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10,html.auto .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20,html.auto .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30,html.auto .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40,html.auto .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50,html.auto .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60,html.auto .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70,html.auto .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80,html.auto .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90,html.auto .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100,html.auto .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='auto'] .sf-c-yellow\:dark,html.auto .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0\:dark,html.auto .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10\:dark,html.auto .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20\:dark,html.auto .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30\:dark,html.auto .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40\:dark,html.auto .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50\:dark,html.auto .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60\:dark,html.auto .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70\:dark,html.auto .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80\:dark,html.auto .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90\:dark,html.auto .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100\:dark,html.auto .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-100))}html.var[data-theme='auto'] .sf-c-yellow,html.var.auto .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0,html.var.auto .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10,html.var.auto .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20,html.var.auto .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30,html.var.auto .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40,html.var.auto .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50,html.var.auto .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60,html.var.auto .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70,html.var.auto .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80,html.var.auto .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90,html.var.auto .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100,html.var.auto .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-yellow\:dark,html.var.auto .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0\:dark,html.var.auto .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10\:dark,html.var.auto .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20\:dark,html.var.auto .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30\:dark,html.var.auto .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40\:dark,html.var.auto .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50\:dark,html.var.auto .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60\:dark,html.var.auto .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70\:dark,html.var.auto .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80\:dark,html.var.auto .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90\:dark,html.var.auto .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100\:dark,html.var.auto .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}} \ No newline at end of file diff --git a/package.json b/package.json index a591f7e..eb10a1d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "style-forge.colors", - "version": "2025.1.18", + "version": "2025.1.22", "description": "Style-Forge.Colors: customizable color palettes for consistent, visually appealing web designs.", "type": "module", "main": "colors.css", diff --git a/src/colors/10/aliceblue.css b/src/colors/10/aliceblue.css index 1dc25ee..116357a 100644 --- a/src/colors/10/aliceblue.css +++ b/src/colors/10/aliceblue.css @@ -1,4 +1,4 @@ -:root { +[class*='aliceblue'] { --sf-c-aliceblue: 208 100% 97%; --sf-c-aliceblue-0: 208 100% 0%; --sf-c-aliceblue-10: 208 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-aliceblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-aliceblue\:90\:dark, html.var.auto .sf-c-aliceblue\:90\:dark { color: hsl(208, 100%, 90%); background: hsl(208, 100%, 10%) } html.var[data-theme='auto'] .sf-c-aliceblue\:100\:dark, html.var.auto .sf-c-aliceblue\:100\:dark { color: hsl(208, 100%, 90%); background: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.var.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.var.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.var.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.var.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.var.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.var.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.var.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.var.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.var.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.var.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.var.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.var.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.var.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.var.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.var.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.var.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.var.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.var.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.var.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.var.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.var.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.var.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.var.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.var.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/antiquewhite.css b/src/colors/10/antiquewhite.css index 3f9ea9a..b2f9a53 100644 --- a/src/colors/10/antiquewhite.css +++ b/src/colors/10/antiquewhite.css @@ -1,4 +1,4 @@ -:root { +[class*='antiquewhite'] { --sf-c-antiquewhite: 34 78% 91%; --sf-c-antiquewhite-0: 34 78% 0%; --sf-c-antiquewhite-10: 34 78% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-antiquewhite\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-antiquewhite\:90\:dark, html.var.auto .sf-c-antiquewhite\:90\:dark { color: hsl(34, 78%, 90%); background: hsl(34, 78%, 10%) } html.var[data-theme='auto'] .sf-c-antiquewhite\:100\:dark, html.var.auto .sf-c-antiquewhite\:100\:dark { color: hsl(34, 78%, 90%); background: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite, html.auto .sf-c-txt-antiquewhite { color: hsl(34, 78%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0, html.auto .sf-c-txt-antiquewhite\:0 { color: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10, html.auto .sf-c-txt-antiquewhite\:10 { color: hsl(34, 78%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20, html.auto .sf-c-txt-antiquewhite\:20 { color: hsl(34, 78%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30, html.auto .sf-c-txt-antiquewhite\:30 { color: hsl(34, 78%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40, html.auto .sf-c-txt-antiquewhite\:40 { color: hsl(34, 78%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50, html.auto .sf-c-txt-antiquewhite\:50 { color: hsl(34, 78%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60, html.auto .sf-c-txt-antiquewhite\:60 { color: hsl(34, 78%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70, html.auto .sf-c-txt-antiquewhite\:70 { color: hsl(34, 78%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80, html.auto .sf-c-txt-antiquewhite\:80 { color: hsl(34, 78%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90, html.auto .sf-c-txt-antiquewhite\:90 { color: hsl(34, 78%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100, html.auto .sf-c-txt-antiquewhite\:100 { color: hsl(34, 78%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite, html.var.auto .sf-c-txt-antiquewhite { color: hsl(34, 78%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0, html.var.auto .sf-c-txt-antiquewhite\:0 { color: hsl(34, 78%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10, html.var.auto .sf-c-txt-antiquewhite\:10 { color: hsl(34, 78%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20, html.var.auto .sf-c-txt-antiquewhite\:20 { color: hsl(34, 78%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30, html.var.auto .sf-c-txt-antiquewhite\:30 { color: hsl(34, 78%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40, html.var.auto .sf-c-txt-antiquewhite\:40 { color: hsl(34, 78%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50, html.var.auto .sf-c-txt-antiquewhite\:50 { color: hsl(34, 78%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60, html.var.auto .sf-c-txt-antiquewhite\:60 { color: hsl(34, 78%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70, html.var.auto .sf-c-txt-antiquewhite\:70 { color: hsl(34, 78%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80, html.var.auto .sf-c-txt-antiquewhite\:80 { color: hsl(34, 78%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90, html.var.auto .sf-c-txt-antiquewhite\:90 { color: hsl(34, 78%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100, html.var.auto .sf-c-txt-antiquewhite\:100 { color: hsl(34, 78%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:dark, html.auto .sf-c-txt-antiquewhite\:dark { color: hsl(34, 78%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0\:dark, html.auto .sf-c-txt-antiquewhite\:0\:dark { color: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10\:dark, html.auto .sf-c-txt-antiquewhite\:10\:dark { color: hsl(34, 78%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20\:dark, html.auto .sf-c-txt-antiquewhite\:20\:dark { color: hsl(34, 78%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30\:dark, html.auto .sf-c-txt-antiquewhite\:30\:dark { color: hsl(34, 78%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40\:dark, html.auto .sf-c-txt-antiquewhite\:40\:dark { color: hsl(34, 78%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50\:dark, html.auto .sf-c-txt-antiquewhite\:50\:dark { color: hsl(34, 78%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60\:dark, html.auto .sf-c-txt-antiquewhite\:60\:dark { color: hsl(34, 78%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70\:dark, html.auto .sf-c-txt-antiquewhite\:70\:dark { color: hsl(34, 78%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80\:dark, html.auto .sf-c-txt-antiquewhite\:80\:dark { color: hsl(34, 78%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90\:dark, html.auto .sf-c-txt-antiquewhite\:90\:dark { color: hsl(34, 78%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100\:dark, html.auto .sf-c-txt-antiquewhite\:100\:dark { color: hsl(34, 78%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:dark, html.var.auto .sf-c-txt-antiquewhite\:dark { color: hsl(34, 78%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0\:dark, html.var.auto .sf-c-txt-antiquewhite\:0\:dark { color: hsl(34, 78%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10\:dark, html.var.auto .sf-c-txt-antiquewhite\:10\:dark { color: hsl(34, 78%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20\:dark, html.var.auto .sf-c-txt-antiquewhite\:20\:dark { color: hsl(34, 78%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30\:dark, html.var.auto .sf-c-txt-antiquewhite\:30\:dark { color: hsl(34, 78%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40\:dark, html.var.auto .sf-c-txt-antiquewhite\:40\:dark { color: hsl(34, 78%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50\:dark, html.var.auto .sf-c-txt-antiquewhite\:50\:dark { color: hsl(34, 78%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60\:dark, html.var.auto .sf-c-txt-antiquewhite\:60\:dark { color: hsl(34, 78%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70\:dark, html.var.auto .sf-c-txt-antiquewhite\:70\:dark { color: hsl(34, 78%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80\:dark, html.var.auto .sf-c-txt-antiquewhite\:80\:dark { color: hsl(34, 78%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90\:dark, html.var.auto .sf-c-txt-antiquewhite\:90\:dark { color: hsl(34, 78%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100\:dark, html.var.auto .sf-c-txt-antiquewhite\:100\:dark { color: hsl(34, 78%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/aqua.css b/src/colors/10/aqua.css index 142dc9d..0fead74 100644 --- a/src/colors/10/aqua.css +++ b/src/colors/10/aqua.css @@ -1,4 +1,4 @@ -:root { +[class*='aqua'] { --sf-c-aqua: 180 100% 50%; --sf-c-aqua-0: 180 100% 0%; --sf-c-aqua-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-aqua\:100\:dark, html.dark .sf-c-txt-aqua\ html.var[data-theme='auto'] .sf-c-aqua\:90\:dark, html.var.auto .sf-c-aqua\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-aqua\:100\:dark, html.var.auto .sf-c-aqua\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua, html.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aqua, html.var.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.var.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.var.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.var.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.var.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.var.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.var.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.var.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.var.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.var.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.var.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.var.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.var.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.var.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.var.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.var.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.var.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.var.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.var.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.var.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.var.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.var.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.var.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.var.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/aquamarine.css b/src/colors/10/aquamarine.css index 56aad55..53953a4 100644 --- a/src/colors/10/aquamarine.css +++ b/src/colors/10/aquamarine.css @@ -1,4 +1,4 @@ -:root { +[class*='aquamarine'] { --sf-c-aquamarine: 160 100% 75%; --sf-c-aquamarine-0: 160 100% 0%; --sf-c-aquamarine-10: 160 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-aquamarine\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-aquamarine\:90\:dark, html.var.auto .sf-c-aquamarine\:90\:dark { color: hsl(160, 100%, 90%); background: hsl(160, 100%, 10%) } html.var[data-theme='auto'] .sf-c-aquamarine\:100\:dark, html.var.auto .sf-c-aquamarine\:100\:dark { color: hsl(160, 100%, 90%); background: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine, html.auto .sf-c-txt-aquamarine { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0, html.auto .sf-c-txt-aquamarine\:0 { color: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10, html.auto .sf-c-txt-aquamarine\:10 { color: hsl(160, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20, html.auto .sf-c-txt-aquamarine\:20 { color: hsl(160, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30, html.auto .sf-c-txt-aquamarine\:30 { color: hsl(160, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40, html.auto .sf-c-txt-aquamarine\:40 { color: hsl(160, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50, html.auto .sf-c-txt-aquamarine\:50 { color: hsl(160, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60, html.auto .sf-c-txt-aquamarine\:60 { color: hsl(160, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70, html.auto .sf-c-txt-aquamarine\:70 { color: hsl(160, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80, html.auto .sf-c-txt-aquamarine\:80 { color: hsl(160, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90, html.auto .sf-c-txt-aquamarine\:90 { color: hsl(160, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100, html.auto .sf-c-txt-aquamarine\:100 { color: hsl(160, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine, html.var.auto .sf-c-txt-aquamarine { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0, html.var.auto .sf-c-txt-aquamarine\:0 { color: hsl(160, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10, html.var.auto .sf-c-txt-aquamarine\:10 { color: hsl(160, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20, html.var.auto .sf-c-txt-aquamarine\:20 { color: hsl(160, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30, html.var.auto .sf-c-txt-aquamarine\:30 { color: hsl(160, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40, html.var.auto .sf-c-txt-aquamarine\:40 { color: hsl(160, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50, html.var.auto .sf-c-txt-aquamarine\:50 { color: hsl(160, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60, html.var.auto .sf-c-txt-aquamarine\:60 { color: hsl(160, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70, html.var.auto .sf-c-txt-aquamarine\:70 { color: hsl(160, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80, html.var.auto .sf-c-txt-aquamarine\:80 { color: hsl(160, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90, html.var.auto .sf-c-txt-aquamarine\:90 { color: hsl(160, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100, html.var.auto .sf-c-txt-aquamarine\:100 { color: hsl(160, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:dark, html.auto .sf-c-txt-aquamarine\:dark { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0\:dark, html.auto .sf-c-txt-aquamarine\:0\:dark { color: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10\:dark, html.auto .sf-c-txt-aquamarine\:10\:dark { color: hsl(160, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20\:dark, html.auto .sf-c-txt-aquamarine\:20\:dark { color: hsl(160, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30\:dark, html.auto .sf-c-txt-aquamarine\:30\:dark { color: hsl(160, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40\:dark, html.auto .sf-c-txt-aquamarine\:40\:dark { color: hsl(160, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50\:dark, html.auto .sf-c-txt-aquamarine\:50\:dark { color: hsl(160, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60\:dark, html.auto .sf-c-txt-aquamarine\:60\:dark { color: hsl(160, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70\:dark, html.auto .sf-c-txt-aquamarine\:70\:dark { color: hsl(160, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80\:dark, html.auto .sf-c-txt-aquamarine\:80\:dark { color: hsl(160, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90\:dark, html.auto .sf-c-txt-aquamarine\:90\:dark { color: hsl(160, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100\:dark, html.auto .sf-c-txt-aquamarine\:100\:dark { color: hsl(160, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:dark, html.var.auto .sf-c-txt-aquamarine\:dark { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0\:dark, html.var.auto .sf-c-txt-aquamarine\:0\:dark { color: hsl(160, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10\:dark, html.var.auto .sf-c-txt-aquamarine\:10\:dark { color: hsl(160, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20\:dark, html.var.auto .sf-c-txt-aquamarine\:20\:dark { color: hsl(160, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30\:dark, html.var.auto .sf-c-txt-aquamarine\:30\:dark { color: hsl(160, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40\:dark, html.var.auto .sf-c-txt-aquamarine\:40\:dark { color: hsl(160, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50\:dark, html.var.auto .sf-c-txt-aquamarine\:50\:dark { color: hsl(160, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60\:dark, html.var.auto .sf-c-txt-aquamarine\:60\:dark { color: hsl(160, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70\:dark, html.var.auto .sf-c-txt-aquamarine\:70\:dark { color: hsl(160, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80\:dark, html.var.auto .sf-c-txt-aquamarine\:80\:dark { color: hsl(160, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90\:dark, html.var.auto .sf-c-txt-aquamarine\:90\:dark { color: hsl(160, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100\:dark, html.var.auto .sf-c-txt-aquamarine\:100\:dark { color: hsl(160, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/azure.css b/src/colors/10/azure.css index c480ccf..ae7023a 100644 --- a/src/colors/10/azure.css +++ b/src/colors/10/azure.css @@ -1,4 +1,4 @@ -:root { +[class*='azure'] { --sf-c-azure: 180 100% 97%; --sf-c-azure-0: 180 100% 0%; --sf-c-azure-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-azure\:100\:dark, html.dark .sf-c-txt-azur html.var[data-theme='auto'] .sf-c-azure\:90\:dark, html.var.auto .sf-c-azure\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-azure\:100\:dark, html.var.auto .sf-c-azure\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure, html.auto .sf-c-txt-azure { color: hsl(180, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:0, html.auto .sf-c-txt-azure\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:10, html.auto .sf-c-txt-azure\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:20, html.auto .sf-c-txt-azure\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:30, html.auto .sf-c-txt-azure\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:40, html.auto .sf-c-txt-azure\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:50, html.auto .sf-c-txt-azure\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:60, html.auto .sf-c-txt-azure\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:70, html.auto .sf-c-txt-azure\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:80, html.auto .sf-c-txt-azure\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:90, html.auto .sf-c-txt-azure\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:100, html.auto .sf-c-txt-azure\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-azure, html.var.auto .sf-c-txt-azure { color: hsl(180, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:0, html.var.auto .sf-c-txt-azure\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:10, html.var.auto .sf-c-txt-azure\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:20, html.var.auto .sf-c-txt-azure\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:30, html.var.auto .sf-c-txt-azure\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:40, html.var.auto .sf-c-txt-azure\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:50, html.var.auto .sf-c-txt-azure\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:60, html.var.auto .sf-c-txt-azure\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:70, html.var.auto .sf-c-txt-azure\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:80, html.var.auto .sf-c-txt-azure\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:90, html.var.auto .sf-c-txt-azure\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:100, html.var.auto .sf-c-txt-azure\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:dark, html.auto .sf-c-txt-azure\:dark { color: hsl(180, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:0\:dark, html.auto .sf-c-txt-azure\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:10\:dark, html.auto .sf-c-txt-azure\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:20\:dark, html.auto .sf-c-txt-azure\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:30\:dark, html.auto .sf-c-txt-azure\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:40\:dark, html.auto .sf-c-txt-azure\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:50\:dark, html.auto .sf-c-txt-azure\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:60\:dark, html.auto .sf-c-txt-azure\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:70\:dark, html.auto .sf-c-txt-azure\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:80\:dark, html.auto .sf-c-txt-azure\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:90\:dark, html.auto .sf-c-txt-azure\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:100\:dark, html.auto .sf-c-txt-azure\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:dark, html.var.auto .sf-c-txt-azure\:dark { color: hsl(180, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:0\:dark, html.var.auto .sf-c-txt-azure\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:10\:dark, html.var.auto .sf-c-txt-azure\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:20\:dark, html.var.auto .sf-c-txt-azure\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:30\:dark, html.var.auto .sf-c-txt-azure\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:40\:dark, html.var.auto .sf-c-txt-azure\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:50\:dark, html.var.auto .sf-c-txt-azure\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:60\:dark, html.var.auto .sf-c-txt-azure\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:70\:dark, html.var.auto .sf-c-txt-azure\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:80\:dark, html.var.auto .sf-c-txt-azure\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:90\:dark, html.var.auto .sf-c-txt-azure\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:100\:dark, html.var.auto .sf-c-txt-azure\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/beige.css b/src/colors/10/beige.css index 816c828..2990082 100644 --- a/src/colors/10/beige.css +++ b/src/colors/10/beige.css @@ -1,4 +1,4 @@ -:root { +[class*='beige'] { --sf-c-beige: 60 56% 91%; --sf-c-beige-0: 60 56% 0%; --sf-c-beige-10: 60 56% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-beige\:100\:dark, html.dark .sf-c-txt-beig html.var[data-theme='auto'] .sf-c-beige\:90\:dark, html.var.auto .sf-c-beige\:90\:dark { color: hsl(60, 56%, 90%); background: hsl(60, 56%, 10%) } html.var[data-theme='auto'] .sf-c-beige\:100\:dark, html.var.auto .sf-c-beige\:100\:dark { color: hsl(60, 56%, 90%); background: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige, html.auto .sf-c-txt-beige { color: hsl(60, 56%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:0, html.auto .sf-c-txt-beige\:0 { color: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:10, html.auto .sf-c-txt-beige\:10 { color: hsl(60, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:20, html.auto .sf-c-txt-beige\:20 { color: hsl(60, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:30, html.auto .sf-c-txt-beige\:30 { color: hsl(60, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:40, html.auto .sf-c-txt-beige\:40 { color: hsl(60, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:50, html.auto .sf-c-txt-beige\:50 { color: hsl(60, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:60, html.auto .sf-c-txt-beige\:60 { color: hsl(60, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:70, html.auto .sf-c-txt-beige\:70 { color: hsl(60, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:80, html.auto .sf-c-txt-beige\:80 { color: hsl(60, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:90, html.auto .sf-c-txt-beige\:90 { color: hsl(60, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:100, html.auto .sf-c-txt-beige\:100 { color: hsl(60, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-beige, html.var.auto .sf-c-txt-beige { color: hsl(60, 56%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:0, html.var.auto .sf-c-txt-beige\:0 { color: hsl(60, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:10, html.var.auto .sf-c-txt-beige\:10 { color: hsl(60, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:20, html.var.auto .sf-c-txt-beige\:20 { color: hsl(60, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:30, html.var.auto .sf-c-txt-beige\:30 { color: hsl(60, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:40, html.var.auto .sf-c-txt-beige\:40 { color: hsl(60, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:50, html.var.auto .sf-c-txt-beige\:50 { color: hsl(60, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:60, html.var.auto .sf-c-txt-beige\:60 { color: hsl(60, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:70, html.var.auto .sf-c-txt-beige\:70 { color: hsl(60, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:80, html.var.auto .sf-c-txt-beige\:80 { color: hsl(60, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:90, html.var.auto .sf-c-txt-beige\:90 { color: hsl(60, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:100, html.var.auto .sf-c-txt-beige\:100 { color: hsl(60, 56%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:dark, html.auto .sf-c-txt-beige\:dark { color: hsl(60, 56%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:0\:dark, html.auto .sf-c-txt-beige\:0\:dark { color: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:10\:dark, html.auto .sf-c-txt-beige\:10\:dark { color: hsl(60, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:20\:dark, html.auto .sf-c-txt-beige\:20\:dark { color: hsl(60, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:30\:dark, html.auto .sf-c-txt-beige\:30\:dark { color: hsl(60, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:40\:dark, html.auto .sf-c-txt-beige\:40\:dark { color: hsl(60, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:50\:dark, html.auto .sf-c-txt-beige\:50\:dark { color: hsl(60, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:60\:dark, html.auto .sf-c-txt-beige\:60\:dark { color: hsl(60, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:70\:dark, html.auto .sf-c-txt-beige\:70\:dark { color: hsl(60, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:80\:dark, html.auto .sf-c-txt-beige\:80\:dark { color: hsl(60, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:90\:dark, html.auto .sf-c-txt-beige\:90\:dark { color: hsl(60, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:100\:dark, html.auto .sf-c-txt-beige\:100\:dark { color: hsl(60, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:dark, html.var.auto .sf-c-txt-beige\:dark { color: hsl(60, 56%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:0\:dark, html.var.auto .sf-c-txt-beige\:0\:dark { color: hsl(60, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:10\:dark, html.var.auto .sf-c-txt-beige\:10\:dark { color: hsl(60, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:20\:dark, html.var.auto .sf-c-txt-beige\:20\:dark { color: hsl(60, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:30\:dark, html.var.auto .sf-c-txt-beige\:30\:dark { color: hsl(60, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:40\:dark, html.var.auto .sf-c-txt-beige\:40\:dark { color: hsl(60, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:50\:dark, html.var.auto .sf-c-txt-beige\:50\:dark { color: hsl(60, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:60\:dark, html.var.auto .sf-c-txt-beige\:60\:dark { color: hsl(60, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:70\:dark, html.var.auto .sf-c-txt-beige\:70\:dark { color: hsl(60, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:80\:dark, html.var.auto .sf-c-txt-beige\:80\:dark { color: hsl(60, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:90\:dark, html.var.auto .sf-c-txt-beige\:90\:dark { color: hsl(60, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:100\:dark, html.var.auto .sf-c-txt-beige\:100\:dark { color: hsl(60, 56%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/bisque.css b/src/colors/10/bisque.css index 4ef31e3..f0be0a4 100644 --- a/src/colors/10/bisque.css +++ b/src/colors/10/bisque.css @@ -1,4 +1,4 @@ -:root { +[class*='bisque'] { --sf-c-bisque: 33 100% 88%; --sf-c-bisque-0: 33 100% 0%; --sf-c-bisque-10: 33 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-bisque\:100\:dark, html.dark .sf-c-txt-bis html.var[data-theme='auto'] .sf-c-bisque\:90\:dark, html.var.auto .sf-c-bisque\:90\:dark { color: hsl(33, 100%, 90%); background: hsl(33, 100%, 10%) } html.var[data-theme='auto'] .sf-c-bisque\:100\:dark, html.var.auto .sf-c-bisque\:100\:dark { color: hsl(33, 100%, 90%); background: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque, html.auto .sf-c-txt-bisque { color: hsl(33, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:0, html.auto .sf-c-txt-bisque\:0 { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:10, html.auto .sf-c-txt-bisque\:10 { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:20, html.auto .sf-c-txt-bisque\:20 { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:30, html.auto .sf-c-txt-bisque\:30 { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:40, html.auto .sf-c-txt-bisque\:40 { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:50, html.auto .sf-c-txt-bisque\:50 { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:60, html.auto .sf-c-txt-bisque\:60 { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:70, html.auto .sf-c-txt-bisque\:70 { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:80, html.auto .sf-c-txt-bisque\:80 { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:90, html.auto .sf-c-txt-bisque\:90 { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:100, html.auto .sf-c-txt-bisque\:100 { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-bisque, html.var.auto .sf-c-txt-bisque { color: hsl(33, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:0, html.var.auto .sf-c-txt-bisque\:0 { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:10, html.var.auto .sf-c-txt-bisque\:10 { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:20, html.var.auto .sf-c-txt-bisque\:20 { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:30, html.var.auto .sf-c-txt-bisque\:30 { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:40, html.var.auto .sf-c-txt-bisque\:40 { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:50, html.var.auto .sf-c-txt-bisque\:50 { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:60, html.var.auto .sf-c-txt-bisque\:60 { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:70, html.var.auto .sf-c-txt-bisque\:70 { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:80, html.var.auto .sf-c-txt-bisque\:80 { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:90, html.var.auto .sf-c-txt-bisque\:90 { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:100, html.var.auto .sf-c-txt-bisque\:100 { color: hsl(33, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:dark, html.auto .sf-c-txt-bisque\:dark { color: hsl(33, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:0\:dark, html.auto .sf-c-txt-bisque\:0\:dark { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:10\:dark, html.auto .sf-c-txt-bisque\:10\:dark { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:20\:dark, html.auto .sf-c-txt-bisque\:20\:dark { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:30\:dark, html.auto .sf-c-txt-bisque\:30\:dark { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:40\:dark, html.auto .sf-c-txt-bisque\:40\:dark { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:50\:dark, html.auto .sf-c-txt-bisque\:50\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:60\:dark, html.auto .sf-c-txt-bisque\:60\:dark { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:70\:dark, html.auto .sf-c-txt-bisque\:70\:dark { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:80\:dark, html.auto .sf-c-txt-bisque\:80\:dark { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:90\:dark, html.auto .sf-c-txt-bisque\:90\:dark { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:100\:dark, html.auto .sf-c-txt-bisque\:100\:dark { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:dark, html.var.auto .sf-c-txt-bisque\:dark { color: hsl(33, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:0\:dark, html.var.auto .sf-c-txt-bisque\:0\:dark { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:10\:dark, html.var.auto .sf-c-txt-bisque\:10\:dark { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:20\:dark, html.var.auto .sf-c-txt-bisque\:20\:dark { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:30\:dark, html.var.auto .sf-c-txt-bisque\:30\:dark { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:40\:dark, html.var.auto .sf-c-txt-bisque\:40\:dark { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:50\:dark, html.var.auto .sf-c-txt-bisque\:50\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:60\:dark, html.var.auto .sf-c-txt-bisque\:60\:dark { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:70\:dark, html.var.auto .sf-c-txt-bisque\:70\:dark { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:80\:dark, html.var.auto .sf-c-txt-bisque\:80\:dark { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:90\:dark, html.var.auto .sf-c-txt-bisque\:90\:dark { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:100\:dark, html.var.auto .sf-c-txt-bisque\:100\:dark { color: hsl(33, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/black.css b/src/colors/10/black.css index 11fedf6..3a0e6c5 100644 --- a/src/colors/10/black.css +++ b/src/colors/10/black.css @@ -1,4 +1,4 @@ -:root { +[class*='black'] { --sf-c-black: 0 0% 0%; --sf-c-black-0: 0 0% 0%; --sf-c-black-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark, html.dark .sf-c-txt-blac html.var[data-theme='auto'] .sf-c-black\:90\:dark, html.var.auto .sf-c-black\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-black\:100\:dark, html.var.auto .sf-c-black\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black, html.auto .sf-c-txt-black { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:0, html.auto .sf-c-txt-black\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:10, html.auto .sf-c-txt-black\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-black\:20, html.auto .sf-c-txt-black\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-black\:30, html.auto .sf-c-txt-black\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-black\:40, html.auto .sf-c-txt-black\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-black\:50, html.auto .sf-c-txt-black\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-black\:60, html.auto .sf-c-txt-black\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-black\:70, html.auto .sf-c-txt-black\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-black\:80, html.auto .sf-c-txt-black\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-black\:90, html.auto .sf-c-txt-black\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-black\:100, html.auto .sf-c-txt-black\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-black, html.var.auto .sf-c-txt-black { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:0, html.var.auto .sf-c-txt-black\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:10, html.var.auto .sf-c-txt-black\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-black\:20, html.var.auto .sf-c-txt-black\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-black\:30, html.var.auto .sf-c-txt-black\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-black\:40, html.var.auto .sf-c-txt-black\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-black\:50, html.var.auto .sf-c-txt-black\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-black\:60, html.var.auto .sf-c-txt-black\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-black\:70, html.var.auto .sf-c-txt-black\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-black\:80, html.var.auto .sf-c-txt-black\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-black\:90, html.var.auto .sf-c-txt-black\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-black\:100, html.var.auto .sf-c-txt-black\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-black\:dark, html.auto .sf-c-txt-black\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark, html.auto .sf-c-txt-black\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark, html.auto .sf-c-txt-black\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark, html.auto .sf-c-txt-black\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark, html.auto .sf-c-txt-black\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark, html.auto .sf-c-txt-black\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark, html.auto .sf-c-txt-black\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark, html.auto .sf-c-txt-black\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark, html.auto .sf-c-txt-black\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark, html.auto .sf-c-txt-black\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark, html.auto .sf-c-txt-black\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark, html.auto .sf-c-txt-black\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-black\:dark, html.var.auto .sf-c-txt-black\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark, html.var.auto .sf-c-txt-black\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark, html.var.auto .sf-c-txt-black\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark, html.var.auto .sf-c-txt-black\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark, html.var.auto .sf-c-txt-black\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark, html.var.auto .sf-c-txt-black\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark, html.var.auto .sf-c-txt-black\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark, html.var.auto .sf-c-txt-black\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark, html.var.auto .sf-c-txt-black\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark, html.var.auto .sf-c-txt-black\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark, html.var.auto .sf-c-txt-black\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark, html.var.auto .sf-c-txt-black\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/blanchedalmond.css b/src/colors/10/blanchedalmond.css index e308c8e..0f75538 100644 --- a/src/colors/10/blanchedalmond.css +++ b/src/colors/10/blanchedalmond.css @@ -1,4 +1,4 @@ -:root { +[class*='blanchedalmond'] { --sf-c-blanchedalmond: 36 100% 90%; --sf-c-blanchedalmond-0: 36 100% 0%; --sf-c-blanchedalmond-10: 36 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-blanchedalmond\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-blanchedalmond\:90\:dark, html.var.auto .sf-c-blanchedalmond\:90\:dark { color: hsl(36, 100%, 90%); background: hsl(36, 100%, 10%) } html.var[data-theme='auto'] .sf-c-blanchedalmond\:100\:dark, html.var.auto .sf-c-blanchedalmond\:100\:dark { color: hsl(36, 100%, 90%); background: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond, html.auto .sf-c-txt-blanchedalmond { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0, html.auto .sf-c-txt-blanchedalmond\:0 { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10, html.auto .sf-c-txt-blanchedalmond\:10 { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20, html.auto .sf-c-txt-blanchedalmond\:20 { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30, html.auto .sf-c-txt-blanchedalmond\:30 { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40, html.auto .sf-c-txt-blanchedalmond\:40 { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50, html.auto .sf-c-txt-blanchedalmond\:50 { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60, html.auto .sf-c-txt-blanchedalmond\:60 { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70, html.auto .sf-c-txt-blanchedalmond\:70 { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80, html.auto .sf-c-txt-blanchedalmond\:80 { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90, html.auto .sf-c-txt-blanchedalmond\:90 { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100, html.auto .sf-c-txt-blanchedalmond\:100 { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond, html.var.auto .sf-c-txt-blanchedalmond { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0, html.var.auto .sf-c-txt-blanchedalmond\:0 { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10, html.var.auto .sf-c-txt-blanchedalmond\:10 { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20, html.var.auto .sf-c-txt-blanchedalmond\:20 { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30, html.var.auto .sf-c-txt-blanchedalmond\:30 { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40, html.var.auto .sf-c-txt-blanchedalmond\:40 { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50, html.var.auto .sf-c-txt-blanchedalmond\:50 { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60, html.var.auto .sf-c-txt-blanchedalmond\:60 { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70, html.var.auto .sf-c-txt-blanchedalmond\:70 { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80, html.var.auto .sf-c-txt-blanchedalmond\:80 { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90, html.var.auto .sf-c-txt-blanchedalmond\:90 { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100, html.var.auto .sf-c-txt-blanchedalmond\:100 { color: hsl(36, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:dark, html.auto .sf-c-txt-blanchedalmond\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0\:dark, html.auto .sf-c-txt-blanchedalmond\:0\:dark { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10\:dark, html.auto .sf-c-txt-blanchedalmond\:10\:dark { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20\:dark, html.auto .sf-c-txt-blanchedalmond\:20\:dark { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30\:dark, html.auto .sf-c-txt-blanchedalmond\:30\:dark { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40\:dark, html.auto .sf-c-txt-blanchedalmond\:40\:dark { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50\:dark, html.auto .sf-c-txt-blanchedalmond\:50\:dark { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60\:dark, html.auto .sf-c-txt-blanchedalmond\:60\:dark { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70\:dark, html.auto .sf-c-txt-blanchedalmond\:70\:dark { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80\:dark, html.auto .sf-c-txt-blanchedalmond\:80\:dark { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90\:dark, html.auto .sf-c-txt-blanchedalmond\:90\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100\:dark, html.auto .sf-c-txt-blanchedalmond\:100\:dark { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:dark, html.var.auto .sf-c-txt-blanchedalmond\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0\:dark, html.var.auto .sf-c-txt-blanchedalmond\:0\:dark { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10\:dark, html.var.auto .sf-c-txt-blanchedalmond\:10\:dark { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20\:dark, html.var.auto .sf-c-txt-blanchedalmond\:20\:dark { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30\:dark, html.var.auto .sf-c-txt-blanchedalmond\:30\:dark { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40\:dark, html.var.auto .sf-c-txt-blanchedalmond\:40\:dark { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50\:dark, html.var.auto .sf-c-txt-blanchedalmond\:50\:dark { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60\:dark, html.var.auto .sf-c-txt-blanchedalmond\:60\:dark { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70\:dark, html.var.auto .sf-c-txt-blanchedalmond\:70\:dark { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80\:dark, html.var.auto .sf-c-txt-blanchedalmond\:80\:dark { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90\:dark, html.var.auto .sf-c-txt-blanchedalmond\:90\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100\:dark, html.var.auto .sf-c-txt-blanchedalmond\:100\:dark { color: hsl(36, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/blue.css b/src/colors/10/blue.css index 3356dc6..215b504 100644 --- a/src/colors/10/blue.css +++ b/src/colors/10/blue.css @@ -1,4 +1,4 @@ -:root { +[class*='blue'] { --sf-c-blue: 240 100% 50%; --sf-c-blue-0: 240 100% 0%; --sf-c-blue-10: 240 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark, html.dark .sf-c-txt-blue\ html.var[data-theme='auto'] .sf-c-blue\:90\:dark, html.var.auto .sf-c-blue\:90\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 10%) } html.var[data-theme='auto'] .sf-c-blue\:100\:dark, html.var.auto .sf-c-blue\:100\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue, html.auto .sf-c-txt-blue { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:0, html.auto .sf-c-txt-blue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:10, html.auto .sf-c-txt-blue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:20, html.auto .sf-c-txt-blue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:30, html.auto .sf-c-txt-blue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:40, html.auto .sf-c-txt-blue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:50, html.auto .sf-c-txt-blue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:60, html.auto .sf-c-txt-blue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:70, html.auto .sf-c-txt-blue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:80, html.auto .sf-c-txt-blue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:90, html.auto .sf-c-txt-blue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:100, html.auto .sf-c-txt-blue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blue, html.var.auto .sf-c-txt-blue { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:0, html.var.auto .sf-c-txt-blue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:10, html.var.auto .sf-c-txt-blue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:20, html.var.auto .sf-c-txt-blue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:30, html.var.auto .sf-c-txt-blue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:40, html.var.auto .sf-c-txt-blue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:50, html.var.auto .sf-c-txt-blue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:60, html.var.auto .sf-c-txt-blue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:70, html.var.auto .sf-c-txt-blue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:80, html.var.auto .sf-c-txt-blue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:90, html.var.auto .sf-c-txt-blue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:100, html.var.auto .sf-c-txt-blue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:dark, html.auto .sf-c-txt-blue\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark, html.auto .sf-c-txt-blue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark, html.auto .sf-c-txt-blue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark, html.auto .sf-c-txt-blue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark, html.auto .sf-c-txt-blue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark, html.auto .sf-c-txt-blue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark, html.auto .sf-c-txt-blue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark, html.auto .sf-c-txt-blue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark, html.auto .sf-c-txt-blue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark, html.auto .sf-c-txt-blue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark, html.auto .sf-c-txt-blue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark, html.auto .sf-c-txt-blue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:dark, html.var.auto .sf-c-txt-blue\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark, html.var.auto .sf-c-txt-blue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark, html.var.auto .sf-c-txt-blue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark, html.var.auto .sf-c-txt-blue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark, html.var.auto .sf-c-txt-blue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark, html.var.auto .sf-c-txt-blue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark, html.var.auto .sf-c-txt-blue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark, html.var.auto .sf-c-txt-blue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark, html.var.auto .sf-c-txt-blue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark, html.var.auto .sf-c-txt-blue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark, html.var.auto .sf-c-txt-blue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark, html.var.auto .sf-c-txt-blue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/blueviolet.css b/src/colors/10/blueviolet.css index 6da4dea..a0f699d 100644 --- a/src/colors/10/blueviolet.css +++ b/src/colors/10/blueviolet.css @@ -1,4 +1,4 @@ -:root { +[class*='blueviolet'] { --sf-c-blueviolet: 271 76% 53%; --sf-c-blueviolet-0: 271 76% 0%; --sf-c-blueviolet-10: 271 76% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-blueviolet\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-blueviolet\:90\:dark, html.var.auto .sf-c-blueviolet\:90\:dark { color: hsl(271, 76%, 90%); background: hsl(271, 76%, 10%) } html.var[data-theme='auto'] .sf-c-blueviolet\:100\:dark, html.var.auto .sf-c-blueviolet\:100\:dark { color: hsl(271, 76%, 90%); background: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet, html.auto .sf-c-txt-blueviolet { color: hsl(271, 76%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0, html.auto .sf-c-txt-blueviolet\:0 { color: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10, html.auto .sf-c-txt-blueviolet\:10 { color: hsl(271, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20, html.auto .sf-c-txt-blueviolet\:20 { color: hsl(271, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30, html.auto .sf-c-txt-blueviolet\:30 { color: hsl(271, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40, html.auto .sf-c-txt-blueviolet\:40 { color: hsl(271, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50, html.auto .sf-c-txt-blueviolet\:50 { color: hsl(271, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60, html.auto .sf-c-txt-blueviolet\:60 { color: hsl(271, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70, html.auto .sf-c-txt-blueviolet\:70 { color: hsl(271, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80, html.auto .sf-c-txt-blueviolet\:80 { color: hsl(271, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90, html.auto .sf-c-txt-blueviolet\:90 { color: hsl(271, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100, html.auto .sf-c-txt-blueviolet\:100 { color: hsl(271, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet, html.var.auto .sf-c-txt-blueviolet { color: hsl(271, 76%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0, html.var.auto .sf-c-txt-blueviolet\:0 { color: hsl(271, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10, html.var.auto .sf-c-txt-blueviolet\:10 { color: hsl(271, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20, html.var.auto .sf-c-txt-blueviolet\:20 { color: hsl(271, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30, html.var.auto .sf-c-txt-blueviolet\:30 { color: hsl(271, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40, html.var.auto .sf-c-txt-blueviolet\:40 { color: hsl(271, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50, html.var.auto .sf-c-txt-blueviolet\:50 { color: hsl(271, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60, html.var.auto .sf-c-txt-blueviolet\:60 { color: hsl(271, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70, html.var.auto .sf-c-txt-blueviolet\:70 { color: hsl(271, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80, html.var.auto .sf-c-txt-blueviolet\:80 { color: hsl(271, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90, html.var.auto .sf-c-txt-blueviolet\:90 { color: hsl(271, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100, html.var.auto .sf-c-txt-blueviolet\:100 { color: hsl(271, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:dark, html.auto .sf-c-txt-blueviolet\:dark { color: hsl(271, 76%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0\:dark, html.auto .sf-c-txt-blueviolet\:0\:dark { color: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10\:dark, html.auto .sf-c-txt-blueviolet\:10\:dark { color: hsl(271, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20\:dark, html.auto .sf-c-txt-blueviolet\:20\:dark { color: hsl(271, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30\:dark, html.auto .sf-c-txt-blueviolet\:30\:dark { color: hsl(271, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40\:dark, html.auto .sf-c-txt-blueviolet\:40\:dark { color: hsl(271, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50\:dark, html.auto .sf-c-txt-blueviolet\:50\:dark { color: hsl(271, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60\:dark, html.auto .sf-c-txt-blueviolet\:60\:dark { color: hsl(271, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70\:dark, html.auto .sf-c-txt-blueviolet\:70\:dark { color: hsl(271, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80\:dark, html.auto .sf-c-txt-blueviolet\:80\:dark { color: hsl(271, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90\:dark, html.auto .sf-c-txt-blueviolet\:90\:dark { color: hsl(271, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100\:dark, html.auto .sf-c-txt-blueviolet\:100\:dark { color: hsl(271, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:dark, html.var.auto .sf-c-txt-blueviolet\:dark { color: hsl(271, 76%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0\:dark, html.var.auto .sf-c-txt-blueviolet\:0\:dark { color: hsl(271, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10\:dark, html.var.auto .sf-c-txt-blueviolet\:10\:dark { color: hsl(271, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20\:dark, html.var.auto .sf-c-txt-blueviolet\:20\:dark { color: hsl(271, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30\:dark, html.var.auto .sf-c-txt-blueviolet\:30\:dark { color: hsl(271, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40\:dark, html.var.auto .sf-c-txt-blueviolet\:40\:dark { color: hsl(271, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50\:dark, html.var.auto .sf-c-txt-blueviolet\:50\:dark { color: hsl(271, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60\:dark, html.var.auto .sf-c-txt-blueviolet\:60\:dark { color: hsl(271, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70\:dark, html.var.auto .sf-c-txt-blueviolet\:70\:dark { color: hsl(271, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80\:dark, html.var.auto .sf-c-txt-blueviolet\:80\:dark { color: hsl(271, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90\:dark, html.var.auto .sf-c-txt-blueviolet\:90\:dark { color: hsl(271, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100\:dark, html.var.auto .sf-c-txt-blueviolet\:100\:dark { color: hsl(271, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/brown.css b/src/colors/10/brown.css index 68d7ca2..dc5da02 100644 --- a/src/colors/10/brown.css +++ b/src/colors/10/brown.css @@ -1,4 +1,4 @@ -:root { +[class*='brown'] { --sf-c-brown: 0 59% 41%; --sf-c-brown-0: 0 59% 0%; --sf-c-brown-10: 0 59% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-brown\:100\:dark, html.dark .sf-c-txt-brow html.var[data-theme='auto'] .sf-c-brown\:90\:dark, html.var.auto .sf-c-brown\:90\:dark { color: hsl(0, 59%, 90%); background: hsl(0, 59%, 10%) } html.var[data-theme='auto'] .sf-c-brown\:100\:dark, html.var.auto .sf-c-brown\:100\:dark { color: hsl(0, 59%, 90%); background: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown, html.auto .sf-c-txt-brown { color: hsl(0, 59%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:0, html.auto .sf-c-txt-brown\:0 { color: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:10, html.auto .sf-c-txt-brown\:10 { color: hsl(0, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:20, html.auto .sf-c-txt-brown\:20 { color: hsl(0, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:30, html.auto .sf-c-txt-brown\:30 { color: hsl(0, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:40, html.auto .sf-c-txt-brown\:40 { color: hsl(0, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:50, html.auto .sf-c-txt-brown\:50 { color: hsl(0, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:60, html.auto .sf-c-txt-brown\:60 { color: hsl(0, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:70, html.auto .sf-c-txt-brown\:70 { color: hsl(0, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:80, html.auto .sf-c-txt-brown\:80 { color: hsl(0, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:90, html.auto .sf-c-txt-brown\:90 { color: hsl(0, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:100, html.auto .sf-c-txt-brown\:100 { color: hsl(0, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-brown, html.var.auto .sf-c-txt-brown { color: hsl(0, 59%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:0, html.var.auto .sf-c-txt-brown\:0 { color: hsl(0, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:10, html.var.auto .sf-c-txt-brown\:10 { color: hsl(0, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:20, html.var.auto .sf-c-txt-brown\:20 { color: hsl(0, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:30, html.var.auto .sf-c-txt-brown\:30 { color: hsl(0, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:40, html.var.auto .sf-c-txt-brown\:40 { color: hsl(0, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:50, html.var.auto .sf-c-txt-brown\:50 { color: hsl(0, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:60, html.var.auto .sf-c-txt-brown\:60 { color: hsl(0, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:70, html.var.auto .sf-c-txt-brown\:70 { color: hsl(0, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:80, html.var.auto .sf-c-txt-brown\:80 { color: hsl(0, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:90, html.var.auto .sf-c-txt-brown\:90 { color: hsl(0, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:100, html.var.auto .sf-c-txt-brown\:100 { color: hsl(0, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:dark, html.auto .sf-c-txt-brown\:dark { color: hsl(0, 59%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:0\:dark, html.auto .sf-c-txt-brown\:0\:dark { color: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:10\:dark, html.auto .sf-c-txt-brown\:10\:dark { color: hsl(0, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:20\:dark, html.auto .sf-c-txt-brown\:20\:dark { color: hsl(0, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:30\:dark, html.auto .sf-c-txt-brown\:30\:dark { color: hsl(0, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:40\:dark, html.auto .sf-c-txt-brown\:40\:dark { color: hsl(0, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:50\:dark, html.auto .sf-c-txt-brown\:50\:dark { color: hsl(0, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:60\:dark, html.auto .sf-c-txt-brown\:60\:dark { color: hsl(0, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:70\:dark, html.auto .sf-c-txt-brown\:70\:dark { color: hsl(0, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:80\:dark, html.auto .sf-c-txt-brown\:80\:dark { color: hsl(0, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:90\:dark, html.auto .sf-c-txt-brown\:90\:dark { color: hsl(0, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:100\:dark, html.auto .sf-c-txt-brown\:100\:dark { color: hsl(0, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:dark, html.var.auto .sf-c-txt-brown\:dark { color: hsl(0, 59%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:0\:dark, html.var.auto .sf-c-txt-brown\:0\:dark { color: hsl(0, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:10\:dark, html.var.auto .sf-c-txt-brown\:10\:dark { color: hsl(0, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:20\:dark, html.var.auto .sf-c-txt-brown\:20\:dark { color: hsl(0, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:30\:dark, html.var.auto .sf-c-txt-brown\:30\:dark { color: hsl(0, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:40\:dark, html.var.auto .sf-c-txt-brown\:40\:dark { color: hsl(0, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:50\:dark, html.var.auto .sf-c-txt-brown\:50\:dark { color: hsl(0, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:60\:dark, html.var.auto .sf-c-txt-brown\:60\:dark { color: hsl(0, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:70\:dark, html.var.auto .sf-c-txt-brown\:70\:dark { color: hsl(0, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:80\:dark, html.var.auto .sf-c-txt-brown\:80\:dark { color: hsl(0, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:90\:dark, html.var.auto .sf-c-txt-brown\:90\:dark { color: hsl(0, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:100\:dark, html.var.auto .sf-c-txt-brown\:100\:dark { color: hsl(0, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/burlywood.css b/src/colors/10/burlywood.css index 7cbd7ba..c7e434f 100644 --- a/src/colors/10/burlywood.css +++ b/src/colors/10/burlywood.css @@ -1,4 +1,4 @@ -:root { +[class*='burlywood'] { --sf-c-burlywood: 34 57% 70%; --sf-c-burlywood-0: 34 57% 0%; --sf-c-burlywood-10: 34 57% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-burlywood\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-burlywood\:90\:dark, html.var.auto .sf-c-burlywood\:90\:dark { color: hsl(34, 57%, 90%); background: hsl(34, 57%, 10%) } html.var[data-theme='auto'] .sf-c-burlywood\:100\:dark, html.var.auto .sf-c-burlywood\:100\:dark { color: hsl(34, 57%, 90%); background: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood, html.auto .sf-c-txt-burlywood { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:0, html.auto .sf-c-txt-burlywood\:0 { color: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:10, html.auto .sf-c-txt-burlywood\:10 { color: hsl(34, 57%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:20, html.auto .sf-c-txt-burlywood\:20 { color: hsl(34, 57%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:30, html.auto .sf-c-txt-burlywood\:30 { color: hsl(34, 57%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:40, html.auto .sf-c-txt-burlywood\:40 { color: hsl(34, 57%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:50, html.auto .sf-c-txt-burlywood\:50 { color: hsl(34, 57%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:60, html.auto .sf-c-txt-burlywood\:60 { color: hsl(34, 57%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:70, html.auto .sf-c-txt-burlywood\:70 { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:80, html.auto .sf-c-txt-burlywood\:80 { color: hsl(34, 57%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:90, html.auto .sf-c-txt-burlywood\:90 { color: hsl(34, 57%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:100, html.auto .sf-c-txt-burlywood\:100 { color: hsl(34, 57%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood, html.var.auto .sf-c-txt-burlywood { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:0, html.var.auto .sf-c-txt-burlywood\:0 { color: hsl(34, 57%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:10, html.var.auto .sf-c-txt-burlywood\:10 { color: hsl(34, 57%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:20, html.var.auto .sf-c-txt-burlywood\:20 { color: hsl(34, 57%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:30, html.var.auto .sf-c-txt-burlywood\:30 { color: hsl(34, 57%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:40, html.var.auto .sf-c-txt-burlywood\:40 { color: hsl(34, 57%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:50, html.var.auto .sf-c-txt-burlywood\:50 { color: hsl(34, 57%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:60, html.var.auto .sf-c-txt-burlywood\:60 { color: hsl(34, 57%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:70, html.var.auto .sf-c-txt-burlywood\:70 { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:80, html.var.auto .sf-c-txt-burlywood\:80 { color: hsl(34, 57%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:90, html.var.auto .sf-c-txt-burlywood\:90 { color: hsl(34, 57%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:100, html.var.auto .sf-c-txt-burlywood\:100 { color: hsl(34, 57%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:dark, html.auto .sf-c-txt-burlywood\:dark { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:0\:dark, html.auto .sf-c-txt-burlywood\:0\:dark { color: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:10\:dark, html.auto .sf-c-txt-burlywood\:10\:dark { color: hsl(34, 57%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:20\:dark, html.auto .sf-c-txt-burlywood\:20\:dark { color: hsl(34, 57%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:30\:dark, html.auto .sf-c-txt-burlywood\:30\:dark { color: hsl(34, 57%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:40\:dark, html.auto .sf-c-txt-burlywood\:40\:dark { color: hsl(34, 57%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:50\:dark, html.auto .sf-c-txt-burlywood\:50\:dark { color: hsl(34, 57%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:60\:dark, html.auto .sf-c-txt-burlywood\:60\:dark { color: hsl(34, 57%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:70\:dark, html.auto .sf-c-txt-burlywood\:70\:dark { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:80\:dark, html.auto .sf-c-txt-burlywood\:80\:dark { color: hsl(34, 57%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:90\:dark, html.auto .sf-c-txt-burlywood\:90\:dark { color: hsl(34, 57%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:100\:dark, html.auto .sf-c-txt-burlywood\:100\:dark { color: hsl(34, 57%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:dark, html.var.auto .sf-c-txt-burlywood\:dark { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:0\:dark, html.var.auto .sf-c-txt-burlywood\:0\:dark { color: hsl(34, 57%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:10\:dark, html.var.auto .sf-c-txt-burlywood\:10\:dark { color: hsl(34, 57%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:20\:dark, html.var.auto .sf-c-txt-burlywood\:20\:dark { color: hsl(34, 57%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:30\:dark, html.var.auto .sf-c-txt-burlywood\:30\:dark { color: hsl(34, 57%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:40\:dark, html.var.auto .sf-c-txt-burlywood\:40\:dark { color: hsl(34, 57%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:50\:dark, html.var.auto .sf-c-txt-burlywood\:50\:dark { color: hsl(34, 57%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:60\:dark, html.var.auto .sf-c-txt-burlywood\:60\:dark { color: hsl(34, 57%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:70\:dark, html.var.auto .sf-c-txt-burlywood\:70\:dark { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:80\:dark, html.var.auto .sf-c-txt-burlywood\:80\:dark { color: hsl(34, 57%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:90\:dark, html.var.auto .sf-c-txt-burlywood\:90\:dark { color: hsl(34, 57%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:100\:dark, html.var.auto .sf-c-txt-burlywood\:100\:dark { color: hsl(34, 57%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/cadetblue.css b/src/colors/10/cadetblue.css index 6ec9552..df7851b 100644 --- a/src/colors/10/cadetblue.css +++ b/src/colors/10/cadetblue.css @@ -1,4 +1,4 @@ -:root { +[class*='cadetblue'] { --sf-c-cadetblue: 182 25% 50%; --sf-c-cadetblue-0: 182 25% 0%; --sf-c-cadetblue-10: 182 25% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-cadetblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-cadetblue\:90\:dark, html.var.auto .sf-c-cadetblue\:90\:dark { color: hsl(182, 25%, 90%); background: hsl(182, 25%, 10%) } html.var[data-theme='auto'] .sf-c-cadetblue\:100\:dark, html.var.auto .sf-c-cadetblue\:100\:dark { color: hsl(182, 25%, 90%); background: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue, html.auto .sf-c-txt-cadetblue { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0, html.auto .sf-c-txt-cadetblue\:0 { color: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10, html.auto .sf-c-txt-cadetblue\:10 { color: hsl(182, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20, html.auto .sf-c-txt-cadetblue\:20 { color: hsl(182, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30, html.auto .sf-c-txt-cadetblue\:30 { color: hsl(182, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40, html.auto .sf-c-txt-cadetblue\:40 { color: hsl(182, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50, html.auto .sf-c-txt-cadetblue\:50 { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60, html.auto .sf-c-txt-cadetblue\:60 { color: hsl(182, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70, html.auto .sf-c-txt-cadetblue\:70 { color: hsl(182, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80, html.auto .sf-c-txt-cadetblue\:80 { color: hsl(182, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90, html.auto .sf-c-txt-cadetblue\:90 { color: hsl(182, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100, html.auto .sf-c-txt-cadetblue\:100 { color: hsl(182, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue, html.var.auto .sf-c-txt-cadetblue { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0, html.var.auto .sf-c-txt-cadetblue\:0 { color: hsl(182, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10, html.var.auto .sf-c-txt-cadetblue\:10 { color: hsl(182, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20, html.var.auto .sf-c-txt-cadetblue\:20 { color: hsl(182, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30, html.var.auto .sf-c-txt-cadetblue\:30 { color: hsl(182, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40, html.var.auto .sf-c-txt-cadetblue\:40 { color: hsl(182, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50, html.var.auto .sf-c-txt-cadetblue\:50 { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60, html.var.auto .sf-c-txt-cadetblue\:60 { color: hsl(182, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70, html.var.auto .sf-c-txt-cadetblue\:70 { color: hsl(182, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80, html.var.auto .sf-c-txt-cadetblue\:80 { color: hsl(182, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90, html.var.auto .sf-c-txt-cadetblue\:90 { color: hsl(182, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100, html.var.auto .sf-c-txt-cadetblue\:100 { color: hsl(182, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:dark, html.auto .sf-c-txt-cadetblue\:dark { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0\:dark, html.auto .sf-c-txt-cadetblue\:0\:dark { color: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10\:dark, html.auto .sf-c-txt-cadetblue\:10\:dark { color: hsl(182, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20\:dark, html.auto .sf-c-txt-cadetblue\:20\:dark { color: hsl(182, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30\:dark, html.auto .sf-c-txt-cadetblue\:30\:dark { color: hsl(182, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40\:dark, html.auto .sf-c-txt-cadetblue\:40\:dark { color: hsl(182, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50\:dark, html.auto .sf-c-txt-cadetblue\:50\:dark { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60\:dark, html.auto .sf-c-txt-cadetblue\:60\:dark { color: hsl(182, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70\:dark, html.auto .sf-c-txt-cadetblue\:70\:dark { color: hsl(182, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80\:dark, html.auto .sf-c-txt-cadetblue\:80\:dark { color: hsl(182, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90\:dark, html.auto .sf-c-txt-cadetblue\:90\:dark { color: hsl(182, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100\:dark, html.auto .sf-c-txt-cadetblue\:100\:dark { color: hsl(182, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:dark, html.var.auto .sf-c-txt-cadetblue\:dark { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0\:dark, html.var.auto .sf-c-txt-cadetblue\:0\:dark { color: hsl(182, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10\:dark, html.var.auto .sf-c-txt-cadetblue\:10\:dark { color: hsl(182, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20\:dark, html.var.auto .sf-c-txt-cadetblue\:20\:dark { color: hsl(182, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30\:dark, html.var.auto .sf-c-txt-cadetblue\:30\:dark { color: hsl(182, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40\:dark, html.var.auto .sf-c-txt-cadetblue\:40\:dark { color: hsl(182, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50\:dark, html.var.auto .sf-c-txt-cadetblue\:50\:dark { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60\:dark, html.var.auto .sf-c-txt-cadetblue\:60\:dark { color: hsl(182, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70\:dark, html.var.auto .sf-c-txt-cadetblue\:70\:dark { color: hsl(182, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80\:dark, html.var.auto .sf-c-txt-cadetblue\:80\:dark { color: hsl(182, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90\:dark, html.var.auto .sf-c-txt-cadetblue\:90\:dark { color: hsl(182, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100\:dark, html.var.auto .sf-c-txt-cadetblue\:100\:dark { color: hsl(182, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/chartreuse.css b/src/colors/10/chartreuse.css index b2298e8..ef13cac 100644 --- a/src/colors/10/chartreuse.css +++ b/src/colors/10/chartreuse.css @@ -1,4 +1,4 @@ -:root { +[class*='chartreuse'] { --sf-c-chartreuse: 90 100% 50%; --sf-c-chartreuse-0: 90 100% 0%; --sf-c-chartreuse-10: 90 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-chartreuse\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-chartreuse\:90\:dark, html.var.auto .sf-c-chartreuse\:90\:dark { color: hsl(90, 100%, 90%); background: hsl(90, 100%, 10%) } html.var[data-theme='auto'] .sf-c-chartreuse\:100\:dark, html.var.auto .sf-c-chartreuse\:100\:dark { color: hsl(90, 100%, 90%); background: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse, html.auto .sf-c-txt-chartreuse { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0, html.auto .sf-c-txt-chartreuse\:0 { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10, html.auto .sf-c-txt-chartreuse\:10 { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20, html.auto .sf-c-txt-chartreuse\:20 { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30, html.auto .sf-c-txt-chartreuse\:30 { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40, html.auto .sf-c-txt-chartreuse\:40 { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50, html.auto .sf-c-txt-chartreuse\:50 { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60, html.auto .sf-c-txt-chartreuse\:60 { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70, html.auto .sf-c-txt-chartreuse\:70 { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80, html.auto .sf-c-txt-chartreuse\:80 { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90, html.auto .sf-c-txt-chartreuse\:90 { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100, html.auto .sf-c-txt-chartreuse\:100 { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse, html.var.auto .sf-c-txt-chartreuse { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0, html.var.auto .sf-c-txt-chartreuse\:0 { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10, html.var.auto .sf-c-txt-chartreuse\:10 { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20, html.var.auto .sf-c-txt-chartreuse\:20 { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30, html.var.auto .sf-c-txt-chartreuse\:30 { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40, html.var.auto .sf-c-txt-chartreuse\:40 { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50, html.var.auto .sf-c-txt-chartreuse\:50 { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60, html.var.auto .sf-c-txt-chartreuse\:60 { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70, html.var.auto .sf-c-txt-chartreuse\:70 { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80, html.var.auto .sf-c-txt-chartreuse\:80 { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90, html.var.auto .sf-c-txt-chartreuse\:90 { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100, html.var.auto .sf-c-txt-chartreuse\:100 { color: hsl(90, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:dark, html.auto .sf-c-txt-chartreuse\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0\:dark, html.auto .sf-c-txt-chartreuse\:0\:dark { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10\:dark, html.auto .sf-c-txt-chartreuse\:10\:dark { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20\:dark, html.auto .sf-c-txt-chartreuse\:20\:dark { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30\:dark, html.auto .sf-c-txt-chartreuse\:30\:dark { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40\:dark, html.auto .sf-c-txt-chartreuse\:40\:dark { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50\:dark, html.auto .sf-c-txt-chartreuse\:50\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60\:dark, html.auto .sf-c-txt-chartreuse\:60\:dark { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70\:dark, html.auto .sf-c-txt-chartreuse\:70\:dark { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80\:dark, html.auto .sf-c-txt-chartreuse\:80\:dark { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90\:dark, html.auto .sf-c-txt-chartreuse\:90\:dark { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100\:dark, html.auto .sf-c-txt-chartreuse\:100\:dark { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:dark, html.var.auto .sf-c-txt-chartreuse\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0\:dark, html.var.auto .sf-c-txt-chartreuse\:0\:dark { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10\:dark, html.var.auto .sf-c-txt-chartreuse\:10\:dark { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20\:dark, html.var.auto .sf-c-txt-chartreuse\:20\:dark { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30\:dark, html.var.auto .sf-c-txt-chartreuse\:30\:dark { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40\:dark, html.var.auto .sf-c-txt-chartreuse\:40\:dark { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50\:dark, html.var.auto .sf-c-txt-chartreuse\:50\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60\:dark, html.var.auto .sf-c-txt-chartreuse\:60\:dark { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70\:dark, html.var.auto .sf-c-txt-chartreuse\:70\:dark { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80\:dark, html.var.auto .sf-c-txt-chartreuse\:80\:dark { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90\:dark, html.var.auto .sf-c-txt-chartreuse\:90\:dark { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100\:dark, html.var.auto .sf-c-txt-chartreuse\:100\:dark { color: hsl(90, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/chocolate.css b/src/colors/10/chocolate.css index 79866f0..f42335b 100644 --- a/src/colors/10/chocolate.css +++ b/src/colors/10/chocolate.css @@ -1,4 +1,4 @@ -:root { +[class*='chocolate'] { --sf-c-chocolate: 25 75% 47%; --sf-c-chocolate-0: 25 75% 0%; --sf-c-chocolate-10: 25 75% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-chocolate\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-chocolate\:90\:dark, html.var.auto .sf-c-chocolate\:90\:dark { color: hsl(25, 75%, 90%); background: hsl(25, 75%, 10%) } html.var[data-theme='auto'] .sf-c-chocolate\:100\:dark, html.var.auto .sf-c-chocolate\:100\:dark { color: hsl(25, 75%, 90%); background: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate, html.auto .sf-c-txt-chocolate { color: hsl(25, 75%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:0, html.auto .sf-c-txt-chocolate\:0 { color: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:10, html.auto .sf-c-txt-chocolate\:10 { color: hsl(25, 75%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:20, html.auto .sf-c-txt-chocolate\:20 { color: hsl(25, 75%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:30, html.auto .sf-c-txt-chocolate\:30 { color: hsl(25, 75%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:40, html.auto .sf-c-txt-chocolate\:40 { color: hsl(25, 75%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:50, html.auto .sf-c-txt-chocolate\:50 { color: hsl(25, 75%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:60, html.auto .sf-c-txt-chocolate\:60 { color: hsl(25, 75%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:70, html.auto .sf-c-txt-chocolate\:70 { color: hsl(25, 75%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:80, html.auto .sf-c-txt-chocolate\:80 { color: hsl(25, 75%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:90, html.auto .sf-c-txt-chocolate\:90 { color: hsl(25, 75%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:100, html.auto .sf-c-txt-chocolate\:100 { color: hsl(25, 75%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate, html.var.auto .sf-c-txt-chocolate { color: hsl(25, 75%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:0, html.var.auto .sf-c-txt-chocolate\:0 { color: hsl(25, 75%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:10, html.var.auto .sf-c-txt-chocolate\:10 { color: hsl(25, 75%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:20, html.var.auto .sf-c-txt-chocolate\:20 { color: hsl(25, 75%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:30, html.var.auto .sf-c-txt-chocolate\:30 { color: hsl(25, 75%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:40, html.var.auto .sf-c-txt-chocolate\:40 { color: hsl(25, 75%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:50, html.var.auto .sf-c-txt-chocolate\:50 { color: hsl(25, 75%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:60, html.var.auto .sf-c-txt-chocolate\:60 { color: hsl(25, 75%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:70, html.var.auto .sf-c-txt-chocolate\:70 { color: hsl(25, 75%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:80, html.var.auto .sf-c-txt-chocolate\:80 { color: hsl(25, 75%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:90, html.var.auto .sf-c-txt-chocolate\:90 { color: hsl(25, 75%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:100, html.var.auto .sf-c-txt-chocolate\:100 { color: hsl(25, 75%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:dark, html.auto .sf-c-txt-chocolate\:dark { color: hsl(25, 75%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:0\:dark, html.auto .sf-c-txt-chocolate\:0\:dark { color: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:10\:dark, html.auto .sf-c-txt-chocolate\:10\:dark { color: hsl(25, 75%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:20\:dark, html.auto .sf-c-txt-chocolate\:20\:dark { color: hsl(25, 75%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:30\:dark, html.auto .sf-c-txt-chocolate\:30\:dark { color: hsl(25, 75%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:40\:dark, html.auto .sf-c-txt-chocolate\:40\:dark { color: hsl(25, 75%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:50\:dark, html.auto .sf-c-txt-chocolate\:50\:dark { color: hsl(25, 75%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:60\:dark, html.auto .sf-c-txt-chocolate\:60\:dark { color: hsl(25, 75%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:70\:dark, html.auto .sf-c-txt-chocolate\:70\:dark { color: hsl(25, 75%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:80\:dark, html.auto .sf-c-txt-chocolate\:80\:dark { color: hsl(25, 75%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:90\:dark, html.auto .sf-c-txt-chocolate\:90\:dark { color: hsl(25, 75%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:100\:dark, html.auto .sf-c-txt-chocolate\:100\:dark { color: hsl(25, 75%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:dark, html.var.auto .sf-c-txt-chocolate\:dark { color: hsl(25, 75%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:0\:dark, html.var.auto .sf-c-txt-chocolate\:0\:dark { color: hsl(25, 75%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:10\:dark, html.var.auto .sf-c-txt-chocolate\:10\:dark { color: hsl(25, 75%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:20\:dark, html.var.auto .sf-c-txt-chocolate\:20\:dark { color: hsl(25, 75%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:30\:dark, html.var.auto .sf-c-txt-chocolate\:30\:dark { color: hsl(25, 75%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:40\:dark, html.var.auto .sf-c-txt-chocolate\:40\:dark { color: hsl(25, 75%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:50\:dark, html.var.auto .sf-c-txt-chocolate\:50\:dark { color: hsl(25, 75%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:60\:dark, html.var.auto .sf-c-txt-chocolate\:60\:dark { color: hsl(25, 75%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:70\:dark, html.var.auto .sf-c-txt-chocolate\:70\:dark { color: hsl(25, 75%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:80\:dark, html.var.auto .sf-c-txt-chocolate\:80\:dark { color: hsl(25, 75%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:90\:dark, html.var.auto .sf-c-txt-chocolate\:90\:dark { color: hsl(25, 75%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:100\:dark, html.var.auto .sf-c-txt-chocolate\:100\:dark { color: hsl(25, 75%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/coral.css b/src/colors/10/coral.css index 4f1245b..5cd3840 100644 --- a/src/colors/10/coral.css +++ b/src/colors/10/coral.css @@ -1,4 +1,4 @@ -:root { +[class*='coral'] { --sf-c-coral: 16 100% 66%; --sf-c-coral-0: 16 100% 0%; --sf-c-coral-10: 16 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-coral\:100\:dark, html.dark .sf-c-txt-cora html.var[data-theme='auto'] .sf-c-coral\:90\:dark, html.var.auto .sf-c-coral\:90\:dark { color: hsl(16, 100%, 90%); background: hsl(16, 100%, 10%) } html.var[data-theme='auto'] .sf-c-coral\:100\:dark, html.var.auto .sf-c-coral\:100\:dark { color: hsl(16, 100%, 90%); background: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral, html.auto .sf-c-txt-coral { color: hsl(16, 100%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:0, html.auto .sf-c-txt-coral\:0 { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:10, html.auto .sf-c-txt-coral\:10 { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:20, html.auto .sf-c-txt-coral\:20 { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:30, html.auto .sf-c-txt-coral\:30 { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:40, html.auto .sf-c-txt-coral\:40 { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:50, html.auto .sf-c-txt-coral\:50 { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:60, html.auto .sf-c-txt-coral\:60 { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:70, html.auto .sf-c-txt-coral\:70 { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:80, html.auto .sf-c-txt-coral\:80 { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:90, html.auto .sf-c-txt-coral\:90 { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:100, html.auto .sf-c-txt-coral\:100 { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-coral, html.var.auto .sf-c-txt-coral { color: hsl(16, 100%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:0, html.var.auto .sf-c-txt-coral\:0 { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:10, html.var.auto .sf-c-txt-coral\:10 { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:20, html.var.auto .sf-c-txt-coral\:20 { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:30, html.var.auto .sf-c-txt-coral\:30 { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:40, html.var.auto .sf-c-txt-coral\:40 { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:50, html.var.auto .sf-c-txt-coral\:50 { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:60, html.var.auto .sf-c-txt-coral\:60 { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:70, html.var.auto .sf-c-txt-coral\:70 { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:80, html.var.auto .sf-c-txt-coral\:80 { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:90, html.var.auto .sf-c-txt-coral\:90 { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:100, html.var.auto .sf-c-txt-coral\:100 { color: hsl(16, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:dark, html.auto .sf-c-txt-coral\:dark { color: hsl(16, 100%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:0\:dark, html.auto .sf-c-txt-coral\:0\:dark { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:10\:dark, html.auto .sf-c-txt-coral\:10\:dark { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:20\:dark, html.auto .sf-c-txt-coral\:20\:dark { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:30\:dark, html.auto .sf-c-txt-coral\:30\:dark { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:40\:dark, html.auto .sf-c-txt-coral\:40\:dark { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:50\:dark, html.auto .sf-c-txt-coral\:50\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:60\:dark, html.auto .sf-c-txt-coral\:60\:dark { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:70\:dark, html.auto .sf-c-txt-coral\:70\:dark { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:80\:dark, html.auto .sf-c-txt-coral\:80\:dark { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:90\:dark, html.auto .sf-c-txt-coral\:90\:dark { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:100\:dark, html.auto .sf-c-txt-coral\:100\:dark { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:dark, html.var.auto .sf-c-txt-coral\:dark { color: hsl(16, 100%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:0\:dark, html.var.auto .sf-c-txt-coral\:0\:dark { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:10\:dark, html.var.auto .sf-c-txt-coral\:10\:dark { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:20\:dark, html.var.auto .sf-c-txt-coral\:20\:dark { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:30\:dark, html.var.auto .sf-c-txt-coral\:30\:dark { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:40\:dark, html.var.auto .sf-c-txt-coral\:40\:dark { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:50\:dark, html.var.auto .sf-c-txt-coral\:50\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:60\:dark, html.var.auto .sf-c-txt-coral\:60\:dark { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:70\:dark, html.var.auto .sf-c-txt-coral\:70\:dark { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:80\:dark, html.var.auto .sf-c-txt-coral\:80\:dark { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:90\:dark, html.var.auto .sf-c-txt-coral\:90\:dark { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:100\:dark, html.var.auto .sf-c-txt-coral\:100\:dark { color: hsl(16, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/cornflowerblue.css b/src/colors/10/cornflowerblue.css index b98854f..f016654 100644 --- a/src/colors/10/cornflowerblue.css +++ b/src/colors/10/cornflowerblue.css @@ -1,4 +1,4 @@ -:root { +[class*='cornflowerblue'] { --sf-c-cornflowerblue: 219 79% 66%; --sf-c-cornflowerblue-0: 219 79% 0%; --sf-c-cornflowerblue-10: 219 79% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-cornflowerblue\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-cornflowerblue\:90\:dark, html.var.auto .sf-c-cornflowerblue\:90\:dark { color: hsl(219, 79%, 90%); background: hsl(219, 79%, 10%) } html.var[data-theme='auto'] .sf-c-cornflowerblue\:100\:dark, html.var.auto .sf-c-cornflowerblue\:100\:dark { color: hsl(219, 79%, 90%); background: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue, html.auto .sf-c-txt-cornflowerblue { color: hsl(219, 79%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0, html.auto .sf-c-txt-cornflowerblue\:0 { color: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10, html.auto .sf-c-txt-cornflowerblue\:10 { color: hsl(219, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20, html.auto .sf-c-txt-cornflowerblue\:20 { color: hsl(219, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30, html.auto .sf-c-txt-cornflowerblue\:30 { color: hsl(219, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40, html.auto .sf-c-txt-cornflowerblue\:40 { color: hsl(219, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50, html.auto .sf-c-txt-cornflowerblue\:50 { color: hsl(219, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60, html.auto .sf-c-txt-cornflowerblue\:60 { color: hsl(219, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70, html.auto .sf-c-txt-cornflowerblue\:70 { color: hsl(219, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80, html.auto .sf-c-txt-cornflowerblue\:80 { color: hsl(219, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90, html.auto .sf-c-txt-cornflowerblue\:90 { color: hsl(219, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100, html.auto .sf-c-txt-cornflowerblue\:100 { color: hsl(219, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue, html.var.auto .sf-c-txt-cornflowerblue { color: hsl(219, 79%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0, html.var.auto .sf-c-txt-cornflowerblue\:0 { color: hsl(219, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10, html.var.auto .sf-c-txt-cornflowerblue\:10 { color: hsl(219, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20, html.var.auto .sf-c-txt-cornflowerblue\:20 { color: hsl(219, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30, html.var.auto .sf-c-txt-cornflowerblue\:30 { color: hsl(219, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40, html.var.auto .sf-c-txt-cornflowerblue\:40 { color: hsl(219, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50, html.var.auto .sf-c-txt-cornflowerblue\:50 { color: hsl(219, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60, html.var.auto .sf-c-txt-cornflowerblue\:60 { color: hsl(219, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70, html.var.auto .sf-c-txt-cornflowerblue\:70 { color: hsl(219, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80, html.var.auto .sf-c-txt-cornflowerblue\:80 { color: hsl(219, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90, html.var.auto .sf-c-txt-cornflowerblue\:90 { color: hsl(219, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100, html.var.auto .sf-c-txt-cornflowerblue\:100 { color: hsl(219, 79%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:dark, html.auto .sf-c-txt-cornflowerblue\:dark { color: hsl(219, 79%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0\:dark, html.auto .sf-c-txt-cornflowerblue\:0\:dark { color: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10\:dark, html.auto .sf-c-txt-cornflowerblue\:10\:dark { color: hsl(219, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20\:dark, html.auto .sf-c-txt-cornflowerblue\:20\:dark { color: hsl(219, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30\:dark, html.auto .sf-c-txt-cornflowerblue\:30\:dark { color: hsl(219, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40\:dark, html.auto .sf-c-txt-cornflowerblue\:40\:dark { color: hsl(219, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50\:dark, html.auto .sf-c-txt-cornflowerblue\:50\:dark { color: hsl(219, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60\:dark, html.auto .sf-c-txt-cornflowerblue\:60\:dark { color: hsl(219, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70\:dark, html.auto .sf-c-txt-cornflowerblue\:70\:dark { color: hsl(219, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80\:dark, html.auto .sf-c-txt-cornflowerblue\:80\:dark { color: hsl(219, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90\:dark, html.auto .sf-c-txt-cornflowerblue\:90\:dark { color: hsl(219, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100\:dark, html.auto .sf-c-txt-cornflowerblue\:100\:dark { color: hsl(219, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:dark, html.var.auto .sf-c-txt-cornflowerblue\:dark { color: hsl(219, 79%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0\:dark, html.var.auto .sf-c-txt-cornflowerblue\:0\:dark { color: hsl(219, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10\:dark, html.var.auto .sf-c-txt-cornflowerblue\:10\:dark { color: hsl(219, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20\:dark, html.var.auto .sf-c-txt-cornflowerblue\:20\:dark { color: hsl(219, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30\:dark, html.var.auto .sf-c-txt-cornflowerblue\:30\:dark { color: hsl(219, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40\:dark, html.var.auto .sf-c-txt-cornflowerblue\:40\:dark { color: hsl(219, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50\:dark, html.var.auto .sf-c-txt-cornflowerblue\:50\:dark { color: hsl(219, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60\:dark, html.var.auto .sf-c-txt-cornflowerblue\:60\:dark { color: hsl(219, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70\:dark, html.var.auto .sf-c-txt-cornflowerblue\:70\:dark { color: hsl(219, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80\:dark, html.var.auto .sf-c-txt-cornflowerblue\:80\:dark { color: hsl(219, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90\:dark, html.var.auto .sf-c-txt-cornflowerblue\:90\:dark { color: hsl(219, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100\:dark, html.var.auto .sf-c-txt-cornflowerblue\:100\:dark { color: hsl(219, 79%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/cornsilk.css b/src/colors/10/cornsilk.css index 3383834..a09b7d2 100644 --- a/src/colors/10/cornsilk.css +++ b/src/colors/10/cornsilk.css @@ -1,4 +1,4 @@ -:root { +[class*='cornsilk'] { --sf-c-cornsilk: 48 100% 93%; --sf-c-cornsilk-0: 48 100% 0%; --sf-c-cornsilk-10: 48 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-cornsilk\:100\:dark, html.dark .sf-c-txt-c html.var[data-theme='auto'] .sf-c-cornsilk\:90\:dark, html.var.auto .sf-c-cornsilk\:90\:dark { color: hsl(48, 100%, 90%); background: hsl(48, 100%, 10%) } html.var[data-theme='auto'] .sf-c-cornsilk\:100\:dark, html.var.auto .sf-c-cornsilk\:100\:dark { color: hsl(48, 100%, 90%); background: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk, html.auto .sf-c-txt-cornsilk { color: hsl(48, 100%, 93%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0, html.auto .sf-c-txt-cornsilk\:0 { color: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10, html.auto .sf-c-txt-cornsilk\:10 { color: hsl(48, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20, html.auto .sf-c-txt-cornsilk\:20 { color: hsl(48, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30, html.auto .sf-c-txt-cornsilk\:30 { color: hsl(48, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40, html.auto .sf-c-txt-cornsilk\:40 { color: hsl(48, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50, html.auto .sf-c-txt-cornsilk\:50 { color: hsl(48, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60, html.auto .sf-c-txt-cornsilk\:60 { color: hsl(48, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70, html.auto .sf-c-txt-cornsilk\:70 { color: hsl(48, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80, html.auto .sf-c-txt-cornsilk\:80 { color: hsl(48, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90, html.auto .sf-c-txt-cornsilk\:90 { color: hsl(48, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100, html.auto .sf-c-txt-cornsilk\:100 { color: hsl(48, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk, html.var.auto .sf-c-txt-cornsilk { color: hsl(48, 100%, 93%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0, html.var.auto .sf-c-txt-cornsilk\:0 { color: hsl(48, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10, html.var.auto .sf-c-txt-cornsilk\:10 { color: hsl(48, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20, html.var.auto .sf-c-txt-cornsilk\:20 { color: hsl(48, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30, html.var.auto .sf-c-txt-cornsilk\:30 { color: hsl(48, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40, html.var.auto .sf-c-txt-cornsilk\:40 { color: hsl(48, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50, html.var.auto .sf-c-txt-cornsilk\:50 { color: hsl(48, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60, html.var.auto .sf-c-txt-cornsilk\:60 { color: hsl(48, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70, html.var.auto .sf-c-txt-cornsilk\:70 { color: hsl(48, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80, html.var.auto .sf-c-txt-cornsilk\:80 { color: hsl(48, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90, html.var.auto .sf-c-txt-cornsilk\:90 { color: hsl(48, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100, html.var.auto .sf-c-txt-cornsilk\:100 { color: hsl(48, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:dark, html.auto .sf-c-txt-cornsilk\:dark { color: hsl(48, 100%, 93%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0\:dark, html.auto .sf-c-txt-cornsilk\:0\:dark { color: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10\:dark, html.auto .sf-c-txt-cornsilk\:10\:dark { color: hsl(48, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20\:dark, html.auto .sf-c-txt-cornsilk\:20\:dark { color: hsl(48, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30\:dark, html.auto .sf-c-txt-cornsilk\:30\:dark { color: hsl(48, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40\:dark, html.auto .sf-c-txt-cornsilk\:40\:dark { color: hsl(48, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50\:dark, html.auto .sf-c-txt-cornsilk\:50\:dark { color: hsl(48, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60\:dark, html.auto .sf-c-txt-cornsilk\:60\:dark { color: hsl(48, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70\:dark, html.auto .sf-c-txt-cornsilk\:70\:dark { color: hsl(48, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80\:dark, html.auto .sf-c-txt-cornsilk\:80\:dark { color: hsl(48, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90\:dark, html.auto .sf-c-txt-cornsilk\:90\:dark { color: hsl(48, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100\:dark, html.auto .sf-c-txt-cornsilk\:100\:dark { color: hsl(48, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:dark, html.var.auto .sf-c-txt-cornsilk\:dark { color: hsl(48, 100%, 93%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0\:dark, html.var.auto .sf-c-txt-cornsilk\:0\:dark { color: hsl(48, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10\:dark, html.var.auto .sf-c-txt-cornsilk\:10\:dark { color: hsl(48, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20\:dark, html.var.auto .sf-c-txt-cornsilk\:20\:dark { color: hsl(48, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30\:dark, html.var.auto .sf-c-txt-cornsilk\:30\:dark { color: hsl(48, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40\:dark, html.var.auto .sf-c-txt-cornsilk\:40\:dark { color: hsl(48, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50\:dark, html.var.auto .sf-c-txt-cornsilk\:50\:dark { color: hsl(48, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60\:dark, html.var.auto .sf-c-txt-cornsilk\:60\:dark { color: hsl(48, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70\:dark, html.var.auto .sf-c-txt-cornsilk\:70\:dark { color: hsl(48, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80\:dark, html.var.auto .sf-c-txt-cornsilk\:80\:dark { color: hsl(48, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90\:dark, html.var.auto .sf-c-txt-cornsilk\:90\:dark { color: hsl(48, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100\:dark, html.var.auto .sf-c-txt-cornsilk\:100\:dark { color: hsl(48, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/crimson.css b/src/colors/10/crimson.css index 116fdc6..a3dc945 100644 --- a/src/colors/10/crimson.css +++ b/src/colors/10/crimson.css @@ -1,4 +1,4 @@ -:root { +[class*='crimson'] { --sf-c-crimson: 348 83% 47%; --sf-c-crimson-0: 348 83% 0%; --sf-c-crimson-10: 348 83% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-crimson\:100\:dark, html.dark .sf-c-txt-cr html.var[data-theme='auto'] .sf-c-crimson\:90\:dark, html.var.auto .sf-c-crimson\:90\:dark { color: hsl(348, 83%, 90%); background: hsl(348, 83%, 10%) } html.var[data-theme='auto'] .sf-c-crimson\:100\:dark, html.var.auto .sf-c-crimson\:100\:dark { color: hsl(348, 83%, 90%); background: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson, html.auto .sf-c-txt-crimson { color: hsl(348, 83%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:0, html.auto .sf-c-txt-crimson\:0 { color: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:10, html.auto .sf-c-txt-crimson\:10 { color: hsl(348, 83%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:20, html.auto .sf-c-txt-crimson\:20 { color: hsl(348, 83%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:30, html.auto .sf-c-txt-crimson\:30 { color: hsl(348, 83%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:40, html.auto .sf-c-txt-crimson\:40 { color: hsl(348, 83%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:50, html.auto .sf-c-txt-crimson\:50 { color: hsl(348, 83%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:60, html.auto .sf-c-txt-crimson\:60 { color: hsl(348, 83%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:70, html.auto .sf-c-txt-crimson\:70 { color: hsl(348, 83%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:80, html.auto .sf-c-txt-crimson\:80 { color: hsl(348, 83%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:90, html.auto .sf-c-txt-crimson\:90 { color: hsl(348, 83%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:100, html.auto .sf-c-txt-crimson\:100 { color: hsl(348, 83%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-crimson, html.var.auto .sf-c-txt-crimson { color: hsl(348, 83%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:0, html.var.auto .sf-c-txt-crimson\:0 { color: hsl(348, 83%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:10, html.var.auto .sf-c-txt-crimson\:10 { color: hsl(348, 83%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:20, html.var.auto .sf-c-txt-crimson\:20 { color: hsl(348, 83%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:30, html.var.auto .sf-c-txt-crimson\:30 { color: hsl(348, 83%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:40, html.var.auto .sf-c-txt-crimson\:40 { color: hsl(348, 83%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:50, html.var.auto .sf-c-txt-crimson\:50 { color: hsl(348, 83%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:60, html.var.auto .sf-c-txt-crimson\:60 { color: hsl(348, 83%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:70, html.var.auto .sf-c-txt-crimson\:70 { color: hsl(348, 83%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:80, html.var.auto .sf-c-txt-crimson\:80 { color: hsl(348, 83%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:90, html.var.auto .sf-c-txt-crimson\:90 { color: hsl(348, 83%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:100, html.var.auto .sf-c-txt-crimson\:100 { color: hsl(348, 83%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:dark, html.auto .sf-c-txt-crimson\:dark { color: hsl(348, 83%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:0\:dark, html.auto .sf-c-txt-crimson\:0\:dark { color: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:10\:dark, html.auto .sf-c-txt-crimson\:10\:dark { color: hsl(348, 83%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:20\:dark, html.auto .sf-c-txt-crimson\:20\:dark { color: hsl(348, 83%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:30\:dark, html.auto .sf-c-txt-crimson\:30\:dark { color: hsl(348, 83%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:40\:dark, html.auto .sf-c-txt-crimson\:40\:dark { color: hsl(348, 83%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:50\:dark, html.auto .sf-c-txt-crimson\:50\:dark { color: hsl(348, 83%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:60\:dark, html.auto .sf-c-txt-crimson\:60\:dark { color: hsl(348, 83%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:70\:dark, html.auto .sf-c-txt-crimson\:70\:dark { color: hsl(348, 83%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:80\:dark, html.auto .sf-c-txt-crimson\:80\:dark { color: hsl(348, 83%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:90\:dark, html.auto .sf-c-txt-crimson\:90\:dark { color: hsl(348, 83%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:100\:dark, html.auto .sf-c-txt-crimson\:100\:dark { color: hsl(348, 83%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:dark, html.var.auto .sf-c-txt-crimson\:dark { color: hsl(348, 83%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:0\:dark, html.var.auto .sf-c-txt-crimson\:0\:dark { color: hsl(348, 83%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:10\:dark, html.var.auto .sf-c-txt-crimson\:10\:dark { color: hsl(348, 83%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:20\:dark, html.var.auto .sf-c-txt-crimson\:20\:dark { color: hsl(348, 83%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:30\:dark, html.var.auto .sf-c-txt-crimson\:30\:dark { color: hsl(348, 83%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:40\:dark, html.var.auto .sf-c-txt-crimson\:40\:dark { color: hsl(348, 83%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:50\:dark, html.var.auto .sf-c-txt-crimson\:50\:dark { color: hsl(348, 83%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:60\:dark, html.var.auto .sf-c-txt-crimson\:60\:dark { color: hsl(348, 83%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:70\:dark, html.var.auto .sf-c-txt-crimson\:70\:dark { color: hsl(348, 83%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:80\:dark, html.var.auto .sf-c-txt-crimson\:80\:dark { color: hsl(348, 83%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:90\:dark, html.var.auto .sf-c-txt-crimson\:90\:dark { color: hsl(348, 83%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:100\:dark, html.var.auto .sf-c-txt-crimson\:100\:dark { color: hsl(348, 83%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/cyan.css b/src/colors/10/cyan.css index 902338d..34e501b 100644 --- a/src/colors/10/cyan.css +++ b/src/colors/10/cyan.css @@ -1,4 +1,4 @@ -:root { +[class*='cyan'] { --sf-c-cyan: 180 100% 50%; --sf-c-cyan-0: 180 100% 0%; --sf-c-cyan-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-cyan\:100\:dark, html.dark .sf-c-txt-cyan\ html.var[data-theme='auto'] .sf-c-cyan\:90\:dark, html.var.auto .sf-c-cyan\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-cyan\:100\:dark, html.var.auto .sf-c-cyan\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan, html.auto .sf-c-txt-cyan { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:0, html.auto .sf-c-txt-cyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:10, html.auto .sf-c-txt-cyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:20, html.auto .sf-c-txt-cyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:30, html.auto .sf-c-txt-cyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:40, html.auto .sf-c-txt-cyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:50, html.auto .sf-c-txt-cyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:60, html.auto .sf-c-txt-cyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:70, html.auto .sf-c-txt-cyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:80, html.auto .sf-c-txt-cyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:90, html.auto .sf-c-txt-cyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:100, html.auto .sf-c-txt-cyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cyan, html.var.auto .sf-c-txt-cyan { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:0, html.var.auto .sf-c-txt-cyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:10, html.var.auto .sf-c-txt-cyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:20, html.var.auto .sf-c-txt-cyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:30, html.var.auto .sf-c-txt-cyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:40, html.var.auto .sf-c-txt-cyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:50, html.var.auto .sf-c-txt-cyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:60, html.var.auto .sf-c-txt-cyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:70, html.var.auto .sf-c-txt-cyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:80, html.var.auto .sf-c-txt-cyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:90, html.var.auto .sf-c-txt-cyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:100, html.var.auto .sf-c-txt-cyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:dark, html.auto .sf-c-txt-cyan\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:0\:dark, html.auto .sf-c-txt-cyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:10\:dark, html.auto .sf-c-txt-cyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:20\:dark, html.auto .sf-c-txt-cyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:30\:dark, html.auto .sf-c-txt-cyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:40\:dark, html.auto .sf-c-txt-cyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:50\:dark, html.auto .sf-c-txt-cyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:60\:dark, html.auto .sf-c-txt-cyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:70\:dark, html.auto .sf-c-txt-cyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:80\:dark, html.auto .sf-c-txt-cyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:90\:dark, html.auto .sf-c-txt-cyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:100\:dark, html.auto .sf-c-txt-cyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:dark, html.var.auto .sf-c-txt-cyan\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:0\:dark, html.var.auto .sf-c-txt-cyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:10\:dark, html.var.auto .sf-c-txt-cyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:20\:dark, html.var.auto .sf-c-txt-cyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:30\:dark, html.var.auto .sf-c-txt-cyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:40\:dark, html.var.auto .sf-c-txt-cyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:50\:dark, html.var.auto .sf-c-txt-cyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:60\:dark, html.var.auto .sf-c-txt-cyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:70\:dark, html.var.auto .sf-c-txt-cyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:80\:dark, html.var.auto .sf-c-txt-cyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:90\:dark, html.var.auto .sf-c-txt-cyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:100\:dark, html.var.auto .sf-c-txt-cyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkblue.css b/src/colors/10/darkblue.css index 24e4206..b571db0 100644 --- a/src/colors/10/darkblue.css +++ b/src/colors/10/darkblue.css @@ -1,4 +1,4 @@ -:root { +[class*='darkblue'] { --sf-c-darkblue: 240 100% 27%; --sf-c-darkblue-0: 240 100% 0%; --sf-c-darkblue-10: 240 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkblue\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkblue\:90\:dark, html.var.auto .sf-c-darkblue\:90\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkblue\:100\:dark, html.var.auto .sf-c-darkblue\:100\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue, html.auto .sf-c-txt-darkblue { color: hsl(240, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:0, html.auto .sf-c-txt-darkblue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:10, html.auto .sf-c-txt-darkblue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:20, html.auto .sf-c-txt-darkblue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:30, html.auto .sf-c-txt-darkblue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:40, html.auto .sf-c-txt-darkblue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:50, html.auto .sf-c-txt-darkblue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:60, html.auto .sf-c-txt-darkblue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:70, html.auto .sf-c-txt-darkblue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:80, html.auto .sf-c-txt-darkblue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:90, html.auto .sf-c-txt-darkblue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:100, html.auto .sf-c-txt-darkblue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue, html.var.auto .sf-c-txt-darkblue { color: hsl(240, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:0, html.var.auto .sf-c-txt-darkblue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:10, html.var.auto .sf-c-txt-darkblue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:20, html.var.auto .sf-c-txt-darkblue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:30, html.var.auto .sf-c-txt-darkblue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:40, html.var.auto .sf-c-txt-darkblue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:50, html.var.auto .sf-c-txt-darkblue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:60, html.var.auto .sf-c-txt-darkblue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:70, html.var.auto .sf-c-txt-darkblue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:80, html.var.auto .sf-c-txt-darkblue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:90, html.var.auto .sf-c-txt-darkblue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:100, html.var.auto .sf-c-txt-darkblue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:dark, html.auto .sf-c-txt-darkblue\:dark { color: hsl(240, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:0\:dark, html.auto .sf-c-txt-darkblue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:10\:dark, html.auto .sf-c-txt-darkblue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:20\:dark, html.auto .sf-c-txt-darkblue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:30\:dark, html.auto .sf-c-txt-darkblue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:40\:dark, html.auto .sf-c-txt-darkblue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:50\:dark, html.auto .sf-c-txt-darkblue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:60\:dark, html.auto .sf-c-txt-darkblue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:70\:dark, html.auto .sf-c-txt-darkblue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:80\:dark, html.auto .sf-c-txt-darkblue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:90\:dark, html.auto .sf-c-txt-darkblue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:100\:dark, html.auto .sf-c-txt-darkblue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:dark, html.var.auto .sf-c-txt-darkblue\:dark { color: hsl(240, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:0\:dark, html.var.auto .sf-c-txt-darkblue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:10\:dark, html.var.auto .sf-c-txt-darkblue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:20\:dark, html.var.auto .sf-c-txt-darkblue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:30\:dark, html.var.auto .sf-c-txt-darkblue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:40\:dark, html.var.auto .sf-c-txt-darkblue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:50\:dark, html.var.auto .sf-c-txt-darkblue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:60\:dark, html.var.auto .sf-c-txt-darkblue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:70\:dark, html.var.auto .sf-c-txt-darkblue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:80\:dark, html.var.auto .sf-c-txt-darkblue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:90\:dark, html.var.auto .sf-c-txt-darkblue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:100\:dark, html.var.auto .sf-c-txt-darkblue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkcyan.css b/src/colors/10/darkcyan.css index 0ed51e6..1a1d7b3 100644 --- a/src/colors/10/darkcyan.css +++ b/src/colors/10/darkcyan.css @@ -1,4 +1,4 @@ -:root { +[class*='darkcyan'] { --sf-c-darkcyan: 180 100% 27%; --sf-c-darkcyan-0: 180 100% 0%; --sf-c-darkcyan-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkcyan\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkcyan\:90\:dark, html.var.auto .sf-c-darkcyan\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkcyan\:100\:dark, html.var.auto .sf-c-darkcyan\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan, html.auto .sf-c-txt-darkcyan { color: hsl(180, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0, html.auto .sf-c-txt-darkcyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10, html.auto .sf-c-txt-darkcyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20, html.auto .sf-c-txt-darkcyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30, html.auto .sf-c-txt-darkcyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40, html.auto .sf-c-txt-darkcyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50, html.auto .sf-c-txt-darkcyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60, html.auto .sf-c-txt-darkcyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70, html.auto .sf-c-txt-darkcyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80, html.auto .sf-c-txt-darkcyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90, html.auto .sf-c-txt-darkcyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100, html.auto .sf-c-txt-darkcyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan, html.var.auto .sf-c-txt-darkcyan { color: hsl(180, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0, html.var.auto .sf-c-txt-darkcyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10, html.var.auto .sf-c-txt-darkcyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20, html.var.auto .sf-c-txt-darkcyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30, html.var.auto .sf-c-txt-darkcyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40, html.var.auto .sf-c-txt-darkcyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50, html.var.auto .sf-c-txt-darkcyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60, html.var.auto .sf-c-txt-darkcyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70, html.var.auto .sf-c-txt-darkcyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80, html.var.auto .sf-c-txt-darkcyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90, html.var.auto .sf-c-txt-darkcyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100, html.var.auto .sf-c-txt-darkcyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:dark, html.auto .sf-c-txt-darkcyan\:dark { color: hsl(180, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0\:dark, html.auto .sf-c-txt-darkcyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10\:dark, html.auto .sf-c-txt-darkcyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20\:dark, html.auto .sf-c-txt-darkcyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30\:dark, html.auto .sf-c-txt-darkcyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40\:dark, html.auto .sf-c-txt-darkcyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50\:dark, html.auto .sf-c-txt-darkcyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60\:dark, html.auto .sf-c-txt-darkcyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70\:dark, html.auto .sf-c-txt-darkcyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80\:dark, html.auto .sf-c-txt-darkcyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90\:dark, html.auto .sf-c-txt-darkcyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100\:dark, html.auto .sf-c-txt-darkcyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:dark, html.var.auto .sf-c-txt-darkcyan\:dark { color: hsl(180, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0\:dark, html.var.auto .sf-c-txt-darkcyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10\:dark, html.var.auto .sf-c-txt-darkcyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20\:dark, html.var.auto .sf-c-txt-darkcyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30\:dark, html.var.auto .sf-c-txt-darkcyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40\:dark, html.var.auto .sf-c-txt-darkcyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50\:dark, html.var.auto .sf-c-txt-darkcyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60\:dark, html.var.auto .sf-c-txt-darkcyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70\:dark, html.var.auto .sf-c-txt-darkcyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80\:dark, html.var.auto .sf-c-txt-darkcyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90\:dark, html.var.auto .sf-c-txt-darkcyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100\:dark, html.var.auto .sf-c-txt-darkcyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkgoldenrod.css b/src/colors/10/darkgoldenrod.css index f74d122..093d0bb 100644 --- a/src/colors/10/darkgoldenrod.css +++ b/src/colors/10/darkgoldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgoldenrod'] { --sf-c-darkgoldenrod: 43 89% 38%; --sf-c-darkgoldenrod-0: 43 89% 0%; --sf-c-darkgoldenrod-10: 43 89% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkgoldenrod\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkgoldenrod\:90\:dark, html.var.auto .sf-c-darkgoldenrod\:90\:dark { color: hsl(43, 89%, 90%); background: hsl(43, 89%, 10%) } html.var[data-theme='auto'] .sf-c-darkgoldenrod\:100\:dark, html.var.auto .sf-c-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 90%); background: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod, html.auto .sf-c-txt-darkgoldenrod { color: hsl(43, 89%, 38%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0, html.auto .sf-c-txt-darkgoldenrod\:0 { color: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10, html.auto .sf-c-txt-darkgoldenrod\:10 { color: hsl(43, 89%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20, html.auto .sf-c-txt-darkgoldenrod\:20 { color: hsl(43, 89%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30, html.auto .sf-c-txt-darkgoldenrod\:30 { color: hsl(43, 89%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40, html.auto .sf-c-txt-darkgoldenrod\:40 { color: hsl(43, 89%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50, html.auto .sf-c-txt-darkgoldenrod\:50 { color: hsl(43, 89%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60, html.auto .sf-c-txt-darkgoldenrod\:60 { color: hsl(43, 89%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70, html.auto .sf-c-txt-darkgoldenrod\:70 { color: hsl(43, 89%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80, html.auto .sf-c-txt-darkgoldenrod\:80 { color: hsl(43, 89%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90, html.auto .sf-c-txt-darkgoldenrod\:90 { color: hsl(43, 89%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100, html.auto .sf-c-txt-darkgoldenrod\:100 { color: hsl(43, 89%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod, html.var.auto .sf-c-txt-darkgoldenrod { color: hsl(43, 89%, 38%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0, html.var.auto .sf-c-txt-darkgoldenrod\:0 { color: hsl(43, 89%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10, html.var.auto .sf-c-txt-darkgoldenrod\:10 { color: hsl(43, 89%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20, html.var.auto .sf-c-txt-darkgoldenrod\:20 { color: hsl(43, 89%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30, html.var.auto .sf-c-txt-darkgoldenrod\:30 { color: hsl(43, 89%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40, html.var.auto .sf-c-txt-darkgoldenrod\:40 { color: hsl(43, 89%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50, html.var.auto .sf-c-txt-darkgoldenrod\:50 { color: hsl(43, 89%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60, html.var.auto .sf-c-txt-darkgoldenrod\:60 { color: hsl(43, 89%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70, html.var.auto .sf-c-txt-darkgoldenrod\:70 { color: hsl(43, 89%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80, html.var.auto .sf-c-txt-darkgoldenrod\:80 { color: hsl(43, 89%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90, html.var.auto .sf-c-txt-darkgoldenrod\:90 { color: hsl(43, 89%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100, html.var.auto .sf-c-txt-darkgoldenrod\:100 { color: hsl(43, 89%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:dark, html.auto .sf-c-txt-darkgoldenrod\:dark { color: hsl(43, 89%, 38%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0\:dark, html.auto .sf-c-txt-darkgoldenrod\:0\:dark { color: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10\:dark, html.auto .sf-c-txt-darkgoldenrod\:10\:dark { color: hsl(43, 89%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20\:dark, html.auto .sf-c-txt-darkgoldenrod\:20\:dark { color: hsl(43, 89%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30\:dark, html.auto .sf-c-txt-darkgoldenrod\:30\:dark { color: hsl(43, 89%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40\:dark, html.auto .sf-c-txt-darkgoldenrod\:40\:dark { color: hsl(43, 89%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50\:dark, html.auto .sf-c-txt-darkgoldenrod\:50\:dark { color: hsl(43, 89%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60\:dark, html.auto .sf-c-txt-darkgoldenrod\:60\:dark { color: hsl(43, 89%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70\:dark, html.auto .sf-c-txt-darkgoldenrod\:70\:dark { color: hsl(43, 89%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80\:dark, html.auto .sf-c-txt-darkgoldenrod\:80\:dark { color: hsl(43, 89%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90\:dark, html.auto .sf-c-txt-darkgoldenrod\:90\:dark { color: hsl(43, 89%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100\:dark, html.auto .sf-c-txt-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:dark { color: hsl(43, 89%, 38%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:0\:dark { color: hsl(43, 89%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:10\:dark { color: hsl(43, 89%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:20\:dark { color: hsl(43, 89%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:30\:dark { color: hsl(43, 89%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:40\:dark { color: hsl(43, 89%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:50\:dark { color: hsl(43, 89%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:60\:dark { color: hsl(43, 89%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:70\:dark { color: hsl(43, 89%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:80\:dark { color: hsl(43, 89%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:90\:dark { color: hsl(43, 89%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkgray.css b/src/colors/10/darkgray.css index 8a733fe..7cfe7fe 100644 --- a/src/colors/10/darkgray.css +++ b/src/colors/10/darkgray.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgray'] { --sf-c-darkgray: 0 0% 66%; --sf-c-darkgray-0: 0 0% 0%; --sf-c-darkgray-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkgray\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkgray\:90\:dark, html.var.auto .sf-c-darkgray\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-darkgray\:100\:dark, html.var.auto .sf-c-darkgray\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray, html.auto .sf-c-txt-darkgray { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:0, html.auto .sf-c-txt-darkgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:10, html.auto .sf-c-txt-darkgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:20, html.auto .sf-c-txt-darkgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:30, html.auto .sf-c-txt-darkgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:40, html.auto .sf-c-txt-darkgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:50, html.auto .sf-c-txt-darkgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:60, html.auto .sf-c-txt-darkgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:70, html.auto .sf-c-txt-darkgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:80, html.auto .sf-c-txt-darkgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:90, html.auto .sf-c-txt-darkgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:100, html.auto .sf-c-txt-darkgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray, html.var.auto .sf-c-txt-darkgray { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:0, html.var.auto .sf-c-txt-darkgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:10, html.var.auto .sf-c-txt-darkgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:20, html.var.auto .sf-c-txt-darkgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:30, html.var.auto .sf-c-txt-darkgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:40, html.var.auto .sf-c-txt-darkgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:50, html.var.auto .sf-c-txt-darkgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:60, html.var.auto .sf-c-txt-darkgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:70, html.var.auto .sf-c-txt-darkgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:80, html.var.auto .sf-c-txt-darkgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:90, html.var.auto .sf-c-txt-darkgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:100, html.var.auto .sf-c-txt-darkgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:dark, html.auto .sf-c-txt-darkgray\:dark { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:0\:dark, html.auto .sf-c-txt-darkgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:10\:dark, html.auto .sf-c-txt-darkgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:20\:dark, html.auto .sf-c-txt-darkgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:30\:dark, html.auto .sf-c-txt-darkgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:40\:dark, html.auto .sf-c-txt-darkgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:50\:dark, html.auto .sf-c-txt-darkgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:60\:dark, html.auto .sf-c-txt-darkgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:70\:dark, html.auto .sf-c-txt-darkgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:80\:dark, html.auto .sf-c-txt-darkgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:90\:dark, html.auto .sf-c-txt-darkgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:100\:dark, html.auto .sf-c-txt-darkgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:dark, html.var.auto .sf-c-txt-darkgray\:dark { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:0\:dark, html.var.auto .sf-c-txt-darkgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:10\:dark, html.var.auto .sf-c-txt-darkgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:20\:dark, html.var.auto .sf-c-txt-darkgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:30\:dark, html.var.auto .sf-c-txt-darkgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:40\:dark, html.var.auto .sf-c-txt-darkgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:50\:dark, html.var.auto .sf-c-txt-darkgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:60\:dark, html.var.auto .sf-c-txt-darkgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:70\:dark, html.var.auto .sf-c-txt-darkgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:80\:dark, html.var.auto .sf-c-txt-darkgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:90\:dark, html.var.auto .sf-c-txt-darkgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:100\:dark, html.var.auto .sf-c-txt-darkgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkgreen.css b/src/colors/10/darkgreen.css index 63efd81..585079e 100644 --- a/src/colors/10/darkgreen.css +++ b/src/colors/10/darkgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgreen'] { --sf-c-darkgreen: 120 100% 20%; --sf-c-darkgreen-0: 120 100% 0%; --sf-c-darkgreen-10: 120 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkgreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-darkgreen\:90\:dark, html.var.auto .sf-c-darkgreen\:90\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkgreen\:100\:dark, html.var.auto .sf-c-darkgreen\:100\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen, html.auto .sf-c-txt-darkgreen { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0, html.auto .sf-c-txt-darkgreen\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10, html.auto .sf-c-txt-darkgreen\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20, html.auto .sf-c-txt-darkgreen\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30, html.auto .sf-c-txt-darkgreen\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40, html.auto .sf-c-txt-darkgreen\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50, html.auto .sf-c-txt-darkgreen\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60, html.auto .sf-c-txt-darkgreen\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70, html.auto .sf-c-txt-darkgreen\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80, html.auto .sf-c-txt-darkgreen\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90, html.auto .sf-c-txt-darkgreen\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100, html.auto .sf-c-txt-darkgreen\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen, html.var.auto .sf-c-txt-darkgreen { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0, html.var.auto .sf-c-txt-darkgreen\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10, html.var.auto .sf-c-txt-darkgreen\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20, html.var.auto .sf-c-txt-darkgreen\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30, html.var.auto .sf-c-txt-darkgreen\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40, html.var.auto .sf-c-txt-darkgreen\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50, html.var.auto .sf-c-txt-darkgreen\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60, html.var.auto .sf-c-txt-darkgreen\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70, html.var.auto .sf-c-txt-darkgreen\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80, html.var.auto .sf-c-txt-darkgreen\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90, html.var.auto .sf-c-txt-darkgreen\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100, html.var.auto .sf-c-txt-darkgreen\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:dark, html.auto .sf-c-txt-darkgreen\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0\:dark, html.auto .sf-c-txt-darkgreen\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10\:dark, html.auto .sf-c-txt-darkgreen\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20\:dark, html.auto .sf-c-txt-darkgreen\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30\:dark, html.auto .sf-c-txt-darkgreen\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40\:dark, html.auto .sf-c-txt-darkgreen\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50\:dark, html.auto .sf-c-txt-darkgreen\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60\:dark, html.auto .sf-c-txt-darkgreen\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70\:dark, html.auto .sf-c-txt-darkgreen\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80\:dark, html.auto .sf-c-txt-darkgreen\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90\:dark, html.auto .sf-c-txt-darkgreen\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100\:dark, html.auto .sf-c-txt-darkgreen\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:dark, html.var.auto .sf-c-txt-darkgreen\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0\:dark, html.var.auto .sf-c-txt-darkgreen\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10\:dark, html.var.auto .sf-c-txt-darkgreen\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20\:dark, html.var.auto .sf-c-txt-darkgreen\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30\:dark, html.var.auto .sf-c-txt-darkgreen\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40\:dark, html.var.auto .sf-c-txt-darkgreen\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50\:dark, html.var.auto .sf-c-txt-darkgreen\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60\:dark, html.var.auto .sf-c-txt-darkgreen\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70\:dark, html.var.auto .sf-c-txt-darkgreen\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80\:dark, html.var.auto .sf-c-txt-darkgreen\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90\:dark, html.var.auto .sf-c-txt-darkgreen\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100\:dark, html.var.auto .sf-c-txt-darkgreen\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkgrey.css b/src/colors/10/darkgrey.css index 46500a7..4bd1c65 100644 --- a/src/colors/10/darkgrey.css +++ b/src/colors/10/darkgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgrey'] { --sf-c-darkgrey: 0 0% 66%; --sf-c-darkgrey-0: 0 0% 0%; --sf-c-darkgrey-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkgrey\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkgrey\:90\:dark, html.var.auto .sf-c-darkgrey\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-darkgrey\:100\:dark, html.var.auto .sf-c-darkgrey\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey, html.auto .sf-c-txt-darkgrey { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0, html.auto .sf-c-txt-darkgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10, html.auto .sf-c-txt-darkgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20, html.auto .sf-c-txt-darkgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30, html.auto .sf-c-txt-darkgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40, html.auto .sf-c-txt-darkgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50, html.auto .sf-c-txt-darkgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60, html.auto .sf-c-txt-darkgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70, html.auto .sf-c-txt-darkgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80, html.auto .sf-c-txt-darkgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90, html.auto .sf-c-txt-darkgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100, html.auto .sf-c-txt-darkgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey, html.var.auto .sf-c-txt-darkgrey { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0, html.var.auto .sf-c-txt-darkgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10, html.var.auto .sf-c-txt-darkgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20, html.var.auto .sf-c-txt-darkgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30, html.var.auto .sf-c-txt-darkgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40, html.var.auto .sf-c-txt-darkgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50, html.var.auto .sf-c-txt-darkgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60, html.var.auto .sf-c-txt-darkgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70, html.var.auto .sf-c-txt-darkgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80, html.var.auto .sf-c-txt-darkgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90, html.var.auto .sf-c-txt-darkgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100, html.var.auto .sf-c-txt-darkgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:dark, html.auto .sf-c-txt-darkgrey\:dark { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0\:dark, html.auto .sf-c-txt-darkgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10\:dark, html.auto .sf-c-txt-darkgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20\:dark, html.auto .sf-c-txt-darkgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30\:dark, html.auto .sf-c-txt-darkgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40\:dark, html.auto .sf-c-txt-darkgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50\:dark, html.auto .sf-c-txt-darkgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60\:dark, html.auto .sf-c-txt-darkgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70\:dark, html.auto .sf-c-txt-darkgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80\:dark, html.auto .sf-c-txt-darkgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90\:dark, html.auto .sf-c-txt-darkgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100\:dark, html.auto .sf-c-txt-darkgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:dark, html.var.auto .sf-c-txt-darkgrey\:dark { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0\:dark, html.var.auto .sf-c-txt-darkgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10\:dark, html.var.auto .sf-c-txt-darkgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20\:dark, html.var.auto .sf-c-txt-darkgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30\:dark, html.var.auto .sf-c-txt-darkgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40\:dark, html.var.auto .sf-c-txt-darkgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50\:dark, html.var.auto .sf-c-txt-darkgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60\:dark, html.var.auto .sf-c-txt-darkgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70\:dark, html.var.auto .sf-c-txt-darkgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80\:dark, html.var.auto .sf-c-txt-darkgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90\:dark, html.var.auto .sf-c-txt-darkgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100\:dark, html.var.auto .sf-c-txt-darkgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkkhaki.css b/src/colors/10/darkkhaki.css index 7644f28..c76c9f1 100644 --- a/src/colors/10/darkkhaki.css +++ b/src/colors/10/darkkhaki.css @@ -1,4 +1,4 @@ -:root { +[class*='darkkhaki'] { --sf-c-darkkhaki: 56 38% 58%; --sf-c-darkkhaki-0: 56 38% 0%; --sf-c-darkkhaki-10: 56 38% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkkhaki\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-darkkhaki\:90\:dark, html.var.auto .sf-c-darkkhaki\:90\:dark { color: hsl(56, 38%, 90%); background: hsl(56, 38%, 10%) } html.var[data-theme='auto'] .sf-c-darkkhaki\:100\:dark, html.var.auto .sf-c-darkkhaki\:100\:dark { color: hsl(56, 38%, 90%); background: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki, html.auto .sf-c-txt-darkkhaki { color: hsl(56, 38%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0, html.auto .sf-c-txt-darkkhaki\:0 { color: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10, html.auto .sf-c-txt-darkkhaki\:10 { color: hsl(56, 38%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20, html.auto .sf-c-txt-darkkhaki\:20 { color: hsl(56, 38%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30, html.auto .sf-c-txt-darkkhaki\:30 { color: hsl(56, 38%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40, html.auto .sf-c-txt-darkkhaki\:40 { color: hsl(56, 38%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50, html.auto .sf-c-txt-darkkhaki\:50 { color: hsl(56, 38%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60, html.auto .sf-c-txt-darkkhaki\:60 { color: hsl(56, 38%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70, html.auto .sf-c-txt-darkkhaki\:70 { color: hsl(56, 38%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80, html.auto .sf-c-txt-darkkhaki\:80 { color: hsl(56, 38%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90, html.auto .sf-c-txt-darkkhaki\:90 { color: hsl(56, 38%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100, html.auto .sf-c-txt-darkkhaki\:100 { color: hsl(56, 38%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki, html.var.auto .sf-c-txt-darkkhaki { color: hsl(56, 38%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0, html.var.auto .sf-c-txt-darkkhaki\:0 { color: hsl(56, 38%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10, html.var.auto .sf-c-txt-darkkhaki\:10 { color: hsl(56, 38%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20, html.var.auto .sf-c-txt-darkkhaki\:20 { color: hsl(56, 38%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30, html.var.auto .sf-c-txt-darkkhaki\:30 { color: hsl(56, 38%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40, html.var.auto .sf-c-txt-darkkhaki\:40 { color: hsl(56, 38%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50, html.var.auto .sf-c-txt-darkkhaki\:50 { color: hsl(56, 38%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60, html.var.auto .sf-c-txt-darkkhaki\:60 { color: hsl(56, 38%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70, html.var.auto .sf-c-txt-darkkhaki\:70 { color: hsl(56, 38%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80, html.var.auto .sf-c-txt-darkkhaki\:80 { color: hsl(56, 38%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90, html.var.auto .sf-c-txt-darkkhaki\:90 { color: hsl(56, 38%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100, html.var.auto .sf-c-txt-darkkhaki\:100 { color: hsl(56, 38%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:dark, html.auto .sf-c-txt-darkkhaki\:dark { color: hsl(56, 38%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0\:dark, html.auto .sf-c-txt-darkkhaki\:0\:dark { color: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10\:dark, html.auto .sf-c-txt-darkkhaki\:10\:dark { color: hsl(56, 38%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20\:dark, html.auto .sf-c-txt-darkkhaki\:20\:dark { color: hsl(56, 38%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30\:dark, html.auto .sf-c-txt-darkkhaki\:30\:dark { color: hsl(56, 38%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40\:dark, html.auto .sf-c-txt-darkkhaki\:40\:dark { color: hsl(56, 38%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50\:dark, html.auto .sf-c-txt-darkkhaki\:50\:dark { color: hsl(56, 38%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60\:dark, html.auto .sf-c-txt-darkkhaki\:60\:dark { color: hsl(56, 38%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70\:dark, html.auto .sf-c-txt-darkkhaki\:70\:dark { color: hsl(56, 38%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80\:dark, html.auto .sf-c-txt-darkkhaki\:80\:dark { color: hsl(56, 38%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90\:dark, html.auto .sf-c-txt-darkkhaki\:90\:dark { color: hsl(56, 38%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100\:dark, html.auto .sf-c-txt-darkkhaki\:100\:dark { color: hsl(56, 38%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:dark, html.var.auto .sf-c-txt-darkkhaki\:dark { color: hsl(56, 38%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0\:dark, html.var.auto .sf-c-txt-darkkhaki\:0\:dark { color: hsl(56, 38%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10\:dark, html.var.auto .sf-c-txt-darkkhaki\:10\:dark { color: hsl(56, 38%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20\:dark, html.var.auto .sf-c-txt-darkkhaki\:20\:dark { color: hsl(56, 38%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30\:dark, html.var.auto .sf-c-txt-darkkhaki\:30\:dark { color: hsl(56, 38%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40\:dark, html.var.auto .sf-c-txt-darkkhaki\:40\:dark { color: hsl(56, 38%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50\:dark, html.var.auto .sf-c-txt-darkkhaki\:50\:dark { color: hsl(56, 38%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60\:dark, html.var.auto .sf-c-txt-darkkhaki\:60\:dark { color: hsl(56, 38%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70\:dark, html.var.auto .sf-c-txt-darkkhaki\:70\:dark { color: hsl(56, 38%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80\:dark, html.var.auto .sf-c-txt-darkkhaki\:80\:dark { color: hsl(56, 38%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90\:dark, html.var.auto .sf-c-txt-darkkhaki\:90\:dark { color: hsl(56, 38%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100\:dark, html.var.auto .sf-c-txt-darkkhaki\:100\:dark { color: hsl(56, 38%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkmagenta.css b/src/colors/10/darkmagenta.css index b0964f4..a4c19df 100644 --- a/src/colors/10/darkmagenta.css +++ b/src/colors/10/darkmagenta.css @@ -1,4 +1,4 @@ -:root { +[class*='darkmagenta'] { --sf-c-darkmagenta: 300 100% 27%; --sf-c-darkmagenta-0: 300 100% 0%; --sf-c-darkmagenta-10: 300 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkmagenta\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-darkmagenta\:90\:dark, html.var.auto .sf-c-darkmagenta\:90\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkmagenta\:100\:dark, html.var.auto .sf-c-darkmagenta\:100\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta, html.auto .sf-c-txt-darkmagenta { color: hsl(300, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0, html.auto .sf-c-txt-darkmagenta\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10, html.auto .sf-c-txt-darkmagenta\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20, html.auto .sf-c-txt-darkmagenta\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30, html.auto .sf-c-txt-darkmagenta\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40, html.auto .sf-c-txt-darkmagenta\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50, html.auto .sf-c-txt-darkmagenta\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60, html.auto .sf-c-txt-darkmagenta\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70, html.auto .sf-c-txt-darkmagenta\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80, html.auto .sf-c-txt-darkmagenta\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90, html.auto .sf-c-txt-darkmagenta\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100, html.auto .sf-c-txt-darkmagenta\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta, html.var.auto .sf-c-txt-darkmagenta { color: hsl(300, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0, html.var.auto .sf-c-txt-darkmagenta\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10, html.var.auto .sf-c-txt-darkmagenta\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20, html.var.auto .sf-c-txt-darkmagenta\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30, html.var.auto .sf-c-txt-darkmagenta\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40, html.var.auto .sf-c-txt-darkmagenta\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50, html.var.auto .sf-c-txt-darkmagenta\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60, html.var.auto .sf-c-txt-darkmagenta\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70, html.var.auto .sf-c-txt-darkmagenta\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80, html.var.auto .sf-c-txt-darkmagenta\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90, html.var.auto .sf-c-txt-darkmagenta\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100, html.var.auto .sf-c-txt-darkmagenta\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:dark, html.auto .sf-c-txt-darkmagenta\:dark { color: hsl(300, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0\:dark, html.auto .sf-c-txt-darkmagenta\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10\:dark, html.auto .sf-c-txt-darkmagenta\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20\:dark, html.auto .sf-c-txt-darkmagenta\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30\:dark, html.auto .sf-c-txt-darkmagenta\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40\:dark, html.auto .sf-c-txt-darkmagenta\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50\:dark, html.auto .sf-c-txt-darkmagenta\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60\:dark, html.auto .sf-c-txt-darkmagenta\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70\:dark, html.auto .sf-c-txt-darkmagenta\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80\:dark, html.auto .sf-c-txt-darkmagenta\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90\:dark, html.auto .sf-c-txt-darkmagenta\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100\:dark, html.auto .sf-c-txt-darkmagenta\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:dark, html.var.auto .sf-c-txt-darkmagenta\:dark { color: hsl(300, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0\:dark, html.var.auto .sf-c-txt-darkmagenta\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10\:dark, html.var.auto .sf-c-txt-darkmagenta\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20\:dark, html.var.auto .sf-c-txt-darkmagenta\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30\:dark, html.var.auto .sf-c-txt-darkmagenta\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40\:dark, html.var.auto .sf-c-txt-darkmagenta\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50\:dark, html.var.auto .sf-c-txt-darkmagenta\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60\:dark, html.var.auto .sf-c-txt-darkmagenta\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70\:dark, html.var.auto .sf-c-txt-darkmagenta\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80\:dark, html.var.auto .sf-c-txt-darkmagenta\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90\:dark, html.var.auto .sf-c-txt-darkmagenta\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100\:dark, html.var.auto .sf-c-txt-darkmagenta\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkolivegreen.css b/src/colors/10/darkolivegreen.css index 2f25dcd..c805718 100644 --- a/src/colors/10/darkolivegreen.css +++ b/src/colors/10/darkolivegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkolivegreen'] { --sf-c-darkolivegreen: 82 39% 30%; --sf-c-darkolivegreen-0: 82 39% 0%; --sf-c-darkolivegreen-10: 82 39% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkolivegreen\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-darkolivegreen\:90\:dark, html.var.auto .sf-c-darkolivegreen\:90\:dark { color: hsl(82, 39%, 90%); background: hsl(82, 39%, 10%) } html.var[data-theme='auto'] .sf-c-darkolivegreen\:100\:dark, html.var.auto .sf-c-darkolivegreen\:100\:dark { color: hsl(82, 39%, 90%); background: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen, html.auto .sf-c-txt-darkolivegreen { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0, html.auto .sf-c-txt-darkolivegreen\:0 { color: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10, html.auto .sf-c-txt-darkolivegreen\:10 { color: hsl(82, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20, html.auto .sf-c-txt-darkolivegreen\:20 { color: hsl(82, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30, html.auto .sf-c-txt-darkolivegreen\:30 { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40, html.auto .sf-c-txt-darkolivegreen\:40 { color: hsl(82, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50, html.auto .sf-c-txt-darkolivegreen\:50 { color: hsl(82, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60, html.auto .sf-c-txt-darkolivegreen\:60 { color: hsl(82, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70, html.auto .sf-c-txt-darkolivegreen\:70 { color: hsl(82, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80, html.auto .sf-c-txt-darkolivegreen\:80 { color: hsl(82, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90, html.auto .sf-c-txt-darkolivegreen\:90 { color: hsl(82, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100, html.auto .sf-c-txt-darkolivegreen\:100 { color: hsl(82, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen, html.var.auto .sf-c-txt-darkolivegreen { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0, html.var.auto .sf-c-txt-darkolivegreen\:0 { color: hsl(82, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10, html.var.auto .sf-c-txt-darkolivegreen\:10 { color: hsl(82, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20, html.var.auto .sf-c-txt-darkolivegreen\:20 { color: hsl(82, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30, html.var.auto .sf-c-txt-darkolivegreen\:30 { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40, html.var.auto .sf-c-txt-darkolivegreen\:40 { color: hsl(82, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50, html.var.auto .sf-c-txt-darkolivegreen\:50 { color: hsl(82, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60, html.var.auto .sf-c-txt-darkolivegreen\:60 { color: hsl(82, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70, html.var.auto .sf-c-txt-darkolivegreen\:70 { color: hsl(82, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80, html.var.auto .sf-c-txt-darkolivegreen\:80 { color: hsl(82, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90, html.var.auto .sf-c-txt-darkolivegreen\:90 { color: hsl(82, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100, html.var.auto .sf-c-txt-darkolivegreen\:100 { color: hsl(82, 39%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:dark, html.auto .sf-c-txt-darkolivegreen\:dark { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0\:dark, html.auto .sf-c-txt-darkolivegreen\:0\:dark { color: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10\:dark, html.auto .sf-c-txt-darkolivegreen\:10\:dark { color: hsl(82, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20\:dark, html.auto .sf-c-txt-darkolivegreen\:20\:dark { color: hsl(82, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30\:dark, html.auto .sf-c-txt-darkolivegreen\:30\:dark { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40\:dark, html.auto .sf-c-txt-darkolivegreen\:40\:dark { color: hsl(82, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50\:dark, html.auto .sf-c-txt-darkolivegreen\:50\:dark { color: hsl(82, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60\:dark, html.auto .sf-c-txt-darkolivegreen\:60\:dark { color: hsl(82, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70\:dark, html.auto .sf-c-txt-darkolivegreen\:70\:dark { color: hsl(82, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80\:dark, html.auto .sf-c-txt-darkolivegreen\:80\:dark { color: hsl(82, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90\:dark, html.auto .sf-c-txt-darkolivegreen\:90\:dark { color: hsl(82, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100\:dark, html.auto .sf-c-txt-darkolivegreen\:100\:dark { color: hsl(82, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:dark, html.var.auto .sf-c-txt-darkolivegreen\:dark { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0\:dark, html.var.auto .sf-c-txt-darkolivegreen\:0\:dark { color: hsl(82, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10\:dark, html.var.auto .sf-c-txt-darkolivegreen\:10\:dark { color: hsl(82, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20\:dark, html.var.auto .sf-c-txt-darkolivegreen\:20\:dark { color: hsl(82, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30\:dark, html.var.auto .sf-c-txt-darkolivegreen\:30\:dark { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40\:dark, html.var.auto .sf-c-txt-darkolivegreen\:40\:dark { color: hsl(82, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50\:dark, html.var.auto .sf-c-txt-darkolivegreen\:50\:dark { color: hsl(82, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60\:dark, html.var.auto .sf-c-txt-darkolivegreen\:60\:dark { color: hsl(82, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70\:dark, html.var.auto .sf-c-txt-darkolivegreen\:70\:dark { color: hsl(82, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80\:dark, html.var.auto .sf-c-txt-darkolivegreen\:80\:dark { color: hsl(82, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90\:dark, html.var.auto .sf-c-txt-darkolivegreen\:90\:dark { color: hsl(82, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100\:dark, html.var.auto .sf-c-txt-darkolivegreen\:100\:dark { color: hsl(82, 39%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkorange.css b/src/colors/10/darkorange.css index e5aa3c1..a1d589c 100644 --- a/src/colors/10/darkorange.css +++ b/src/colors/10/darkorange.css @@ -1,4 +1,4 @@ -:root { +[class*='darkorange'] { --sf-c-darkorange: 33 100% 50%; --sf-c-darkorange-0: 33 100% 0%; --sf-c-darkorange-10: 33 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkorange\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkorange\:90\:dark, html.var.auto .sf-c-darkorange\:90\:dark { color: hsl(33, 100%, 90%); background: hsl(33, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkorange\:100\:dark, html.var.auto .sf-c-darkorange\:100\:dark { color: hsl(33, 100%, 90%); background: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange, html.auto .sf-c-txt-darkorange { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:0, html.auto .sf-c-txt-darkorange\:0 { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:10, html.auto .sf-c-txt-darkorange\:10 { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:20, html.auto .sf-c-txt-darkorange\:20 { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:30, html.auto .sf-c-txt-darkorange\:30 { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:40, html.auto .sf-c-txt-darkorange\:40 { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:50, html.auto .sf-c-txt-darkorange\:50 { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:60, html.auto .sf-c-txt-darkorange\:60 { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:70, html.auto .sf-c-txt-darkorange\:70 { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:80, html.auto .sf-c-txt-darkorange\:80 { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:90, html.auto .sf-c-txt-darkorange\:90 { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:100, html.auto .sf-c-txt-darkorange\:100 { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange, html.var.auto .sf-c-txt-darkorange { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:0, html.var.auto .sf-c-txt-darkorange\:0 { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:10, html.var.auto .sf-c-txt-darkorange\:10 { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:20, html.var.auto .sf-c-txt-darkorange\:20 { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:30, html.var.auto .sf-c-txt-darkorange\:30 { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:40, html.var.auto .sf-c-txt-darkorange\:40 { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:50, html.var.auto .sf-c-txt-darkorange\:50 { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:60, html.var.auto .sf-c-txt-darkorange\:60 { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:70, html.var.auto .sf-c-txt-darkorange\:70 { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:80, html.var.auto .sf-c-txt-darkorange\:80 { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:90, html.var.auto .sf-c-txt-darkorange\:90 { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:100, html.var.auto .sf-c-txt-darkorange\:100 { color: hsl(33, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:dark, html.auto .sf-c-txt-darkorange\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:0\:dark, html.auto .sf-c-txt-darkorange\:0\:dark { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:10\:dark, html.auto .sf-c-txt-darkorange\:10\:dark { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:20\:dark, html.auto .sf-c-txt-darkorange\:20\:dark { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:30\:dark, html.auto .sf-c-txt-darkorange\:30\:dark { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:40\:dark, html.auto .sf-c-txt-darkorange\:40\:dark { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:50\:dark, html.auto .sf-c-txt-darkorange\:50\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:60\:dark, html.auto .sf-c-txt-darkorange\:60\:dark { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:70\:dark, html.auto .sf-c-txt-darkorange\:70\:dark { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:80\:dark, html.auto .sf-c-txt-darkorange\:80\:dark { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:90\:dark, html.auto .sf-c-txt-darkorange\:90\:dark { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:100\:dark, html.auto .sf-c-txt-darkorange\:100\:dark { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:dark, html.var.auto .sf-c-txt-darkorange\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:0\:dark, html.var.auto .sf-c-txt-darkorange\:0\:dark { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:10\:dark, html.var.auto .sf-c-txt-darkorange\:10\:dark { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:20\:dark, html.var.auto .sf-c-txt-darkorange\:20\:dark { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:30\:dark, html.var.auto .sf-c-txt-darkorange\:30\:dark { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:40\:dark, html.var.auto .sf-c-txt-darkorange\:40\:dark { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:50\:dark, html.var.auto .sf-c-txt-darkorange\:50\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:60\:dark, html.var.auto .sf-c-txt-darkorange\:60\:dark { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:70\:dark, html.var.auto .sf-c-txt-darkorange\:70\:dark { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:80\:dark, html.var.auto .sf-c-txt-darkorange\:80\:dark { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:90\:dark, html.var.auto .sf-c-txt-darkorange\:90\:dark { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:100\:dark, html.var.auto .sf-c-txt-darkorange\:100\:dark { color: hsl(33, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkorchid.css b/src/colors/10/darkorchid.css index db53adb..3d31969 100644 --- a/src/colors/10/darkorchid.css +++ b/src/colors/10/darkorchid.css @@ -1,4 +1,4 @@ -:root { +[class*='darkorchid'] { --sf-c-darkorchid: 280 61% 50%; --sf-c-darkorchid-0: 280 61% 0%; --sf-c-darkorchid-10: 280 61% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkorchid\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkorchid\:90\:dark, html.var.auto .sf-c-darkorchid\:90\:dark { color: hsl(280, 61%, 90%); background: hsl(280, 61%, 10%) } html.var[data-theme='auto'] .sf-c-darkorchid\:100\:dark, html.var.auto .sf-c-darkorchid\:100\:dark { color: hsl(280, 61%, 90%); background: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid, html.auto .sf-c-txt-darkorchid { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0, html.auto .sf-c-txt-darkorchid\:0 { color: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10, html.auto .sf-c-txt-darkorchid\:10 { color: hsl(280, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20, html.auto .sf-c-txt-darkorchid\:20 { color: hsl(280, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30, html.auto .sf-c-txt-darkorchid\:30 { color: hsl(280, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40, html.auto .sf-c-txt-darkorchid\:40 { color: hsl(280, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50, html.auto .sf-c-txt-darkorchid\:50 { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60, html.auto .sf-c-txt-darkorchid\:60 { color: hsl(280, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70, html.auto .sf-c-txt-darkorchid\:70 { color: hsl(280, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80, html.auto .sf-c-txt-darkorchid\:80 { color: hsl(280, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90, html.auto .sf-c-txt-darkorchid\:90 { color: hsl(280, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100, html.auto .sf-c-txt-darkorchid\:100 { color: hsl(280, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid, html.var.auto .sf-c-txt-darkorchid { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0, html.var.auto .sf-c-txt-darkorchid\:0 { color: hsl(280, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10, html.var.auto .sf-c-txt-darkorchid\:10 { color: hsl(280, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20, html.var.auto .sf-c-txt-darkorchid\:20 { color: hsl(280, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30, html.var.auto .sf-c-txt-darkorchid\:30 { color: hsl(280, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40, html.var.auto .sf-c-txt-darkorchid\:40 { color: hsl(280, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50, html.var.auto .sf-c-txt-darkorchid\:50 { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60, html.var.auto .sf-c-txt-darkorchid\:60 { color: hsl(280, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70, html.var.auto .sf-c-txt-darkorchid\:70 { color: hsl(280, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80, html.var.auto .sf-c-txt-darkorchid\:80 { color: hsl(280, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90, html.var.auto .sf-c-txt-darkorchid\:90 { color: hsl(280, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100, html.var.auto .sf-c-txt-darkorchid\:100 { color: hsl(280, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:dark, html.auto .sf-c-txt-darkorchid\:dark { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0\:dark, html.auto .sf-c-txt-darkorchid\:0\:dark { color: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10\:dark, html.auto .sf-c-txt-darkorchid\:10\:dark { color: hsl(280, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20\:dark, html.auto .sf-c-txt-darkorchid\:20\:dark { color: hsl(280, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30\:dark, html.auto .sf-c-txt-darkorchid\:30\:dark { color: hsl(280, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40\:dark, html.auto .sf-c-txt-darkorchid\:40\:dark { color: hsl(280, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50\:dark, html.auto .sf-c-txt-darkorchid\:50\:dark { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60\:dark, html.auto .sf-c-txt-darkorchid\:60\:dark { color: hsl(280, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70\:dark, html.auto .sf-c-txt-darkorchid\:70\:dark { color: hsl(280, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80\:dark, html.auto .sf-c-txt-darkorchid\:80\:dark { color: hsl(280, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90\:dark, html.auto .sf-c-txt-darkorchid\:90\:dark { color: hsl(280, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100\:dark, html.auto .sf-c-txt-darkorchid\:100\:dark { color: hsl(280, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:dark, html.var.auto .sf-c-txt-darkorchid\:dark { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0\:dark, html.var.auto .sf-c-txt-darkorchid\:0\:dark { color: hsl(280, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10\:dark, html.var.auto .sf-c-txt-darkorchid\:10\:dark { color: hsl(280, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20\:dark, html.var.auto .sf-c-txt-darkorchid\:20\:dark { color: hsl(280, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30\:dark, html.var.auto .sf-c-txt-darkorchid\:30\:dark { color: hsl(280, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40\:dark, html.var.auto .sf-c-txt-darkorchid\:40\:dark { color: hsl(280, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50\:dark, html.var.auto .sf-c-txt-darkorchid\:50\:dark { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60\:dark, html.var.auto .sf-c-txt-darkorchid\:60\:dark { color: hsl(280, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70\:dark, html.var.auto .sf-c-txt-darkorchid\:70\:dark { color: hsl(280, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80\:dark, html.var.auto .sf-c-txt-darkorchid\:80\:dark { color: hsl(280, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90\:dark, html.var.auto .sf-c-txt-darkorchid\:90\:dark { color: hsl(280, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100\:dark, html.var.auto .sf-c-txt-darkorchid\:100\:dark { color: hsl(280, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkred.css b/src/colors/10/darkred.css index 91e5f45..631c747 100644 --- a/src/colors/10/darkred.css +++ b/src/colors/10/darkred.css @@ -1,4 +1,4 @@ -:root { +[class*='darkred'] { --sf-c-darkred: 0 100% 27%; --sf-c-darkred-0: 0 100% 0%; --sf-c-darkred-10: 0 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkred\:100\:dark, html.dark .sf-c-txt-da html.var[data-theme='auto'] .sf-c-darkred\:90\:dark, html.var.auto .sf-c-darkred\:90\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkred\:100\:dark, html.var.auto .sf-c-darkred\:100\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred, html.auto .sf-c-txt-darkred { color: hsl(0, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:0, html.auto .sf-c-txt-darkred\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:10, html.auto .sf-c-txt-darkred\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:20, html.auto .sf-c-txt-darkred\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:30, html.auto .sf-c-txt-darkred\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:40, html.auto .sf-c-txt-darkred\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:50, html.auto .sf-c-txt-darkred\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:60, html.auto .sf-c-txt-darkred\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:70, html.auto .sf-c-txt-darkred\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:80, html.auto .sf-c-txt-darkred\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:90, html.auto .sf-c-txt-darkred\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:100, html.auto .sf-c-txt-darkred\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkred, html.var.auto .sf-c-txt-darkred { color: hsl(0, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:0, html.var.auto .sf-c-txt-darkred\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:10, html.var.auto .sf-c-txt-darkred\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:20, html.var.auto .sf-c-txt-darkred\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:30, html.var.auto .sf-c-txt-darkred\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:40, html.var.auto .sf-c-txt-darkred\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:50, html.var.auto .sf-c-txt-darkred\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:60, html.var.auto .sf-c-txt-darkred\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:70, html.var.auto .sf-c-txt-darkred\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:80, html.var.auto .sf-c-txt-darkred\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:90, html.var.auto .sf-c-txt-darkred\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:100, html.var.auto .sf-c-txt-darkred\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:dark, html.auto .sf-c-txt-darkred\:dark { color: hsl(0, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:0\:dark, html.auto .sf-c-txt-darkred\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:10\:dark, html.auto .sf-c-txt-darkred\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:20\:dark, html.auto .sf-c-txt-darkred\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:30\:dark, html.auto .sf-c-txt-darkred\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:40\:dark, html.auto .sf-c-txt-darkred\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:50\:dark, html.auto .sf-c-txt-darkred\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:60\:dark, html.auto .sf-c-txt-darkred\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:70\:dark, html.auto .sf-c-txt-darkred\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:80\:dark, html.auto .sf-c-txt-darkred\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:90\:dark, html.auto .sf-c-txt-darkred\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:100\:dark, html.auto .sf-c-txt-darkred\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:dark, html.var.auto .sf-c-txt-darkred\:dark { color: hsl(0, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:0\:dark, html.var.auto .sf-c-txt-darkred\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:10\:dark, html.var.auto .sf-c-txt-darkred\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:20\:dark, html.var.auto .sf-c-txt-darkred\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:30\:dark, html.var.auto .sf-c-txt-darkred\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:40\:dark, html.var.auto .sf-c-txt-darkred\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:50\:dark, html.var.auto .sf-c-txt-darkred\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:60\:dark, html.var.auto .sf-c-txt-darkred\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:70\:dark, html.var.auto .sf-c-txt-darkred\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:80\:dark, html.var.auto .sf-c-txt-darkred\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:90\:dark, html.var.auto .sf-c-txt-darkred\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:100\:dark, html.var.auto .sf-c-txt-darkred\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darksalmon.css b/src/colors/10/darksalmon.css index 68d96f2..62ad34e 100644 --- a/src/colors/10/darksalmon.css +++ b/src/colors/10/darksalmon.css @@ -1,4 +1,4 @@ -:root { +[class*='darksalmon'] { --sf-c-darksalmon: 15 72% 70%; --sf-c-darksalmon-0: 15 72% 0%; --sf-c-darksalmon-10: 15 72% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darksalmon\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darksalmon\:90\:dark, html.var.auto .sf-c-darksalmon\:90\:dark { color: hsl(15, 72%, 90%); background: hsl(15, 72%, 10%) } html.var[data-theme='auto'] .sf-c-darksalmon\:100\:dark, html.var.auto .sf-c-darksalmon\:100\:dark { color: hsl(15, 72%, 90%); background: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon, html.auto .sf-c-txt-darksalmon { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0, html.auto .sf-c-txt-darksalmon\:0 { color: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10, html.auto .sf-c-txt-darksalmon\:10 { color: hsl(15, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20, html.auto .sf-c-txt-darksalmon\:20 { color: hsl(15, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30, html.auto .sf-c-txt-darksalmon\:30 { color: hsl(15, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40, html.auto .sf-c-txt-darksalmon\:40 { color: hsl(15, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50, html.auto .sf-c-txt-darksalmon\:50 { color: hsl(15, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60, html.auto .sf-c-txt-darksalmon\:60 { color: hsl(15, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70, html.auto .sf-c-txt-darksalmon\:70 { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80, html.auto .sf-c-txt-darksalmon\:80 { color: hsl(15, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90, html.auto .sf-c-txt-darksalmon\:90 { color: hsl(15, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100, html.auto .sf-c-txt-darksalmon\:100 { color: hsl(15, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon, html.var.auto .sf-c-txt-darksalmon { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0, html.var.auto .sf-c-txt-darksalmon\:0 { color: hsl(15, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10, html.var.auto .sf-c-txt-darksalmon\:10 { color: hsl(15, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20, html.var.auto .sf-c-txt-darksalmon\:20 { color: hsl(15, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30, html.var.auto .sf-c-txt-darksalmon\:30 { color: hsl(15, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40, html.var.auto .sf-c-txt-darksalmon\:40 { color: hsl(15, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50, html.var.auto .sf-c-txt-darksalmon\:50 { color: hsl(15, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60, html.var.auto .sf-c-txt-darksalmon\:60 { color: hsl(15, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70, html.var.auto .sf-c-txt-darksalmon\:70 { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80, html.var.auto .sf-c-txt-darksalmon\:80 { color: hsl(15, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90, html.var.auto .sf-c-txt-darksalmon\:90 { color: hsl(15, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100, html.var.auto .sf-c-txt-darksalmon\:100 { color: hsl(15, 72%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:dark, html.auto .sf-c-txt-darksalmon\:dark { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0\:dark, html.auto .sf-c-txt-darksalmon\:0\:dark { color: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10\:dark, html.auto .sf-c-txt-darksalmon\:10\:dark { color: hsl(15, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20\:dark, html.auto .sf-c-txt-darksalmon\:20\:dark { color: hsl(15, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30\:dark, html.auto .sf-c-txt-darksalmon\:30\:dark { color: hsl(15, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40\:dark, html.auto .sf-c-txt-darksalmon\:40\:dark { color: hsl(15, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50\:dark, html.auto .sf-c-txt-darksalmon\:50\:dark { color: hsl(15, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60\:dark, html.auto .sf-c-txt-darksalmon\:60\:dark { color: hsl(15, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70\:dark, html.auto .sf-c-txt-darksalmon\:70\:dark { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80\:dark, html.auto .sf-c-txt-darksalmon\:80\:dark { color: hsl(15, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90\:dark, html.auto .sf-c-txt-darksalmon\:90\:dark { color: hsl(15, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100\:dark, html.auto .sf-c-txt-darksalmon\:100\:dark { color: hsl(15, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:dark, html.var.auto .sf-c-txt-darksalmon\:dark { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0\:dark, html.var.auto .sf-c-txt-darksalmon\:0\:dark { color: hsl(15, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10\:dark, html.var.auto .sf-c-txt-darksalmon\:10\:dark { color: hsl(15, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20\:dark, html.var.auto .sf-c-txt-darksalmon\:20\:dark { color: hsl(15, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30\:dark, html.var.auto .sf-c-txt-darksalmon\:30\:dark { color: hsl(15, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40\:dark, html.var.auto .sf-c-txt-darksalmon\:40\:dark { color: hsl(15, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50\:dark, html.var.auto .sf-c-txt-darksalmon\:50\:dark { color: hsl(15, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60\:dark, html.var.auto .sf-c-txt-darksalmon\:60\:dark { color: hsl(15, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70\:dark, html.var.auto .sf-c-txt-darksalmon\:70\:dark { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80\:dark, html.var.auto .sf-c-txt-darksalmon\:80\:dark { color: hsl(15, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90\:dark, html.var.auto .sf-c-txt-darksalmon\:90\:dark { color: hsl(15, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100\:dark, html.var.auto .sf-c-txt-darksalmon\:100\:dark { color: hsl(15, 72%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkseagreen.css b/src/colors/10/darkseagreen.css index 3e617ec..417c399 100644 --- a/src/colors/10/darkseagreen.css +++ b/src/colors/10/darkseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkseagreen'] { --sf-c-darkseagreen: 120 25% 65%; --sf-c-darkseagreen-0: 120 25% 0%; --sf-c-darkseagreen-10: 120 25% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkseagreen\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-darkseagreen\:90\:dark, html.var.auto .sf-c-darkseagreen\:90\:dark { color: hsl(120, 25%, 90%); background: hsl(120, 25%, 10%) } html.var[data-theme='auto'] .sf-c-darkseagreen\:100\:dark, html.var.auto .sf-c-darkseagreen\:100\:dark { color: hsl(120, 25%, 90%); background: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen, html.auto .sf-c-txt-darkseagreen { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0, html.auto .sf-c-txt-darkseagreen\:0 { color: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10, html.auto .sf-c-txt-darkseagreen\:10 { color: hsl(120, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20, html.auto .sf-c-txt-darkseagreen\:20 { color: hsl(120, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30, html.auto .sf-c-txt-darkseagreen\:30 { color: hsl(120, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40, html.auto .sf-c-txt-darkseagreen\:40 { color: hsl(120, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50, html.auto .sf-c-txt-darkseagreen\:50 { color: hsl(120, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60, html.auto .sf-c-txt-darkseagreen\:60 { color: hsl(120, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70, html.auto .sf-c-txt-darkseagreen\:70 { color: hsl(120, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80, html.auto .sf-c-txt-darkseagreen\:80 { color: hsl(120, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90, html.auto .sf-c-txt-darkseagreen\:90 { color: hsl(120, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100, html.auto .sf-c-txt-darkseagreen\:100 { color: hsl(120, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen, html.var.auto .sf-c-txt-darkseagreen { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0, html.var.auto .sf-c-txt-darkseagreen\:0 { color: hsl(120, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10, html.var.auto .sf-c-txt-darkseagreen\:10 { color: hsl(120, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20, html.var.auto .sf-c-txt-darkseagreen\:20 { color: hsl(120, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30, html.var.auto .sf-c-txt-darkseagreen\:30 { color: hsl(120, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40, html.var.auto .sf-c-txt-darkseagreen\:40 { color: hsl(120, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50, html.var.auto .sf-c-txt-darkseagreen\:50 { color: hsl(120, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60, html.var.auto .sf-c-txt-darkseagreen\:60 { color: hsl(120, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70, html.var.auto .sf-c-txt-darkseagreen\:70 { color: hsl(120, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80, html.var.auto .sf-c-txt-darkseagreen\:80 { color: hsl(120, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90, html.var.auto .sf-c-txt-darkseagreen\:90 { color: hsl(120, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100, html.var.auto .sf-c-txt-darkseagreen\:100 { color: hsl(120, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:dark, html.auto .sf-c-txt-darkseagreen\:dark { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0\:dark, html.auto .sf-c-txt-darkseagreen\:0\:dark { color: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10\:dark, html.auto .sf-c-txt-darkseagreen\:10\:dark { color: hsl(120, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20\:dark, html.auto .sf-c-txt-darkseagreen\:20\:dark { color: hsl(120, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30\:dark, html.auto .sf-c-txt-darkseagreen\:30\:dark { color: hsl(120, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40\:dark, html.auto .sf-c-txt-darkseagreen\:40\:dark { color: hsl(120, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50\:dark, html.auto .sf-c-txt-darkseagreen\:50\:dark { color: hsl(120, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60\:dark, html.auto .sf-c-txt-darkseagreen\:60\:dark { color: hsl(120, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70\:dark, html.auto .sf-c-txt-darkseagreen\:70\:dark { color: hsl(120, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80\:dark, html.auto .sf-c-txt-darkseagreen\:80\:dark { color: hsl(120, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90\:dark, html.auto .sf-c-txt-darkseagreen\:90\:dark { color: hsl(120, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100\:dark, html.auto .sf-c-txt-darkseagreen\:100\:dark { color: hsl(120, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:dark, html.var.auto .sf-c-txt-darkseagreen\:dark { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0\:dark, html.var.auto .sf-c-txt-darkseagreen\:0\:dark { color: hsl(120, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10\:dark, html.var.auto .sf-c-txt-darkseagreen\:10\:dark { color: hsl(120, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20\:dark, html.var.auto .sf-c-txt-darkseagreen\:20\:dark { color: hsl(120, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30\:dark, html.var.auto .sf-c-txt-darkseagreen\:30\:dark { color: hsl(120, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40\:dark, html.var.auto .sf-c-txt-darkseagreen\:40\:dark { color: hsl(120, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50\:dark, html.var.auto .sf-c-txt-darkseagreen\:50\:dark { color: hsl(120, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60\:dark, html.var.auto .sf-c-txt-darkseagreen\:60\:dark { color: hsl(120, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70\:dark, html.var.auto .sf-c-txt-darkseagreen\:70\:dark { color: hsl(120, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80\:dark, html.var.auto .sf-c-txt-darkseagreen\:80\:dark { color: hsl(120, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90\:dark, html.var.auto .sf-c-txt-darkseagreen\:90\:dark { color: hsl(120, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100\:dark, html.var.auto .sf-c-txt-darkseagreen\:100\:dark { color: hsl(120, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkslateblue.css b/src/colors/10/darkslateblue.css index c7e8bd5..d238214 100644 --- a/src/colors/10/darkslateblue.css +++ b/src/colors/10/darkslateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslateblue'] { --sf-c-darkslateblue: 248 39% 39%; --sf-c-darkslateblue-0: 248 39% 0%; --sf-c-darkslateblue-10: 248 39% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkslateblue\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslateblue\:90\:dark, html.var.auto .sf-c-darkslateblue\:90\:dark { color: hsl(248, 39%, 90%); background: hsl(248, 39%, 10%) } html.var[data-theme='auto'] .sf-c-darkslateblue\:100\:dark, html.var.auto .sf-c-darkslateblue\:100\:dark { color: hsl(248, 39%, 90%); background: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue, html.auto .sf-c-txt-darkslateblue { color: hsl(248, 39%, 39%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0, html.auto .sf-c-txt-darkslateblue\:0 { color: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10, html.auto .sf-c-txt-darkslateblue\:10 { color: hsl(248, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20, html.auto .sf-c-txt-darkslateblue\:20 { color: hsl(248, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30, html.auto .sf-c-txt-darkslateblue\:30 { color: hsl(248, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40, html.auto .sf-c-txt-darkslateblue\:40 { color: hsl(248, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50, html.auto .sf-c-txt-darkslateblue\:50 { color: hsl(248, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60, html.auto .sf-c-txt-darkslateblue\:60 { color: hsl(248, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70, html.auto .sf-c-txt-darkslateblue\:70 { color: hsl(248, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80, html.auto .sf-c-txt-darkslateblue\:80 { color: hsl(248, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90, html.auto .sf-c-txt-darkslateblue\:90 { color: hsl(248, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100, html.auto .sf-c-txt-darkslateblue\:100 { color: hsl(248, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue, html.var.auto .sf-c-txt-darkslateblue { color: hsl(248, 39%, 39%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0, html.var.auto .sf-c-txt-darkslateblue\:0 { color: hsl(248, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10, html.var.auto .sf-c-txt-darkslateblue\:10 { color: hsl(248, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20, html.var.auto .sf-c-txt-darkslateblue\:20 { color: hsl(248, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30, html.var.auto .sf-c-txt-darkslateblue\:30 { color: hsl(248, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40, html.var.auto .sf-c-txt-darkslateblue\:40 { color: hsl(248, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50, html.var.auto .sf-c-txt-darkslateblue\:50 { color: hsl(248, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60, html.var.auto .sf-c-txt-darkslateblue\:60 { color: hsl(248, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70, html.var.auto .sf-c-txt-darkslateblue\:70 { color: hsl(248, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80, html.var.auto .sf-c-txt-darkslateblue\:80 { color: hsl(248, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90, html.var.auto .sf-c-txt-darkslateblue\:90 { color: hsl(248, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100, html.var.auto .sf-c-txt-darkslateblue\:100 { color: hsl(248, 39%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:dark, html.auto .sf-c-txt-darkslateblue\:dark { color: hsl(248, 39%, 39%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0\:dark, html.auto .sf-c-txt-darkslateblue\:0\:dark { color: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10\:dark, html.auto .sf-c-txt-darkslateblue\:10\:dark { color: hsl(248, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20\:dark, html.auto .sf-c-txt-darkslateblue\:20\:dark { color: hsl(248, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30\:dark, html.auto .sf-c-txt-darkslateblue\:30\:dark { color: hsl(248, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40\:dark, html.auto .sf-c-txt-darkslateblue\:40\:dark { color: hsl(248, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50\:dark, html.auto .sf-c-txt-darkslateblue\:50\:dark { color: hsl(248, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60\:dark, html.auto .sf-c-txt-darkslateblue\:60\:dark { color: hsl(248, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70\:dark, html.auto .sf-c-txt-darkslateblue\:70\:dark { color: hsl(248, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80\:dark, html.auto .sf-c-txt-darkslateblue\:80\:dark { color: hsl(248, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90\:dark, html.auto .sf-c-txt-darkslateblue\:90\:dark { color: hsl(248, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100\:dark, html.auto .sf-c-txt-darkslateblue\:100\:dark { color: hsl(248, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:dark, html.var.auto .sf-c-txt-darkslateblue\:dark { color: hsl(248, 39%, 39%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0\:dark, html.var.auto .sf-c-txt-darkslateblue\:0\:dark { color: hsl(248, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10\:dark, html.var.auto .sf-c-txt-darkslateblue\:10\:dark { color: hsl(248, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20\:dark, html.var.auto .sf-c-txt-darkslateblue\:20\:dark { color: hsl(248, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30\:dark, html.var.auto .sf-c-txt-darkslateblue\:30\:dark { color: hsl(248, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40\:dark, html.var.auto .sf-c-txt-darkslateblue\:40\:dark { color: hsl(248, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50\:dark, html.var.auto .sf-c-txt-darkslateblue\:50\:dark { color: hsl(248, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60\:dark, html.var.auto .sf-c-txt-darkslateblue\:60\:dark { color: hsl(248, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70\:dark, html.var.auto .sf-c-txt-darkslateblue\:70\:dark { color: hsl(248, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80\:dark, html.var.auto .sf-c-txt-darkslateblue\:80\:dark { color: hsl(248, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90\:dark, html.var.auto .sf-c-txt-darkslateblue\:90\:dark { color: hsl(248, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100\:dark, html.var.auto .sf-c-txt-darkslateblue\:100\:dark { color: hsl(248, 39%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkslategray.css b/src/colors/10/darkslategray.css index c2ec8c2..bbd4d37 100644 --- a/src/colors/10/darkslategray.css +++ b/src/colors/10/darkslategray.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslategray'] { --sf-c-darkslategray: 180 25% 25%; --sf-c-darkslategray-0: 180 25% 0%; --sf-c-darkslategray-10: 180 25% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkslategray\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslategray\:90\:dark, html.var.auto .sf-c-darkslategray\:90\:dark { color: hsl(180, 25%, 90%); background: hsl(180, 25%, 10%) } html.var[data-theme='auto'] .sf-c-darkslategray\:100\:dark, html.var.auto .sf-c-darkslategray\:100\:dark { color: hsl(180, 25%, 90%); background: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray, html.auto .sf-c-txt-darkslategray { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0, html.auto .sf-c-txt-darkslategray\:0 { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10, html.auto .sf-c-txt-darkslategray\:10 { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20, html.auto .sf-c-txt-darkslategray\:20 { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30, html.auto .sf-c-txt-darkslategray\:30 { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40, html.auto .sf-c-txt-darkslategray\:40 { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50, html.auto .sf-c-txt-darkslategray\:50 { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60, html.auto .sf-c-txt-darkslategray\:60 { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70, html.auto .sf-c-txt-darkslategray\:70 { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80, html.auto .sf-c-txt-darkslategray\:80 { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90, html.auto .sf-c-txt-darkslategray\:90 { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100, html.auto .sf-c-txt-darkslategray\:100 { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray, html.var.auto .sf-c-txt-darkslategray { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0, html.var.auto .sf-c-txt-darkslategray\:0 { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10, html.var.auto .sf-c-txt-darkslategray\:10 { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20, html.var.auto .sf-c-txt-darkslategray\:20 { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30, html.var.auto .sf-c-txt-darkslategray\:30 { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40, html.var.auto .sf-c-txt-darkslategray\:40 { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50, html.var.auto .sf-c-txt-darkslategray\:50 { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60, html.var.auto .sf-c-txt-darkslategray\:60 { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70, html.var.auto .sf-c-txt-darkslategray\:70 { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80, html.var.auto .sf-c-txt-darkslategray\:80 { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90, html.var.auto .sf-c-txt-darkslategray\:90 { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100, html.var.auto .sf-c-txt-darkslategray\:100 { color: hsl(180, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:dark, html.auto .sf-c-txt-darkslategray\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0\:dark, html.auto .sf-c-txt-darkslategray\:0\:dark { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10\:dark, html.auto .sf-c-txt-darkslategray\:10\:dark { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20\:dark, html.auto .sf-c-txt-darkslategray\:20\:dark { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30\:dark, html.auto .sf-c-txt-darkslategray\:30\:dark { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40\:dark, html.auto .sf-c-txt-darkslategray\:40\:dark { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50\:dark, html.auto .sf-c-txt-darkslategray\:50\:dark { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60\:dark, html.auto .sf-c-txt-darkslategray\:60\:dark { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70\:dark, html.auto .sf-c-txt-darkslategray\:70\:dark { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80\:dark, html.auto .sf-c-txt-darkslategray\:80\:dark { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90\:dark, html.auto .sf-c-txt-darkslategray\:90\:dark { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100\:dark, html.auto .sf-c-txt-darkslategray\:100\:dark { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:dark, html.var.auto .sf-c-txt-darkslategray\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0\:dark, html.var.auto .sf-c-txt-darkslategray\:0\:dark { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10\:dark, html.var.auto .sf-c-txt-darkslategray\:10\:dark { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20\:dark, html.var.auto .sf-c-txt-darkslategray\:20\:dark { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30\:dark, html.var.auto .sf-c-txt-darkslategray\:30\:dark { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40\:dark, html.var.auto .sf-c-txt-darkslategray\:40\:dark { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50\:dark, html.var.auto .sf-c-txt-darkslategray\:50\:dark { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60\:dark, html.var.auto .sf-c-txt-darkslategray\:60\:dark { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70\:dark, html.var.auto .sf-c-txt-darkslategray\:70\:dark { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80\:dark, html.var.auto .sf-c-txt-darkslategray\:80\:dark { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90\:dark, html.var.auto .sf-c-txt-darkslategray\:90\:dark { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100\:dark, html.var.auto .sf-c-txt-darkslategray\:100\:dark { color: hsl(180, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkslategrey.css b/src/colors/10/darkslategrey.css index f7dda49..65987ad 100644 --- a/src/colors/10/darkslategrey.css +++ b/src/colors/10/darkslategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslategrey'] { --sf-c-darkslategrey: 180 25% 25%; --sf-c-darkslategrey-0: 180 25% 0%; --sf-c-darkslategrey-10: 180 25% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkslategrey\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslategrey\:90\:dark, html.var.auto .sf-c-darkslategrey\:90\:dark { color: hsl(180, 25%, 90%); background: hsl(180, 25%, 10%) } html.var[data-theme='auto'] .sf-c-darkslategrey\:100\:dark, html.var.auto .sf-c-darkslategrey\:100\:dark { color: hsl(180, 25%, 90%); background: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey, html.auto .sf-c-txt-darkslategrey { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0, html.auto .sf-c-txt-darkslategrey\:0 { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10, html.auto .sf-c-txt-darkslategrey\:10 { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20, html.auto .sf-c-txt-darkslategrey\:20 { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30, html.auto .sf-c-txt-darkslategrey\:30 { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40, html.auto .sf-c-txt-darkslategrey\:40 { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50, html.auto .sf-c-txt-darkslategrey\:50 { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60, html.auto .sf-c-txt-darkslategrey\:60 { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70, html.auto .sf-c-txt-darkslategrey\:70 { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80, html.auto .sf-c-txt-darkslategrey\:80 { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90, html.auto .sf-c-txt-darkslategrey\:90 { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100, html.auto .sf-c-txt-darkslategrey\:100 { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey, html.var.auto .sf-c-txt-darkslategrey { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0, html.var.auto .sf-c-txt-darkslategrey\:0 { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10, html.var.auto .sf-c-txt-darkslategrey\:10 { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20, html.var.auto .sf-c-txt-darkslategrey\:20 { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30, html.var.auto .sf-c-txt-darkslategrey\:30 { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40, html.var.auto .sf-c-txt-darkslategrey\:40 { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50, html.var.auto .sf-c-txt-darkslategrey\:50 { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60, html.var.auto .sf-c-txt-darkslategrey\:60 { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70, html.var.auto .sf-c-txt-darkslategrey\:70 { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80, html.var.auto .sf-c-txt-darkslategrey\:80 { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90, html.var.auto .sf-c-txt-darkslategrey\:90 { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100, html.var.auto .sf-c-txt-darkslategrey\:100 { color: hsl(180, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:dark, html.auto .sf-c-txt-darkslategrey\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0\:dark, html.auto .sf-c-txt-darkslategrey\:0\:dark { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10\:dark, html.auto .sf-c-txt-darkslategrey\:10\:dark { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20\:dark, html.auto .sf-c-txt-darkslategrey\:20\:dark { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30\:dark, html.auto .sf-c-txt-darkslategrey\:30\:dark { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40\:dark, html.auto .sf-c-txt-darkslategrey\:40\:dark { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50\:dark, html.auto .sf-c-txt-darkslategrey\:50\:dark { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60\:dark, html.auto .sf-c-txt-darkslategrey\:60\:dark { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70\:dark, html.auto .sf-c-txt-darkslategrey\:70\:dark { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80\:dark, html.auto .sf-c-txt-darkslategrey\:80\:dark { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90\:dark, html.auto .sf-c-txt-darkslategrey\:90\:dark { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100\:dark, html.auto .sf-c-txt-darkslategrey\:100\:dark { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:dark, html.var.auto .sf-c-txt-darkslategrey\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0\:dark, html.var.auto .sf-c-txt-darkslategrey\:0\:dark { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10\:dark, html.var.auto .sf-c-txt-darkslategrey\:10\:dark { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20\:dark, html.var.auto .sf-c-txt-darkslategrey\:20\:dark { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30\:dark, html.var.auto .sf-c-txt-darkslategrey\:30\:dark { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40\:dark, html.var.auto .sf-c-txt-darkslategrey\:40\:dark { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50\:dark, html.var.auto .sf-c-txt-darkslategrey\:50\:dark { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60\:dark, html.var.auto .sf-c-txt-darkslategrey\:60\:dark { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70\:dark, html.var.auto .sf-c-txt-darkslategrey\:70\:dark { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80\:dark, html.var.auto .sf-c-txt-darkslategrey\:80\:dark { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90\:dark, html.var.auto .sf-c-txt-darkslategrey\:90\:dark { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100\:dark, html.var.auto .sf-c-txt-darkslategrey\:100\:dark { color: hsl(180, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkturquoise.css b/src/colors/10/darkturquoise.css index 09df8a0..be10bc5 100644 --- a/src/colors/10/darkturquoise.css +++ b/src/colors/10/darkturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='darkturquoise'] { --sf-c-darkturquoise: 181 100% 41%; --sf-c-darkturquoise-0: 181 100% 0%; --sf-c-darkturquoise-10: 181 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkturquoise\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkturquoise\:90\:dark, html.var.auto .sf-c-darkturquoise\:90\:dark { color: hsl(181, 100%, 90%); background: hsl(181, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkturquoise\:100\:dark, html.var.auto .sf-c-darkturquoise\:100\:dark { color: hsl(181, 100%, 90%); background: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise, html.auto .sf-c-txt-darkturquoise { color: hsl(181, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0, html.auto .sf-c-txt-darkturquoise\:0 { color: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10, html.auto .sf-c-txt-darkturquoise\:10 { color: hsl(181, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20, html.auto .sf-c-txt-darkturquoise\:20 { color: hsl(181, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30, html.auto .sf-c-txt-darkturquoise\:30 { color: hsl(181, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40, html.auto .sf-c-txt-darkturquoise\:40 { color: hsl(181, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50, html.auto .sf-c-txt-darkturquoise\:50 { color: hsl(181, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60, html.auto .sf-c-txt-darkturquoise\:60 { color: hsl(181, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70, html.auto .sf-c-txt-darkturquoise\:70 { color: hsl(181, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80, html.auto .sf-c-txt-darkturquoise\:80 { color: hsl(181, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90, html.auto .sf-c-txt-darkturquoise\:90 { color: hsl(181, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100, html.auto .sf-c-txt-darkturquoise\:100 { color: hsl(181, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise, html.var.auto .sf-c-txt-darkturquoise { color: hsl(181, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0, html.var.auto .sf-c-txt-darkturquoise\:0 { color: hsl(181, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10, html.var.auto .sf-c-txt-darkturquoise\:10 { color: hsl(181, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20, html.var.auto .sf-c-txt-darkturquoise\:20 { color: hsl(181, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30, html.var.auto .sf-c-txt-darkturquoise\:30 { color: hsl(181, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40, html.var.auto .sf-c-txt-darkturquoise\:40 { color: hsl(181, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50, html.var.auto .sf-c-txt-darkturquoise\:50 { color: hsl(181, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60, html.var.auto .sf-c-txt-darkturquoise\:60 { color: hsl(181, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70, html.var.auto .sf-c-txt-darkturquoise\:70 { color: hsl(181, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80, html.var.auto .sf-c-txt-darkturquoise\:80 { color: hsl(181, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90, html.var.auto .sf-c-txt-darkturquoise\:90 { color: hsl(181, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100, html.var.auto .sf-c-txt-darkturquoise\:100 { color: hsl(181, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:dark, html.auto .sf-c-txt-darkturquoise\:dark { color: hsl(181, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0\:dark, html.auto .sf-c-txt-darkturquoise\:0\:dark { color: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10\:dark, html.auto .sf-c-txt-darkturquoise\:10\:dark { color: hsl(181, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20\:dark, html.auto .sf-c-txt-darkturquoise\:20\:dark { color: hsl(181, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30\:dark, html.auto .sf-c-txt-darkturquoise\:30\:dark { color: hsl(181, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40\:dark, html.auto .sf-c-txt-darkturquoise\:40\:dark { color: hsl(181, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50\:dark, html.auto .sf-c-txt-darkturquoise\:50\:dark { color: hsl(181, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60\:dark, html.auto .sf-c-txt-darkturquoise\:60\:dark { color: hsl(181, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70\:dark, html.auto .sf-c-txt-darkturquoise\:70\:dark { color: hsl(181, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80\:dark, html.auto .sf-c-txt-darkturquoise\:80\:dark { color: hsl(181, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90\:dark, html.auto .sf-c-txt-darkturquoise\:90\:dark { color: hsl(181, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100\:dark, html.auto .sf-c-txt-darkturquoise\:100\:dark { color: hsl(181, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:dark, html.var.auto .sf-c-txt-darkturquoise\:dark { color: hsl(181, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0\:dark, html.var.auto .sf-c-txt-darkturquoise\:0\:dark { color: hsl(181, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10\:dark, html.var.auto .sf-c-txt-darkturquoise\:10\:dark { color: hsl(181, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20\:dark, html.var.auto .sf-c-txt-darkturquoise\:20\:dark { color: hsl(181, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30\:dark, html.var.auto .sf-c-txt-darkturquoise\:30\:dark { color: hsl(181, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40\:dark, html.var.auto .sf-c-txt-darkturquoise\:40\:dark { color: hsl(181, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50\:dark, html.var.auto .sf-c-txt-darkturquoise\:50\:dark { color: hsl(181, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60\:dark, html.var.auto .sf-c-txt-darkturquoise\:60\:dark { color: hsl(181, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70\:dark, html.var.auto .sf-c-txt-darkturquoise\:70\:dark { color: hsl(181, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80\:dark, html.var.auto .sf-c-txt-darkturquoise\:80\:dark { color: hsl(181, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90\:dark, html.var.auto .sf-c-txt-darkturquoise\:90\:dark { color: hsl(181, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100\:dark, html.var.auto .sf-c-txt-darkturquoise\:100\:dark { color: hsl(181, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/darkviolet.css b/src/colors/10/darkviolet.css index 5daf6c0..da1c05a 100644 --- a/src/colors/10/darkviolet.css +++ b/src/colors/10/darkviolet.css @@ -1,4 +1,4 @@ -:root { +[class*='darkviolet'] { --sf-c-darkviolet: 282 100% 41%; --sf-c-darkviolet-0: 282 100% 0%; --sf-c-darkviolet-10: 282 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-darkviolet\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkviolet\:90\:dark, html.var.auto .sf-c-darkviolet\:90\:dark { color: hsl(282, 100%, 90%); background: hsl(282, 100%, 10%) } html.var[data-theme='auto'] .sf-c-darkviolet\:100\:dark, html.var.auto .sf-c-darkviolet\:100\:dark { color: hsl(282, 100%, 90%); background: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet, html.auto .sf-c-txt-darkviolet { color: hsl(282, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0, html.auto .sf-c-txt-darkviolet\:0 { color: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10, html.auto .sf-c-txt-darkviolet\:10 { color: hsl(282, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20, html.auto .sf-c-txt-darkviolet\:20 { color: hsl(282, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30, html.auto .sf-c-txt-darkviolet\:30 { color: hsl(282, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40, html.auto .sf-c-txt-darkviolet\:40 { color: hsl(282, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50, html.auto .sf-c-txt-darkviolet\:50 { color: hsl(282, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60, html.auto .sf-c-txt-darkviolet\:60 { color: hsl(282, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70, html.auto .sf-c-txt-darkviolet\:70 { color: hsl(282, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80, html.auto .sf-c-txt-darkviolet\:80 { color: hsl(282, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90, html.auto .sf-c-txt-darkviolet\:90 { color: hsl(282, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100, html.auto .sf-c-txt-darkviolet\:100 { color: hsl(282, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet, html.var.auto .sf-c-txt-darkviolet { color: hsl(282, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0, html.var.auto .sf-c-txt-darkviolet\:0 { color: hsl(282, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10, html.var.auto .sf-c-txt-darkviolet\:10 { color: hsl(282, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20, html.var.auto .sf-c-txt-darkviolet\:20 { color: hsl(282, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30, html.var.auto .sf-c-txt-darkviolet\:30 { color: hsl(282, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40, html.var.auto .sf-c-txt-darkviolet\:40 { color: hsl(282, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50, html.var.auto .sf-c-txt-darkviolet\:50 { color: hsl(282, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60, html.var.auto .sf-c-txt-darkviolet\:60 { color: hsl(282, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70, html.var.auto .sf-c-txt-darkviolet\:70 { color: hsl(282, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80, html.var.auto .sf-c-txt-darkviolet\:80 { color: hsl(282, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90, html.var.auto .sf-c-txt-darkviolet\:90 { color: hsl(282, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100, html.var.auto .sf-c-txt-darkviolet\:100 { color: hsl(282, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:dark, html.auto .sf-c-txt-darkviolet\:dark { color: hsl(282, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0\:dark, html.auto .sf-c-txt-darkviolet\:0\:dark { color: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10\:dark, html.auto .sf-c-txt-darkviolet\:10\:dark { color: hsl(282, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20\:dark, html.auto .sf-c-txt-darkviolet\:20\:dark { color: hsl(282, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30\:dark, html.auto .sf-c-txt-darkviolet\:30\:dark { color: hsl(282, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40\:dark, html.auto .sf-c-txt-darkviolet\:40\:dark { color: hsl(282, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50\:dark, html.auto .sf-c-txt-darkviolet\:50\:dark { color: hsl(282, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60\:dark, html.auto .sf-c-txt-darkviolet\:60\:dark { color: hsl(282, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70\:dark, html.auto .sf-c-txt-darkviolet\:70\:dark { color: hsl(282, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80\:dark, html.auto .sf-c-txt-darkviolet\:80\:dark { color: hsl(282, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90\:dark, html.auto .sf-c-txt-darkviolet\:90\:dark { color: hsl(282, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100\:dark, html.auto .sf-c-txt-darkviolet\:100\:dark { color: hsl(282, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:dark, html.var.auto .sf-c-txt-darkviolet\:dark { color: hsl(282, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0\:dark, html.var.auto .sf-c-txt-darkviolet\:0\:dark { color: hsl(282, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10\:dark, html.var.auto .sf-c-txt-darkviolet\:10\:dark { color: hsl(282, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20\:dark, html.var.auto .sf-c-txt-darkviolet\:20\:dark { color: hsl(282, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30\:dark, html.var.auto .sf-c-txt-darkviolet\:30\:dark { color: hsl(282, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40\:dark, html.var.auto .sf-c-txt-darkviolet\:40\:dark { color: hsl(282, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50\:dark, html.var.auto .sf-c-txt-darkviolet\:50\:dark { color: hsl(282, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60\:dark, html.var.auto .sf-c-txt-darkviolet\:60\:dark { color: hsl(282, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70\:dark, html.var.auto .sf-c-txt-darkviolet\:70\:dark { color: hsl(282, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80\:dark, html.var.auto .sf-c-txt-darkviolet\:80\:dark { color: hsl(282, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90\:dark, html.var.auto .sf-c-txt-darkviolet\:90\:dark { color: hsl(282, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100\:dark, html.var.auto .sf-c-txt-darkviolet\:100\:dark { color: hsl(282, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/deeppink.css b/src/colors/10/deeppink.css index 376404f..5165ac7 100644 --- a/src/colors/10/deeppink.css +++ b/src/colors/10/deeppink.css @@ -1,4 +1,4 @@ -:root { +[class*='deeppink'] { --sf-c-deeppink: 328 100% 54%; --sf-c-deeppink-0: 328 100% 0%; --sf-c-deeppink-10: 328 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-deeppink\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-deeppink\:90\:dark, html.var.auto .sf-c-deeppink\:90\:dark { color: hsl(328, 100%, 90%); background: hsl(328, 100%, 10%) } html.var[data-theme='auto'] .sf-c-deeppink\:100\:dark, html.var.auto .sf-c-deeppink\:100\:dark { color: hsl(328, 100%, 90%); background: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink, html.auto .sf-c-txt-deeppink { color: hsl(328, 100%, 54%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:0, html.auto .sf-c-txt-deeppink\:0 { color: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:10, html.auto .sf-c-txt-deeppink\:10 { color: hsl(328, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:20, html.auto .sf-c-txt-deeppink\:20 { color: hsl(328, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:30, html.auto .sf-c-txt-deeppink\:30 { color: hsl(328, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:40, html.auto .sf-c-txt-deeppink\:40 { color: hsl(328, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:50, html.auto .sf-c-txt-deeppink\:50 { color: hsl(328, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:60, html.auto .sf-c-txt-deeppink\:60 { color: hsl(328, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:70, html.auto .sf-c-txt-deeppink\:70 { color: hsl(328, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:80, html.auto .sf-c-txt-deeppink\:80 { color: hsl(328, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:90, html.auto .sf-c-txt-deeppink\:90 { color: hsl(328, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:100, html.auto .sf-c-txt-deeppink\:100 { color: hsl(328, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink, html.var.auto .sf-c-txt-deeppink { color: hsl(328, 100%, 54%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:0, html.var.auto .sf-c-txt-deeppink\:0 { color: hsl(328, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:10, html.var.auto .sf-c-txt-deeppink\:10 { color: hsl(328, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:20, html.var.auto .sf-c-txt-deeppink\:20 { color: hsl(328, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:30, html.var.auto .sf-c-txt-deeppink\:30 { color: hsl(328, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:40, html.var.auto .sf-c-txt-deeppink\:40 { color: hsl(328, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:50, html.var.auto .sf-c-txt-deeppink\:50 { color: hsl(328, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:60, html.var.auto .sf-c-txt-deeppink\:60 { color: hsl(328, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:70, html.var.auto .sf-c-txt-deeppink\:70 { color: hsl(328, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:80, html.var.auto .sf-c-txt-deeppink\:80 { color: hsl(328, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:90, html.var.auto .sf-c-txt-deeppink\:90 { color: hsl(328, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:100, html.var.auto .sf-c-txt-deeppink\:100 { color: hsl(328, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:dark, html.auto .sf-c-txt-deeppink\:dark { color: hsl(328, 100%, 54%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:0\:dark, html.auto .sf-c-txt-deeppink\:0\:dark { color: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:10\:dark, html.auto .sf-c-txt-deeppink\:10\:dark { color: hsl(328, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:20\:dark, html.auto .sf-c-txt-deeppink\:20\:dark { color: hsl(328, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:30\:dark, html.auto .sf-c-txt-deeppink\:30\:dark { color: hsl(328, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:40\:dark, html.auto .sf-c-txt-deeppink\:40\:dark { color: hsl(328, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:50\:dark, html.auto .sf-c-txt-deeppink\:50\:dark { color: hsl(328, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:60\:dark, html.auto .sf-c-txt-deeppink\:60\:dark { color: hsl(328, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:70\:dark, html.auto .sf-c-txt-deeppink\:70\:dark { color: hsl(328, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:80\:dark, html.auto .sf-c-txt-deeppink\:80\:dark { color: hsl(328, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:90\:dark, html.auto .sf-c-txt-deeppink\:90\:dark { color: hsl(328, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:100\:dark, html.auto .sf-c-txt-deeppink\:100\:dark { color: hsl(328, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:dark, html.var.auto .sf-c-txt-deeppink\:dark { color: hsl(328, 100%, 54%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:0\:dark, html.var.auto .sf-c-txt-deeppink\:0\:dark { color: hsl(328, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:10\:dark, html.var.auto .sf-c-txt-deeppink\:10\:dark { color: hsl(328, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:20\:dark, html.var.auto .sf-c-txt-deeppink\:20\:dark { color: hsl(328, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:30\:dark, html.var.auto .sf-c-txt-deeppink\:30\:dark { color: hsl(328, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:40\:dark, html.var.auto .sf-c-txt-deeppink\:40\:dark { color: hsl(328, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:50\:dark, html.var.auto .sf-c-txt-deeppink\:50\:dark { color: hsl(328, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:60\:dark, html.var.auto .sf-c-txt-deeppink\:60\:dark { color: hsl(328, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:70\:dark, html.var.auto .sf-c-txt-deeppink\:70\:dark { color: hsl(328, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:80\:dark, html.var.auto .sf-c-txt-deeppink\:80\:dark { color: hsl(328, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:90\:dark, html.var.auto .sf-c-txt-deeppink\:90\:dark { color: hsl(328, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:100\:dark, html.var.auto .sf-c-txt-deeppink\:100\:dark { color: hsl(328, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/deepskyblue.css b/src/colors/10/deepskyblue.css index ede7fb9..fc87e94 100644 --- a/src/colors/10/deepskyblue.css +++ b/src/colors/10/deepskyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='deepskyblue'] { --sf-c-deepskyblue: 195 100% 50%; --sf-c-deepskyblue-0: 195 100% 0%; --sf-c-deepskyblue-10: 195 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-deepskyblue\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-deepskyblue\:90\:dark, html.var.auto .sf-c-deepskyblue\:90\:dark { color: hsl(195, 100%, 90%); background: hsl(195, 100%, 10%) } html.var[data-theme='auto'] .sf-c-deepskyblue\:100\:dark, html.var.auto .sf-c-deepskyblue\:100\:dark { color: hsl(195, 100%, 90%); background: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue, html.auto .sf-c-txt-deepskyblue { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0, html.auto .sf-c-txt-deepskyblue\:0 { color: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10, html.auto .sf-c-txt-deepskyblue\:10 { color: hsl(195, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20, html.auto .sf-c-txt-deepskyblue\:20 { color: hsl(195, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30, html.auto .sf-c-txt-deepskyblue\:30 { color: hsl(195, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40, html.auto .sf-c-txt-deepskyblue\:40 { color: hsl(195, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50, html.auto .sf-c-txt-deepskyblue\:50 { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60, html.auto .sf-c-txt-deepskyblue\:60 { color: hsl(195, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70, html.auto .sf-c-txt-deepskyblue\:70 { color: hsl(195, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80, html.auto .sf-c-txt-deepskyblue\:80 { color: hsl(195, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90, html.auto .sf-c-txt-deepskyblue\:90 { color: hsl(195, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100, html.auto .sf-c-txt-deepskyblue\:100 { color: hsl(195, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue, html.var.auto .sf-c-txt-deepskyblue { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0, html.var.auto .sf-c-txt-deepskyblue\:0 { color: hsl(195, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10, html.var.auto .sf-c-txt-deepskyblue\:10 { color: hsl(195, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20, html.var.auto .sf-c-txt-deepskyblue\:20 { color: hsl(195, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30, html.var.auto .sf-c-txt-deepskyblue\:30 { color: hsl(195, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40, html.var.auto .sf-c-txt-deepskyblue\:40 { color: hsl(195, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50, html.var.auto .sf-c-txt-deepskyblue\:50 { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60, html.var.auto .sf-c-txt-deepskyblue\:60 { color: hsl(195, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70, html.var.auto .sf-c-txt-deepskyblue\:70 { color: hsl(195, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80, html.var.auto .sf-c-txt-deepskyblue\:80 { color: hsl(195, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90, html.var.auto .sf-c-txt-deepskyblue\:90 { color: hsl(195, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100, html.var.auto .sf-c-txt-deepskyblue\:100 { color: hsl(195, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:dark, html.auto .sf-c-txt-deepskyblue\:dark { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0\:dark, html.auto .sf-c-txt-deepskyblue\:0\:dark { color: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10\:dark, html.auto .sf-c-txt-deepskyblue\:10\:dark { color: hsl(195, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20\:dark, html.auto .sf-c-txt-deepskyblue\:20\:dark { color: hsl(195, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30\:dark, html.auto .sf-c-txt-deepskyblue\:30\:dark { color: hsl(195, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40\:dark, html.auto .sf-c-txt-deepskyblue\:40\:dark { color: hsl(195, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50\:dark, html.auto .sf-c-txt-deepskyblue\:50\:dark { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60\:dark, html.auto .sf-c-txt-deepskyblue\:60\:dark { color: hsl(195, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70\:dark, html.auto .sf-c-txt-deepskyblue\:70\:dark { color: hsl(195, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80\:dark, html.auto .sf-c-txt-deepskyblue\:80\:dark { color: hsl(195, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90\:dark, html.auto .sf-c-txt-deepskyblue\:90\:dark { color: hsl(195, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100\:dark, html.auto .sf-c-txt-deepskyblue\:100\:dark { color: hsl(195, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:dark, html.var.auto .sf-c-txt-deepskyblue\:dark { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0\:dark, html.var.auto .sf-c-txt-deepskyblue\:0\:dark { color: hsl(195, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10\:dark, html.var.auto .sf-c-txt-deepskyblue\:10\:dark { color: hsl(195, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20\:dark, html.var.auto .sf-c-txt-deepskyblue\:20\:dark { color: hsl(195, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30\:dark, html.var.auto .sf-c-txt-deepskyblue\:30\:dark { color: hsl(195, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40\:dark, html.var.auto .sf-c-txt-deepskyblue\:40\:dark { color: hsl(195, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50\:dark, html.var.auto .sf-c-txt-deepskyblue\:50\:dark { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60\:dark, html.var.auto .sf-c-txt-deepskyblue\:60\:dark { color: hsl(195, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70\:dark, html.var.auto .sf-c-txt-deepskyblue\:70\:dark { color: hsl(195, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80\:dark, html.var.auto .sf-c-txt-deepskyblue\:80\:dark { color: hsl(195, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90\:dark, html.var.auto .sf-c-txt-deepskyblue\:90\:dark { color: hsl(195, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100\:dark, html.var.auto .sf-c-txt-deepskyblue\:100\:dark { color: hsl(195, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/dimgray.css b/src/colors/10/dimgray.css index 2257235..8d8ef2c 100644 --- a/src/colors/10/dimgray.css +++ b/src/colors/10/dimgray.css @@ -1,4 +1,4 @@ -:root { +[class*='dimgray'] { --sf-c-dimgray: 0 0% 41%; --sf-c-dimgray-0: 0 0% 0%; --sf-c-dimgray-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-dimgray\:100\:dark, html.dark .sf-c-txt-di html.var[data-theme='auto'] .sf-c-dimgray\:90\:dark, html.var.auto .sf-c-dimgray\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-dimgray\:100\:dark, html.var.auto .sf-c-dimgray\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray, html.auto .sf-c-txt-dimgray { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:0, html.auto .sf-c-txt-dimgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:10, html.auto .sf-c-txt-dimgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:20, html.auto .sf-c-txt-dimgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:30, html.auto .sf-c-txt-dimgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:40, html.auto .sf-c-txt-dimgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:50, html.auto .sf-c-txt-dimgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:60, html.auto .sf-c-txt-dimgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:70, html.auto .sf-c-txt-dimgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:80, html.auto .sf-c-txt-dimgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:90, html.auto .sf-c-txt-dimgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:100, html.auto .sf-c-txt-dimgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray, html.var.auto .sf-c-txt-dimgray { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:0, html.var.auto .sf-c-txt-dimgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:10, html.var.auto .sf-c-txt-dimgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:20, html.var.auto .sf-c-txt-dimgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:30, html.var.auto .sf-c-txt-dimgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:40, html.var.auto .sf-c-txt-dimgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:50, html.var.auto .sf-c-txt-dimgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:60, html.var.auto .sf-c-txt-dimgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:70, html.var.auto .sf-c-txt-dimgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:80, html.var.auto .sf-c-txt-dimgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:90, html.var.auto .sf-c-txt-dimgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:100, html.var.auto .sf-c-txt-dimgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:dark, html.auto .sf-c-txt-dimgray\:dark { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:0\:dark, html.auto .sf-c-txt-dimgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:10\:dark, html.auto .sf-c-txt-dimgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:20\:dark, html.auto .sf-c-txt-dimgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:30\:dark, html.auto .sf-c-txt-dimgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:40\:dark, html.auto .sf-c-txt-dimgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:50\:dark, html.auto .sf-c-txt-dimgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:60\:dark, html.auto .sf-c-txt-dimgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:70\:dark, html.auto .sf-c-txt-dimgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:80\:dark, html.auto .sf-c-txt-dimgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:90\:dark, html.auto .sf-c-txt-dimgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:100\:dark, html.auto .sf-c-txt-dimgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:dark, html.var.auto .sf-c-txt-dimgray\:dark { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:0\:dark, html.var.auto .sf-c-txt-dimgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:10\:dark, html.var.auto .sf-c-txt-dimgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:20\:dark, html.var.auto .sf-c-txt-dimgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:30\:dark, html.var.auto .sf-c-txt-dimgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:40\:dark, html.var.auto .sf-c-txt-dimgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:50\:dark, html.var.auto .sf-c-txt-dimgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:60\:dark, html.var.auto .sf-c-txt-dimgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:70\:dark, html.var.auto .sf-c-txt-dimgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:80\:dark, html.var.auto .sf-c-txt-dimgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:90\:dark, html.var.auto .sf-c-txt-dimgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:100\:dark, html.var.auto .sf-c-txt-dimgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/dimgrey.css b/src/colors/10/dimgrey.css index ad880d9..4380d42 100644 --- a/src/colors/10/dimgrey.css +++ b/src/colors/10/dimgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='dimgrey'] { --sf-c-dimgrey: 0 0% 41%; --sf-c-dimgrey-0: 0 0% 0%; --sf-c-dimgrey-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-dimgrey\:100\:dark, html.dark .sf-c-txt-di html.var[data-theme='auto'] .sf-c-dimgrey\:90\:dark, html.var.auto .sf-c-dimgrey\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-dimgrey\:100\:dark, html.var.auto .sf-c-dimgrey\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey, html.auto .sf-c-txt-dimgrey { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0, html.auto .sf-c-txt-dimgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10, html.auto .sf-c-txt-dimgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20, html.auto .sf-c-txt-dimgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30, html.auto .sf-c-txt-dimgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40, html.auto .sf-c-txt-dimgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50, html.auto .sf-c-txt-dimgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60, html.auto .sf-c-txt-dimgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70, html.auto .sf-c-txt-dimgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80, html.auto .sf-c-txt-dimgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90, html.auto .sf-c-txt-dimgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100, html.auto .sf-c-txt-dimgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey, html.var.auto .sf-c-txt-dimgrey { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0, html.var.auto .sf-c-txt-dimgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10, html.var.auto .sf-c-txt-dimgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20, html.var.auto .sf-c-txt-dimgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30, html.var.auto .sf-c-txt-dimgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40, html.var.auto .sf-c-txt-dimgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50, html.var.auto .sf-c-txt-dimgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60, html.var.auto .sf-c-txt-dimgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70, html.var.auto .sf-c-txt-dimgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80, html.var.auto .sf-c-txt-dimgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90, html.var.auto .sf-c-txt-dimgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100, html.var.auto .sf-c-txt-dimgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:dark, html.auto .sf-c-txt-dimgrey\:dark { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0\:dark, html.auto .sf-c-txt-dimgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10\:dark, html.auto .sf-c-txt-dimgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20\:dark, html.auto .sf-c-txt-dimgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30\:dark, html.auto .sf-c-txt-dimgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40\:dark, html.auto .sf-c-txt-dimgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50\:dark, html.auto .sf-c-txt-dimgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60\:dark, html.auto .sf-c-txt-dimgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70\:dark, html.auto .sf-c-txt-dimgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80\:dark, html.auto .sf-c-txt-dimgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90\:dark, html.auto .sf-c-txt-dimgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100\:dark, html.auto .sf-c-txt-dimgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:dark, html.var.auto .sf-c-txt-dimgrey\:dark { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0\:dark, html.var.auto .sf-c-txt-dimgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10\:dark, html.var.auto .sf-c-txt-dimgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20\:dark, html.var.auto .sf-c-txt-dimgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30\:dark, html.var.auto .sf-c-txt-dimgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40\:dark, html.var.auto .sf-c-txt-dimgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50\:dark, html.var.auto .sf-c-txt-dimgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60\:dark, html.var.auto .sf-c-txt-dimgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70\:dark, html.var.auto .sf-c-txt-dimgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80\:dark, html.var.auto .sf-c-txt-dimgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90\:dark, html.var.auto .sf-c-txt-dimgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100\:dark, html.var.auto .sf-c-txt-dimgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/dodgerblue.css b/src/colors/10/dodgerblue.css index ebe09a2..0bf39a9 100644 --- a/src/colors/10/dodgerblue.css +++ b/src/colors/10/dodgerblue.css @@ -1,4 +1,4 @@ -:root { +[class*='dodgerblue'] { --sf-c-dodgerblue: 210 100% 56%; --sf-c-dodgerblue-0: 210 100% 0%; --sf-c-dodgerblue-10: 210 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-dodgerblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-dodgerblue\:90\:dark, html.var.auto .sf-c-dodgerblue\:90\:dark { color: hsl(210, 100%, 90%); background: hsl(210, 100%, 10%) } html.var[data-theme='auto'] .sf-c-dodgerblue\:100\:dark, html.var.auto .sf-c-dodgerblue\:100\:dark { color: hsl(210, 100%, 90%); background: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue, html.auto .sf-c-txt-dodgerblue { color: hsl(210, 100%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0, html.auto .sf-c-txt-dodgerblue\:0 { color: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10, html.auto .sf-c-txt-dodgerblue\:10 { color: hsl(210, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20, html.auto .sf-c-txt-dodgerblue\:20 { color: hsl(210, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30, html.auto .sf-c-txt-dodgerblue\:30 { color: hsl(210, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40, html.auto .sf-c-txt-dodgerblue\:40 { color: hsl(210, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50, html.auto .sf-c-txt-dodgerblue\:50 { color: hsl(210, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60, html.auto .sf-c-txt-dodgerblue\:60 { color: hsl(210, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70, html.auto .sf-c-txt-dodgerblue\:70 { color: hsl(210, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80, html.auto .sf-c-txt-dodgerblue\:80 { color: hsl(210, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90, html.auto .sf-c-txt-dodgerblue\:90 { color: hsl(210, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100, html.auto .sf-c-txt-dodgerblue\:100 { color: hsl(210, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue, html.var.auto .sf-c-txt-dodgerblue { color: hsl(210, 100%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0, html.var.auto .sf-c-txt-dodgerblue\:0 { color: hsl(210, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10, html.var.auto .sf-c-txt-dodgerblue\:10 { color: hsl(210, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20, html.var.auto .sf-c-txt-dodgerblue\:20 { color: hsl(210, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30, html.var.auto .sf-c-txt-dodgerblue\:30 { color: hsl(210, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40, html.var.auto .sf-c-txt-dodgerblue\:40 { color: hsl(210, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50, html.var.auto .sf-c-txt-dodgerblue\:50 { color: hsl(210, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60, html.var.auto .sf-c-txt-dodgerblue\:60 { color: hsl(210, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70, html.var.auto .sf-c-txt-dodgerblue\:70 { color: hsl(210, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80, html.var.auto .sf-c-txt-dodgerblue\:80 { color: hsl(210, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90, html.var.auto .sf-c-txt-dodgerblue\:90 { color: hsl(210, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100, html.var.auto .sf-c-txt-dodgerblue\:100 { color: hsl(210, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:dark, html.auto .sf-c-txt-dodgerblue\:dark { color: hsl(210, 100%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0\:dark, html.auto .sf-c-txt-dodgerblue\:0\:dark { color: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10\:dark, html.auto .sf-c-txt-dodgerblue\:10\:dark { color: hsl(210, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20\:dark, html.auto .sf-c-txt-dodgerblue\:20\:dark { color: hsl(210, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30\:dark, html.auto .sf-c-txt-dodgerblue\:30\:dark { color: hsl(210, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40\:dark, html.auto .sf-c-txt-dodgerblue\:40\:dark { color: hsl(210, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50\:dark, html.auto .sf-c-txt-dodgerblue\:50\:dark { color: hsl(210, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60\:dark, html.auto .sf-c-txt-dodgerblue\:60\:dark { color: hsl(210, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70\:dark, html.auto .sf-c-txt-dodgerblue\:70\:dark { color: hsl(210, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80\:dark, html.auto .sf-c-txt-dodgerblue\:80\:dark { color: hsl(210, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90\:dark, html.auto .sf-c-txt-dodgerblue\:90\:dark { color: hsl(210, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100\:dark, html.auto .sf-c-txt-dodgerblue\:100\:dark { color: hsl(210, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:dark, html.var.auto .sf-c-txt-dodgerblue\:dark { color: hsl(210, 100%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0\:dark, html.var.auto .sf-c-txt-dodgerblue\:0\:dark { color: hsl(210, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10\:dark, html.var.auto .sf-c-txt-dodgerblue\:10\:dark { color: hsl(210, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20\:dark, html.var.auto .sf-c-txt-dodgerblue\:20\:dark { color: hsl(210, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30\:dark, html.var.auto .sf-c-txt-dodgerblue\:30\:dark { color: hsl(210, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40\:dark, html.var.auto .sf-c-txt-dodgerblue\:40\:dark { color: hsl(210, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50\:dark, html.var.auto .sf-c-txt-dodgerblue\:50\:dark { color: hsl(210, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60\:dark, html.var.auto .sf-c-txt-dodgerblue\:60\:dark { color: hsl(210, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70\:dark, html.var.auto .sf-c-txt-dodgerblue\:70\:dark { color: hsl(210, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80\:dark, html.var.auto .sf-c-txt-dodgerblue\:80\:dark { color: hsl(210, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90\:dark, html.var.auto .sf-c-txt-dodgerblue\:90\:dark { color: hsl(210, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100\:dark, html.var.auto .sf-c-txt-dodgerblue\:100\:dark { color: hsl(210, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/firebrick.css b/src/colors/10/firebrick.css index acfbd9b..9d86cf5 100644 --- a/src/colors/10/firebrick.css +++ b/src/colors/10/firebrick.css @@ -1,4 +1,4 @@ -:root { +[class*='firebrick'] { --sf-c-firebrick: 0 68% 42%; --sf-c-firebrick-0: 0 68% 0%; --sf-c-firebrick-10: 0 68% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-firebrick\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-firebrick\:90\:dark, html.var.auto .sf-c-firebrick\:90\:dark { color: hsl(0, 68%, 90%); background: hsl(0, 68%, 10%) } html.var[data-theme='auto'] .sf-c-firebrick\:100\:dark, html.var.auto .sf-c-firebrick\:100\:dark { color: hsl(0, 68%, 90%); background: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick, html.auto .sf-c-txt-firebrick { color: hsl(0, 68%, 42%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:0, html.auto .sf-c-txt-firebrick\:0 { color: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:10, html.auto .sf-c-txt-firebrick\:10 { color: hsl(0, 68%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:20, html.auto .sf-c-txt-firebrick\:20 { color: hsl(0, 68%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:30, html.auto .sf-c-txt-firebrick\:30 { color: hsl(0, 68%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:40, html.auto .sf-c-txt-firebrick\:40 { color: hsl(0, 68%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:50, html.auto .sf-c-txt-firebrick\:50 { color: hsl(0, 68%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:60, html.auto .sf-c-txt-firebrick\:60 { color: hsl(0, 68%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:70, html.auto .sf-c-txt-firebrick\:70 { color: hsl(0, 68%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:80, html.auto .sf-c-txt-firebrick\:80 { color: hsl(0, 68%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:90, html.auto .sf-c-txt-firebrick\:90 { color: hsl(0, 68%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:100, html.auto .sf-c-txt-firebrick\:100 { color: hsl(0, 68%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick, html.var.auto .sf-c-txt-firebrick { color: hsl(0, 68%, 42%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:0, html.var.auto .sf-c-txt-firebrick\:0 { color: hsl(0, 68%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:10, html.var.auto .sf-c-txt-firebrick\:10 { color: hsl(0, 68%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:20, html.var.auto .sf-c-txt-firebrick\:20 { color: hsl(0, 68%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:30, html.var.auto .sf-c-txt-firebrick\:30 { color: hsl(0, 68%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:40, html.var.auto .sf-c-txt-firebrick\:40 { color: hsl(0, 68%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:50, html.var.auto .sf-c-txt-firebrick\:50 { color: hsl(0, 68%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:60, html.var.auto .sf-c-txt-firebrick\:60 { color: hsl(0, 68%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:70, html.var.auto .sf-c-txt-firebrick\:70 { color: hsl(0, 68%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:80, html.var.auto .sf-c-txt-firebrick\:80 { color: hsl(0, 68%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:90, html.var.auto .sf-c-txt-firebrick\:90 { color: hsl(0, 68%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:100, html.var.auto .sf-c-txt-firebrick\:100 { color: hsl(0, 68%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:dark, html.auto .sf-c-txt-firebrick\:dark { color: hsl(0, 68%, 42%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:0\:dark, html.auto .sf-c-txt-firebrick\:0\:dark { color: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:10\:dark, html.auto .sf-c-txt-firebrick\:10\:dark { color: hsl(0, 68%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:20\:dark, html.auto .sf-c-txt-firebrick\:20\:dark { color: hsl(0, 68%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:30\:dark, html.auto .sf-c-txt-firebrick\:30\:dark { color: hsl(0, 68%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:40\:dark, html.auto .sf-c-txt-firebrick\:40\:dark { color: hsl(0, 68%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:50\:dark, html.auto .sf-c-txt-firebrick\:50\:dark { color: hsl(0, 68%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:60\:dark, html.auto .sf-c-txt-firebrick\:60\:dark { color: hsl(0, 68%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:70\:dark, html.auto .sf-c-txt-firebrick\:70\:dark { color: hsl(0, 68%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:80\:dark, html.auto .sf-c-txt-firebrick\:80\:dark { color: hsl(0, 68%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:90\:dark, html.auto .sf-c-txt-firebrick\:90\:dark { color: hsl(0, 68%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:100\:dark, html.auto .sf-c-txt-firebrick\:100\:dark { color: hsl(0, 68%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:dark, html.var.auto .sf-c-txt-firebrick\:dark { color: hsl(0, 68%, 42%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:0\:dark, html.var.auto .sf-c-txt-firebrick\:0\:dark { color: hsl(0, 68%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:10\:dark, html.var.auto .sf-c-txt-firebrick\:10\:dark { color: hsl(0, 68%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:20\:dark, html.var.auto .sf-c-txt-firebrick\:20\:dark { color: hsl(0, 68%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:30\:dark, html.var.auto .sf-c-txt-firebrick\:30\:dark { color: hsl(0, 68%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:40\:dark, html.var.auto .sf-c-txt-firebrick\:40\:dark { color: hsl(0, 68%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:50\:dark, html.var.auto .sf-c-txt-firebrick\:50\:dark { color: hsl(0, 68%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:60\:dark, html.var.auto .sf-c-txt-firebrick\:60\:dark { color: hsl(0, 68%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:70\:dark, html.var.auto .sf-c-txt-firebrick\:70\:dark { color: hsl(0, 68%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:80\:dark, html.var.auto .sf-c-txt-firebrick\:80\:dark { color: hsl(0, 68%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:90\:dark, html.var.auto .sf-c-txt-firebrick\:90\:dark { color: hsl(0, 68%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:100\:dark, html.var.auto .sf-c-txt-firebrick\:100\:dark { color: hsl(0, 68%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/floralwhite.css b/src/colors/10/floralwhite.css index 684d28c..00adc3c 100644 --- a/src/colors/10/floralwhite.css +++ b/src/colors/10/floralwhite.css @@ -1,4 +1,4 @@ -:root { +[class*='floralwhite'] { --sf-c-floralwhite: 40 100% 97%; --sf-c-floralwhite-0: 40 100% 0%; --sf-c-floralwhite-10: 40 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-floralwhite\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-floralwhite\:90\:dark, html.var.auto .sf-c-floralwhite\:90\:dark { color: hsl(40, 100%, 90%); background: hsl(40, 100%, 10%) } html.var[data-theme='auto'] .sf-c-floralwhite\:100\:dark, html.var.auto .sf-c-floralwhite\:100\:dark { color: hsl(40, 100%, 90%); background: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite, html.auto .sf-c-txt-floralwhite { color: hsl(40, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0, html.auto .sf-c-txt-floralwhite\:0 { color: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10, html.auto .sf-c-txt-floralwhite\:10 { color: hsl(40, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20, html.auto .sf-c-txt-floralwhite\:20 { color: hsl(40, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30, html.auto .sf-c-txt-floralwhite\:30 { color: hsl(40, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40, html.auto .sf-c-txt-floralwhite\:40 { color: hsl(40, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50, html.auto .sf-c-txt-floralwhite\:50 { color: hsl(40, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60, html.auto .sf-c-txt-floralwhite\:60 { color: hsl(40, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70, html.auto .sf-c-txt-floralwhite\:70 { color: hsl(40, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80, html.auto .sf-c-txt-floralwhite\:80 { color: hsl(40, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90, html.auto .sf-c-txt-floralwhite\:90 { color: hsl(40, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100, html.auto .sf-c-txt-floralwhite\:100 { color: hsl(40, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite, html.var.auto .sf-c-txt-floralwhite { color: hsl(40, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0, html.var.auto .sf-c-txt-floralwhite\:0 { color: hsl(40, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10, html.var.auto .sf-c-txt-floralwhite\:10 { color: hsl(40, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20, html.var.auto .sf-c-txt-floralwhite\:20 { color: hsl(40, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30, html.var.auto .sf-c-txt-floralwhite\:30 { color: hsl(40, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40, html.var.auto .sf-c-txt-floralwhite\:40 { color: hsl(40, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50, html.var.auto .sf-c-txt-floralwhite\:50 { color: hsl(40, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60, html.var.auto .sf-c-txt-floralwhite\:60 { color: hsl(40, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70, html.var.auto .sf-c-txt-floralwhite\:70 { color: hsl(40, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80, html.var.auto .sf-c-txt-floralwhite\:80 { color: hsl(40, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90, html.var.auto .sf-c-txt-floralwhite\:90 { color: hsl(40, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100, html.var.auto .sf-c-txt-floralwhite\:100 { color: hsl(40, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:dark, html.auto .sf-c-txt-floralwhite\:dark { color: hsl(40, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0\:dark, html.auto .sf-c-txt-floralwhite\:0\:dark { color: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10\:dark, html.auto .sf-c-txt-floralwhite\:10\:dark { color: hsl(40, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20\:dark, html.auto .sf-c-txt-floralwhite\:20\:dark { color: hsl(40, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30\:dark, html.auto .sf-c-txt-floralwhite\:30\:dark { color: hsl(40, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40\:dark, html.auto .sf-c-txt-floralwhite\:40\:dark { color: hsl(40, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50\:dark, html.auto .sf-c-txt-floralwhite\:50\:dark { color: hsl(40, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60\:dark, html.auto .sf-c-txt-floralwhite\:60\:dark { color: hsl(40, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70\:dark, html.auto .sf-c-txt-floralwhite\:70\:dark { color: hsl(40, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80\:dark, html.auto .sf-c-txt-floralwhite\:80\:dark { color: hsl(40, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90\:dark, html.auto .sf-c-txt-floralwhite\:90\:dark { color: hsl(40, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100\:dark, html.auto .sf-c-txt-floralwhite\:100\:dark { color: hsl(40, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:dark, html.var.auto .sf-c-txt-floralwhite\:dark { color: hsl(40, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0\:dark, html.var.auto .sf-c-txt-floralwhite\:0\:dark { color: hsl(40, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10\:dark, html.var.auto .sf-c-txt-floralwhite\:10\:dark { color: hsl(40, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20\:dark, html.var.auto .sf-c-txt-floralwhite\:20\:dark { color: hsl(40, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30\:dark, html.var.auto .sf-c-txt-floralwhite\:30\:dark { color: hsl(40, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40\:dark, html.var.auto .sf-c-txt-floralwhite\:40\:dark { color: hsl(40, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50\:dark, html.var.auto .sf-c-txt-floralwhite\:50\:dark { color: hsl(40, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60\:dark, html.var.auto .sf-c-txt-floralwhite\:60\:dark { color: hsl(40, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70\:dark, html.var.auto .sf-c-txt-floralwhite\:70\:dark { color: hsl(40, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80\:dark, html.var.auto .sf-c-txt-floralwhite\:80\:dark { color: hsl(40, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90\:dark, html.var.auto .sf-c-txt-floralwhite\:90\:dark { color: hsl(40, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100\:dark, html.var.auto .sf-c-txt-floralwhite\:100\:dark { color: hsl(40, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/forestgreen.css b/src/colors/10/forestgreen.css index b2c1cff..cb120f1 100644 --- a/src/colors/10/forestgreen.css +++ b/src/colors/10/forestgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='forestgreen'] { --sf-c-forestgreen: 120 61% 34%; --sf-c-forestgreen-0: 120 61% 0%; --sf-c-forestgreen-10: 120 61% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-forestgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-forestgreen\:90\:dark, html.var.auto .sf-c-forestgreen\:90\:dark { color: hsl(120, 61%, 90%); background: hsl(120, 61%, 10%) } html.var[data-theme='auto'] .sf-c-forestgreen\:100\:dark, html.var.auto .sf-c-forestgreen\:100\:dark { color: hsl(120, 61%, 90%); background: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen, html.auto .sf-c-txt-forestgreen { color: hsl(120, 61%, 34%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0, html.auto .sf-c-txt-forestgreen\:0 { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10, html.auto .sf-c-txt-forestgreen\:10 { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20, html.auto .sf-c-txt-forestgreen\:20 { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30, html.auto .sf-c-txt-forestgreen\:30 { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40, html.auto .sf-c-txt-forestgreen\:40 { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50, html.auto .sf-c-txt-forestgreen\:50 { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60, html.auto .sf-c-txt-forestgreen\:60 { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70, html.auto .sf-c-txt-forestgreen\:70 { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80, html.auto .sf-c-txt-forestgreen\:80 { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90, html.auto .sf-c-txt-forestgreen\:90 { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100, html.auto .sf-c-txt-forestgreen\:100 { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen, html.var.auto .sf-c-txt-forestgreen { color: hsl(120, 61%, 34%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0, html.var.auto .sf-c-txt-forestgreen\:0 { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10, html.var.auto .sf-c-txt-forestgreen\:10 { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20, html.var.auto .sf-c-txt-forestgreen\:20 { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30, html.var.auto .sf-c-txt-forestgreen\:30 { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40, html.var.auto .sf-c-txt-forestgreen\:40 { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50, html.var.auto .sf-c-txt-forestgreen\:50 { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60, html.var.auto .sf-c-txt-forestgreen\:60 { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70, html.var.auto .sf-c-txt-forestgreen\:70 { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80, html.var.auto .sf-c-txt-forestgreen\:80 { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90, html.var.auto .sf-c-txt-forestgreen\:90 { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100, html.var.auto .sf-c-txt-forestgreen\:100 { color: hsl(120, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:dark, html.auto .sf-c-txt-forestgreen\:dark { color: hsl(120, 61%, 34%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0\:dark, html.auto .sf-c-txt-forestgreen\:0\:dark { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10\:dark, html.auto .sf-c-txt-forestgreen\:10\:dark { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20\:dark, html.auto .sf-c-txt-forestgreen\:20\:dark { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30\:dark, html.auto .sf-c-txt-forestgreen\:30\:dark { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40\:dark, html.auto .sf-c-txt-forestgreen\:40\:dark { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50\:dark, html.auto .sf-c-txt-forestgreen\:50\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60\:dark, html.auto .sf-c-txt-forestgreen\:60\:dark { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70\:dark, html.auto .sf-c-txt-forestgreen\:70\:dark { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80\:dark, html.auto .sf-c-txt-forestgreen\:80\:dark { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90\:dark, html.auto .sf-c-txt-forestgreen\:90\:dark { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100\:dark, html.auto .sf-c-txt-forestgreen\:100\:dark { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:dark, html.var.auto .sf-c-txt-forestgreen\:dark { color: hsl(120, 61%, 34%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0\:dark, html.var.auto .sf-c-txt-forestgreen\:0\:dark { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10\:dark, html.var.auto .sf-c-txt-forestgreen\:10\:dark { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20\:dark, html.var.auto .sf-c-txt-forestgreen\:20\:dark { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30\:dark, html.var.auto .sf-c-txt-forestgreen\:30\:dark { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40\:dark, html.var.auto .sf-c-txt-forestgreen\:40\:dark { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50\:dark, html.var.auto .sf-c-txt-forestgreen\:50\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60\:dark, html.var.auto .sf-c-txt-forestgreen\:60\:dark { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70\:dark, html.var.auto .sf-c-txt-forestgreen\:70\:dark { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80\:dark, html.var.auto .sf-c-txt-forestgreen\:80\:dark { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90\:dark, html.var.auto .sf-c-txt-forestgreen\:90\:dark { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100\:dark, html.var.auto .sf-c-txt-forestgreen\:100\:dark { color: hsl(120, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/fuchsia.css b/src/colors/10/fuchsia.css index fcc89e5..92fe16f 100644 --- a/src/colors/10/fuchsia.css +++ b/src/colors/10/fuchsia.css @@ -1,4 +1,4 @@ -:root { +[class*='fuchsia'] { --sf-c-fuchsia: 300 100% 50%; --sf-c-fuchsia-0: 300 100% 0%; --sf-c-fuchsia-10: 300 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark, html.dark .sf-c-txt-fu html.var[data-theme='auto'] .sf-c-fuchsia\:90\:dark, html.var.auto .sf-c-fuchsia\:90\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 10%) } html.var[data-theme='auto'] .sf-c-fuchsia\:100\:dark, html.var.auto .sf-c-fuchsia\:100\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia, html.auto .sf-c-txt-fuchsia { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0, html.auto .sf-c-txt-fuchsia\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10, html.auto .sf-c-txt-fuchsia\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20, html.auto .sf-c-txt-fuchsia\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30, html.auto .sf-c-txt-fuchsia\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40, html.auto .sf-c-txt-fuchsia\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50, html.auto .sf-c-txt-fuchsia\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60, html.auto .sf-c-txt-fuchsia\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70, html.auto .sf-c-txt-fuchsia\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80, html.auto .sf-c-txt-fuchsia\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90, html.auto .sf-c-txt-fuchsia\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100, html.auto .sf-c-txt-fuchsia\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia, html.var.auto .sf-c-txt-fuchsia { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0, html.var.auto .sf-c-txt-fuchsia\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10, html.var.auto .sf-c-txt-fuchsia\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20, html.var.auto .sf-c-txt-fuchsia\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30, html.var.auto .sf-c-txt-fuchsia\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40, html.var.auto .sf-c-txt-fuchsia\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50, html.var.auto .sf-c-txt-fuchsia\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60, html.var.auto .sf-c-txt-fuchsia\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70, html.var.auto .sf-c-txt-fuchsia\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80, html.var.auto .sf-c-txt-fuchsia\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90, html.var.auto .sf-c-txt-fuchsia\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100, html.var.auto .sf-c-txt-fuchsia\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark, html.auto .sf-c-txt-fuchsia\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark, html.auto .sf-c-txt-fuchsia\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark, html.auto .sf-c-txt-fuchsia\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark, html.auto .sf-c-txt-fuchsia\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark, html.auto .sf-c-txt-fuchsia\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark, html.auto .sf-c-txt-fuchsia\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark, html.auto .sf-c-txt-fuchsia\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark, html.auto .sf-c-txt-fuchsia\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark, html.auto .sf-c-txt-fuchsia\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark, html.auto .sf-c-txt-fuchsia\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark, html.auto .sf-c-txt-fuchsia\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark, html.auto .sf-c-txt-fuchsia\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark, html.var.auto .sf-c-txt-fuchsia\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark, html.var.auto .sf-c-txt-fuchsia\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark, html.var.auto .sf-c-txt-fuchsia\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark, html.var.auto .sf-c-txt-fuchsia\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark, html.var.auto .sf-c-txt-fuchsia\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark, html.var.auto .sf-c-txt-fuchsia\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark, html.var.auto .sf-c-txt-fuchsia\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark, html.var.auto .sf-c-txt-fuchsia\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark, html.var.auto .sf-c-txt-fuchsia\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark, html.var.auto .sf-c-txt-fuchsia\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark, html.var.auto .sf-c-txt-fuchsia\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark, html.var.auto .sf-c-txt-fuchsia\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/gainsboro.css b/src/colors/10/gainsboro.css index 4eae262..44691c9 100644 --- a/src/colors/10/gainsboro.css +++ b/src/colors/10/gainsboro.css @@ -1,4 +1,4 @@ -:root { +[class*='gainsboro'] { --sf-c-gainsboro: 0 0% 86%; --sf-c-gainsboro-0: 0 0% 0%; --sf-c-gainsboro-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-gainsboro\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-gainsboro\:90\:dark, html.var.auto .sf-c-gainsboro\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-gainsboro\:100\:dark, html.var.auto .sf-c-gainsboro\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro, html.auto .sf-c-txt-gainsboro { color: hsl(0, 0%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0, html.auto .sf-c-txt-gainsboro\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10, html.auto .sf-c-txt-gainsboro\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20, html.auto .sf-c-txt-gainsboro\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30, html.auto .sf-c-txt-gainsboro\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40, html.auto .sf-c-txt-gainsboro\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50, html.auto .sf-c-txt-gainsboro\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60, html.auto .sf-c-txt-gainsboro\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70, html.auto .sf-c-txt-gainsboro\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80, html.auto .sf-c-txt-gainsboro\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90, html.auto .sf-c-txt-gainsboro\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100, html.auto .sf-c-txt-gainsboro\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro, html.var.auto .sf-c-txt-gainsboro { color: hsl(0, 0%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0, html.var.auto .sf-c-txt-gainsboro\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10, html.var.auto .sf-c-txt-gainsboro\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20, html.var.auto .sf-c-txt-gainsboro\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30, html.var.auto .sf-c-txt-gainsboro\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40, html.var.auto .sf-c-txt-gainsboro\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50, html.var.auto .sf-c-txt-gainsboro\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60, html.var.auto .sf-c-txt-gainsboro\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70, html.var.auto .sf-c-txt-gainsboro\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80, html.var.auto .sf-c-txt-gainsboro\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90, html.var.auto .sf-c-txt-gainsboro\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100, html.var.auto .sf-c-txt-gainsboro\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:dark, html.auto .sf-c-txt-gainsboro\:dark { color: hsl(0, 0%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0\:dark, html.auto .sf-c-txt-gainsboro\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10\:dark, html.auto .sf-c-txt-gainsboro\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20\:dark, html.auto .sf-c-txt-gainsboro\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30\:dark, html.auto .sf-c-txt-gainsboro\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40\:dark, html.auto .sf-c-txt-gainsboro\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50\:dark, html.auto .sf-c-txt-gainsboro\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60\:dark, html.auto .sf-c-txt-gainsboro\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70\:dark, html.auto .sf-c-txt-gainsboro\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80\:dark, html.auto .sf-c-txt-gainsboro\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90\:dark, html.auto .sf-c-txt-gainsboro\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100\:dark, html.auto .sf-c-txt-gainsboro\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:dark, html.var.auto .sf-c-txt-gainsboro\:dark { color: hsl(0, 0%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0\:dark, html.var.auto .sf-c-txt-gainsboro\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10\:dark, html.var.auto .sf-c-txt-gainsboro\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20\:dark, html.var.auto .sf-c-txt-gainsboro\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30\:dark, html.var.auto .sf-c-txt-gainsboro\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40\:dark, html.var.auto .sf-c-txt-gainsboro\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50\:dark, html.var.auto .sf-c-txt-gainsboro\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60\:dark, html.var.auto .sf-c-txt-gainsboro\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70\:dark, html.var.auto .sf-c-txt-gainsboro\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80\:dark, html.var.auto .sf-c-txt-gainsboro\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90\:dark, html.var.auto .sf-c-txt-gainsboro\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100\:dark, html.var.auto .sf-c-txt-gainsboro\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/ghostwhite.css b/src/colors/10/ghostwhite.css index d46519b..4810f5e 100644 --- a/src/colors/10/ghostwhite.css +++ b/src/colors/10/ghostwhite.css @@ -1,4 +1,4 @@ -:root { +[class*='ghostwhite'] { --sf-c-ghostwhite: 240 100% 99%; --sf-c-ghostwhite-0: 240 100% 0%; --sf-c-ghostwhite-10: 240 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-ghostwhite\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-ghostwhite\:90\:dark, html.var.auto .sf-c-ghostwhite\:90\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 10%) } html.var[data-theme='auto'] .sf-c-ghostwhite\:100\:dark, html.var.auto .sf-c-ghostwhite\:100\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite, html.auto .sf-c-txt-ghostwhite { color: hsl(240, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0, html.auto .sf-c-txt-ghostwhite\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10, html.auto .sf-c-txt-ghostwhite\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20, html.auto .sf-c-txt-ghostwhite\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30, html.auto .sf-c-txt-ghostwhite\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40, html.auto .sf-c-txt-ghostwhite\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50, html.auto .sf-c-txt-ghostwhite\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60, html.auto .sf-c-txt-ghostwhite\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70, html.auto .sf-c-txt-ghostwhite\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80, html.auto .sf-c-txt-ghostwhite\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90, html.auto .sf-c-txt-ghostwhite\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100, html.auto .sf-c-txt-ghostwhite\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite, html.var.auto .sf-c-txt-ghostwhite { color: hsl(240, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0, html.var.auto .sf-c-txt-ghostwhite\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10, html.var.auto .sf-c-txt-ghostwhite\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20, html.var.auto .sf-c-txt-ghostwhite\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30, html.var.auto .sf-c-txt-ghostwhite\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40, html.var.auto .sf-c-txt-ghostwhite\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50, html.var.auto .sf-c-txt-ghostwhite\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60, html.var.auto .sf-c-txt-ghostwhite\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70, html.var.auto .sf-c-txt-ghostwhite\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80, html.var.auto .sf-c-txt-ghostwhite\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90, html.var.auto .sf-c-txt-ghostwhite\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100, html.var.auto .sf-c-txt-ghostwhite\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:dark, html.auto .sf-c-txt-ghostwhite\:dark { color: hsl(240, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0\:dark, html.auto .sf-c-txt-ghostwhite\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10\:dark, html.auto .sf-c-txt-ghostwhite\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20\:dark, html.auto .sf-c-txt-ghostwhite\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30\:dark, html.auto .sf-c-txt-ghostwhite\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40\:dark, html.auto .sf-c-txt-ghostwhite\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50\:dark, html.auto .sf-c-txt-ghostwhite\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60\:dark, html.auto .sf-c-txt-ghostwhite\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70\:dark, html.auto .sf-c-txt-ghostwhite\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80\:dark, html.auto .sf-c-txt-ghostwhite\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90\:dark, html.auto .sf-c-txt-ghostwhite\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100\:dark, html.auto .sf-c-txt-ghostwhite\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:dark, html.var.auto .sf-c-txt-ghostwhite\:dark { color: hsl(240, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0\:dark, html.var.auto .sf-c-txt-ghostwhite\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10\:dark, html.var.auto .sf-c-txt-ghostwhite\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20\:dark, html.var.auto .sf-c-txt-ghostwhite\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30\:dark, html.var.auto .sf-c-txt-ghostwhite\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40\:dark, html.var.auto .sf-c-txt-ghostwhite\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50\:dark, html.var.auto .sf-c-txt-ghostwhite\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60\:dark, html.var.auto .sf-c-txt-ghostwhite\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70\:dark, html.var.auto .sf-c-txt-ghostwhite\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80\:dark, html.var.auto .sf-c-txt-ghostwhite\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90\:dark, html.var.auto .sf-c-txt-ghostwhite\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100\:dark, html.var.auto .sf-c-txt-ghostwhite\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/gold.css b/src/colors/10/gold.css index 8d0908b..a2f9bb7 100644 --- a/src/colors/10/gold.css +++ b/src/colors/10/gold.css @@ -1,4 +1,4 @@ -:root { +[class*='gold'] { --sf-c-gold: 51 100% 50%; --sf-c-gold-0: 51 100% 0%; --sf-c-gold-10: 51 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-gold\:100\:dark, html.dark .sf-c-txt-gold\ html.var[data-theme='auto'] .sf-c-gold\:90\:dark, html.var.auto .sf-c-gold\:90\:dark { color: hsl(51, 100%, 90%); background: hsl(51, 100%, 10%) } html.var[data-theme='auto'] .sf-c-gold\:100\:dark, html.var.auto .sf-c-gold\:100\:dark { color: hsl(51, 100%, 90%); background: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold, html.auto .sf-c-txt-gold { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:0, html.auto .sf-c-txt-gold\:0 { color: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:10, html.auto .sf-c-txt-gold\:10 { color: hsl(51, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:20, html.auto .sf-c-txt-gold\:20 { color: hsl(51, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:30, html.auto .sf-c-txt-gold\:30 { color: hsl(51, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:40, html.auto .sf-c-txt-gold\:40 { color: hsl(51, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:50, html.auto .sf-c-txt-gold\:50 { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:60, html.auto .sf-c-txt-gold\:60 { color: hsl(51, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:70, html.auto .sf-c-txt-gold\:70 { color: hsl(51, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:80, html.auto .sf-c-txt-gold\:80 { color: hsl(51, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:90, html.auto .sf-c-txt-gold\:90 { color: hsl(51, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:100, html.auto .sf-c-txt-gold\:100 { color: hsl(51, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gold, html.var.auto .sf-c-txt-gold { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:0, html.var.auto .sf-c-txt-gold\:0 { color: hsl(51, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:10, html.var.auto .sf-c-txt-gold\:10 { color: hsl(51, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:20, html.var.auto .sf-c-txt-gold\:20 { color: hsl(51, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:30, html.var.auto .sf-c-txt-gold\:30 { color: hsl(51, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:40, html.var.auto .sf-c-txt-gold\:40 { color: hsl(51, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:50, html.var.auto .sf-c-txt-gold\:50 { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:60, html.var.auto .sf-c-txt-gold\:60 { color: hsl(51, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:70, html.var.auto .sf-c-txt-gold\:70 { color: hsl(51, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:80, html.var.auto .sf-c-txt-gold\:80 { color: hsl(51, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:90, html.var.auto .sf-c-txt-gold\:90 { color: hsl(51, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:100, html.var.auto .sf-c-txt-gold\:100 { color: hsl(51, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:dark, html.auto .sf-c-txt-gold\:dark { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:0\:dark, html.auto .sf-c-txt-gold\:0\:dark { color: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:10\:dark, html.auto .sf-c-txt-gold\:10\:dark { color: hsl(51, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:20\:dark, html.auto .sf-c-txt-gold\:20\:dark { color: hsl(51, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:30\:dark, html.auto .sf-c-txt-gold\:30\:dark { color: hsl(51, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:40\:dark, html.auto .sf-c-txt-gold\:40\:dark { color: hsl(51, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:50\:dark, html.auto .sf-c-txt-gold\:50\:dark { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:60\:dark, html.auto .sf-c-txt-gold\:60\:dark { color: hsl(51, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:70\:dark, html.auto .sf-c-txt-gold\:70\:dark { color: hsl(51, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:80\:dark, html.auto .sf-c-txt-gold\:80\:dark { color: hsl(51, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:90\:dark, html.auto .sf-c-txt-gold\:90\:dark { color: hsl(51, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:100\:dark, html.auto .sf-c-txt-gold\:100\:dark { color: hsl(51, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:dark, html.var.auto .sf-c-txt-gold\:dark { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:0\:dark, html.var.auto .sf-c-txt-gold\:0\:dark { color: hsl(51, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:10\:dark, html.var.auto .sf-c-txt-gold\:10\:dark { color: hsl(51, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:20\:dark, html.var.auto .sf-c-txt-gold\:20\:dark { color: hsl(51, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:30\:dark, html.var.auto .sf-c-txt-gold\:30\:dark { color: hsl(51, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:40\:dark, html.var.auto .sf-c-txt-gold\:40\:dark { color: hsl(51, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:50\:dark, html.var.auto .sf-c-txt-gold\:50\:dark { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:60\:dark, html.var.auto .sf-c-txt-gold\:60\:dark { color: hsl(51, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:70\:dark, html.var.auto .sf-c-txt-gold\:70\:dark { color: hsl(51, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:80\:dark, html.var.auto .sf-c-txt-gold\:80\:dark { color: hsl(51, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:90\:dark, html.var.auto .sf-c-txt-gold\:90\:dark { color: hsl(51, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:100\:dark, html.var.auto .sf-c-txt-gold\:100\:dark { color: hsl(51, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/goldenrod.css b/src/colors/10/goldenrod.css index 4491de6..aa36294 100644 --- a/src/colors/10/goldenrod.css +++ b/src/colors/10/goldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='goldenrod'] { --sf-c-goldenrod: 43 74% 49%; --sf-c-goldenrod-0: 43 74% 0%; --sf-c-goldenrod-10: 43 74% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-goldenrod\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-goldenrod\:90\:dark, html.var.auto .sf-c-goldenrod\:90\:dark { color: hsl(43, 74%, 90%); background: hsl(43, 74%, 10%) } html.var[data-theme='auto'] .sf-c-goldenrod\:100\:dark, html.var.auto .sf-c-goldenrod\:100\:dark { color: hsl(43, 74%, 90%); background: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod, html.auto .sf-c-txt-goldenrod { color: hsl(43, 74%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0, html.auto .sf-c-txt-goldenrod\:0 { color: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10, html.auto .sf-c-txt-goldenrod\:10 { color: hsl(43, 74%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20, html.auto .sf-c-txt-goldenrod\:20 { color: hsl(43, 74%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30, html.auto .sf-c-txt-goldenrod\:30 { color: hsl(43, 74%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40, html.auto .sf-c-txt-goldenrod\:40 { color: hsl(43, 74%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50, html.auto .sf-c-txt-goldenrod\:50 { color: hsl(43, 74%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60, html.auto .sf-c-txt-goldenrod\:60 { color: hsl(43, 74%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70, html.auto .sf-c-txt-goldenrod\:70 { color: hsl(43, 74%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80, html.auto .sf-c-txt-goldenrod\:80 { color: hsl(43, 74%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90, html.auto .sf-c-txt-goldenrod\:90 { color: hsl(43, 74%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100, html.auto .sf-c-txt-goldenrod\:100 { color: hsl(43, 74%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod, html.var.auto .sf-c-txt-goldenrod { color: hsl(43, 74%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0, html.var.auto .sf-c-txt-goldenrod\:0 { color: hsl(43, 74%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10, html.var.auto .sf-c-txt-goldenrod\:10 { color: hsl(43, 74%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20, html.var.auto .sf-c-txt-goldenrod\:20 { color: hsl(43, 74%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30, html.var.auto .sf-c-txt-goldenrod\:30 { color: hsl(43, 74%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40, html.var.auto .sf-c-txt-goldenrod\:40 { color: hsl(43, 74%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50, html.var.auto .sf-c-txt-goldenrod\:50 { color: hsl(43, 74%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60, html.var.auto .sf-c-txt-goldenrod\:60 { color: hsl(43, 74%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70, html.var.auto .sf-c-txt-goldenrod\:70 { color: hsl(43, 74%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80, html.var.auto .sf-c-txt-goldenrod\:80 { color: hsl(43, 74%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90, html.var.auto .sf-c-txt-goldenrod\:90 { color: hsl(43, 74%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100, html.var.auto .sf-c-txt-goldenrod\:100 { color: hsl(43, 74%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:dark, html.auto .sf-c-txt-goldenrod\:dark { color: hsl(43, 74%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0\:dark, html.auto .sf-c-txt-goldenrod\:0\:dark { color: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10\:dark, html.auto .sf-c-txt-goldenrod\:10\:dark { color: hsl(43, 74%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20\:dark, html.auto .sf-c-txt-goldenrod\:20\:dark { color: hsl(43, 74%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30\:dark, html.auto .sf-c-txt-goldenrod\:30\:dark { color: hsl(43, 74%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40\:dark, html.auto .sf-c-txt-goldenrod\:40\:dark { color: hsl(43, 74%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50\:dark, html.auto .sf-c-txt-goldenrod\:50\:dark { color: hsl(43, 74%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60\:dark, html.auto .sf-c-txt-goldenrod\:60\:dark { color: hsl(43, 74%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70\:dark, html.auto .sf-c-txt-goldenrod\:70\:dark { color: hsl(43, 74%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80\:dark, html.auto .sf-c-txt-goldenrod\:80\:dark { color: hsl(43, 74%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90\:dark, html.auto .sf-c-txt-goldenrod\:90\:dark { color: hsl(43, 74%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100\:dark, html.auto .sf-c-txt-goldenrod\:100\:dark { color: hsl(43, 74%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:dark, html.var.auto .sf-c-txt-goldenrod\:dark { color: hsl(43, 74%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0\:dark, html.var.auto .sf-c-txt-goldenrod\:0\:dark { color: hsl(43, 74%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10\:dark, html.var.auto .sf-c-txt-goldenrod\:10\:dark { color: hsl(43, 74%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20\:dark, html.var.auto .sf-c-txt-goldenrod\:20\:dark { color: hsl(43, 74%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30\:dark, html.var.auto .sf-c-txt-goldenrod\:30\:dark { color: hsl(43, 74%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40\:dark, html.var.auto .sf-c-txt-goldenrod\:40\:dark { color: hsl(43, 74%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50\:dark, html.var.auto .sf-c-txt-goldenrod\:50\:dark { color: hsl(43, 74%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60\:dark, html.var.auto .sf-c-txt-goldenrod\:60\:dark { color: hsl(43, 74%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70\:dark, html.var.auto .sf-c-txt-goldenrod\:70\:dark { color: hsl(43, 74%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80\:dark, html.var.auto .sf-c-txt-goldenrod\:80\:dark { color: hsl(43, 74%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90\:dark, html.var.auto .sf-c-txt-goldenrod\:90\:dark { color: hsl(43, 74%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100\:dark, html.var.auto .sf-c-txt-goldenrod\:100\:dark { color: hsl(43, 74%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/gray.css b/src/colors/10/gray.css index a1bc927..c4cd032 100644 --- a/src/colors/10/gray.css +++ b/src/colors/10/gray.css @@ -1,4 +1,4 @@ -:root { +[class*='gray'] { --sf-c-gray: 0 0% 50%; --sf-c-gray-0: 0 0% 0%; --sf-c-gray-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-gray\:100\:dark, html.dark .sf-c-txt-gray\ html.var[data-theme='auto'] .sf-c-gray\:90\:dark, html.var.auto .sf-c-gray\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-gray\:100\:dark, html.var.auto .sf-c-gray\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray, html.auto .sf-c-txt-gray { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:0, html.auto .sf-c-txt-gray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:10, html.auto .sf-c-txt-gray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:20, html.auto .sf-c-txt-gray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:30, html.auto .sf-c-txt-gray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:40, html.auto .sf-c-txt-gray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:50, html.auto .sf-c-txt-gray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:60, html.auto .sf-c-txt-gray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:70, html.auto .sf-c-txt-gray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:80, html.auto .sf-c-txt-gray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:90, html.auto .sf-c-txt-gray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:100, html.auto .sf-c-txt-gray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gray, html.var.auto .sf-c-txt-gray { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:0, html.var.auto .sf-c-txt-gray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:10, html.var.auto .sf-c-txt-gray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:20, html.var.auto .sf-c-txt-gray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:30, html.var.auto .sf-c-txt-gray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:40, html.var.auto .sf-c-txt-gray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:50, html.var.auto .sf-c-txt-gray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:60, html.var.auto .sf-c-txt-gray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:70, html.var.auto .sf-c-txt-gray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:80, html.var.auto .sf-c-txt-gray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:90, html.var.auto .sf-c-txt-gray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:100, html.var.auto .sf-c-txt-gray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:dark, html.auto .sf-c-txt-gray\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark, html.auto .sf-c-txt-gray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark, html.auto .sf-c-txt-gray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark, html.auto .sf-c-txt-gray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark, html.auto .sf-c-txt-gray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark, html.auto .sf-c-txt-gray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark, html.auto .sf-c-txt-gray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark, html.auto .sf-c-txt-gray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark, html.auto .sf-c-txt-gray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark, html.auto .sf-c-txt-gray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark, html.auto .sf-c-txt-gray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark, html.auto .sf-c-txt-gray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:dark, html.var.auto .sf-c-txt-gray\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark, html.var.auto .sf-c-txt-gray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark, html.var.auto .sf-c-txt-gray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark, html.var.auto .sf-c-txt-gray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark, html.var.auto .sf-c-txt-gray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark, html.var.auto .sf-c-txt-gray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark, html.var.auto .sf-c-txt-gray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark, html.var.auto .sf-c-txt-gray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark, html.var.auto .sf-c-txt-gray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark, html.var.auto .sf-c-txt-gray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark, html.var.auto .sf-c-txt-gray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark, html.var.auto .sf-c-txt-gray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/green.css b/src/colors/10/green.css index f6a5ac5..704f442 100644 --- a/src/colors/10/green.css +++ b/src/colors/10/green.css @@ -1,4 +1,4 @@ -:root { +[class*='green'] { --sf-c-green: 120 100% 25%; --sf-c-green-0: 120 100% 0%; --sf-c-green-10: 120 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark, html.dark .sf-c-txt-gree html.var[data-theme='auto'] .sf-c-green\:90\:dark, html.var.auto .sf-c-green\:90\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 10%) } html.var[data-theme='auto'] .sf-c-green\:100\:dark, html.var.auto .sf-c-green\:100\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green, html.auto .sf-c-txt-green { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:0, html.auto .sf-c-txt-green\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green\:10, html.auto .sf-c-txt-green\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-green\:20, html.auto .sf-c-txt-green\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-green\:30, html.auto .sf-c-txt-green\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-green\:40, html.auto .sf-c-txt-green\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-green\:50, html.auto .sf-c-txt-green\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-green\:60, html.auto .sf-c-txt-green\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-green\:70, html.auto .sf-c-txt-green\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-green\:80, html.auto .sf-c-txt-green\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-green\:90, html.auto .sf-c-txt-green\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-green\:100, html.auto .sf-c-txt-green\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-green, html.var.auto .sf-c-txt-green { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:0, html.var.auto .sf-c-txt-green\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-green\:10, html.var.auto .sf-c-txt-green\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-green\:20, html.var.auto .sf-c-txt-green\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-green\:30, html.var.auto .sf-c-txt-green\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-green\:40, html.var.auto .sf-c-txt-green\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-green\:50, html.var.auto .sf-c-txt-green\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-green\:60, html.var.auto .sf-c-txt-green\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-green\:70, html.var.auto .sf-c-txt-green\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-green\:80, html.var.auto .sf-c-txt-green\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-green\:90, html.var.auto .sf-c-txt-green\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-green\:100, html.var.auto .sf-c-txt-green\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-green\:dark, html.auto .sf-c-txt-green\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark, html.auto .sf-c-txt-green\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark, html.auto .sf-c-txt-green\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark, html.auto .sf-c-txt-green\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark, html.auto .sf-c-txt-green\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark, html.auto .sf-c-txt-green\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark, html.auto .sf-c-txt-green\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark, html.auto .sf-c-txt-green\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark, html.auto .sf-c-txt-green\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark, html.auto .sf-c-txt-green\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark, html.auto .sf-c-txt-green\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark, html.auto .sf-c-txt-green\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-green\:dark, html.var.auto .sf-c-txt-green\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark, html.var.auto .sf-c-txt-green\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark, html.var.auto .sf-c-txt-green\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark, html.var.auto .sf-c-txt-green\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark, html.var.auto .sf-c-txt-green\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark, html.var.auto .sf-c-txt-green\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark, html.var.auto .sf-c-txt-green\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark, html.var.auto .sf-c-txt-green\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark, html.var.auto .sf-c-txt-green\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark, html.var.auto .sf-c-txt-green\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark, html.var.auto .sf-c-txt-green\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark, html.var.auto .sf-c-txt-green\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/greenyellow.css b/src/colors/10/greenyellow.css index 190e746..da6d314 100644 --- a/src/colors/10/greenyellow.css +++ b/src/colors/10/greenyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='greenyellow'] { --sf-c-greenyellow: 84 100% 59%; --sf-c-greenyellow-0: 84 100% 0%; --sf-c-greenyellow-10: 84 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-greenyellow\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-greenyellow\:90\:dark, html.var.auto .sf-c-greenyellow\:90\:dark { color: hsl(84, 100%, 90%); background: hsl(84, 100%, 10%) } html.var[data-theme='auto'] .sf-c-greenyellow\:100\:dark, html.var.auto .sf-c-greenyellow\:100\:dark { color: hsl(84, 100%, 90%); background: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow, html.auto .sf-c-txt-greenyellow { color: hsl(84, 100%, 59%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0, html.auto .sf-c-txt-greenyellow\:0 { color: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10, html.auto .sf-c-txt-greenyellow\:10 { color: hsl(84, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20, html.auto .sf-c-txt-greenyellow\:20 { color: hsl(84, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30, html.auto .sf-c-txt-greenyellow\:30 { color: hsl(84, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40, html.auto .sf-c-txt-greenyellow\:40 { color: hsl(84, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50, html.auto .sf-c-txt-greenyellow\:50 { color: hsl(84, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60, html.auto .sf-c-txt-greenyellow\:60 { color: hsl(84, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70, html.auto .sf-c-txt-greenyellow\:70 { color: hsl(84, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80, html.auto .sf-c-txt-greenyellow\:80 { color: hsl(84, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90, html.auto .sf-c-txt-greenyellow\:90 { color: hsl(84, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100, html.auto .sf-c-txt-greenyellow\:100 { color: hsl(84, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow, html.var.auto .sf-c-txt-greenyellow { color: hsl(84, 100%, 59%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0, html.var.auto .sf-c-txt-greenyellow\:0 { color: hsl(84, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10, html.var.auto .sf-c-txt-greenyellow\:10 { color: hsl(84, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20, html.var.auto .sf-c-txt-greenyellow\:20 { color: hsl(84, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30, html.var.auto .sf-c-txt-greenyellow\:30 { color: hsl(84, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40, html.var.auto .sf-c-txt-greenyellow\:40 { color: hsl(84, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50, html.var.auto .sf-c-txt-greenyellow\:50 { color: hsl(84, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60, html.var.auto .sf-c-txt-greenyellow\:60 { color: hsl(84, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70, html.var.auto .sf-c-txt-greenyellow\:70 { color: hsl(84, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80, html.var.auto .sf-c-txt-greenyellow\:80 { color: hsl(84, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90, html.var.auto .sf-c-txt-greenyellow\:90 { color: hsl(84, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100, html.var.auto .sf-c-txt-greenyellow\:100 { color: hsl(84, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:dark, html.auto .sf-c-txt-greenyellow\:dark { color: hsl(84, 100%, 59%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0\:dark, html.auto .sf-c-txt-greenyellow\:0\:dark { color: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10\:dark, html.auto .sf-c-txt-greenyellow\:10\:dark { color: hsl(84, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20\:dark, html.auto .sf-c-txt-greenyellow\:20\:dark { color: hsl(84, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30\:dark, html.auto .sf-c-txt-greenyellow\:30\:dark { color: hsl(84, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40\:dark, html.auto .sf-c-txt-greenyellow\:40\:dark { color: hsl(84, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50\:dark, html.auto .sf-c-txt-greenyellow\:50\:dark { color: hsl(84, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60\:dark, html.auto .sf-c-txt-greenyellow\:60\:dark { color: hsl(84, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70\:dark, html.auto .sf-c-txt-greenyellow\:70\:dark { color: hsl(84, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80\:dark, html.auto .sf-c-txt-greenyellow\:80\:dark { color: hsl(84, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90\:dark, html.auto .sf-c-txt-greenyellow\:90\:dark { color: hsl(84, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100\:dark, html.auto .sf-c-txt-greenyellow\:100\:dark { color: hsl(84, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:dark, html.var.auto .sf-c-txt-greenyellow\:dark { color: hsl(84, 100%, 59%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0\:dark, html.var.auto .sf-c-txt-greenyellow\:0\:dark { color: hsl(84, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10\:dark, html.var.auto .sf-c-txt-greenyellow\:10\:dark { color: hsl(84, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20\:dark, html.var.auto .sf-c-txt-greenyellow\:20\:dark { color: hsl(84, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30\:dark, html.var.auto .sf-c-txt-greenyellow\:30\:dark { color: hsl(84, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40\:dark, html.var.auto .sf-c-txt-greenyellow\:40\:dark { color: hsl(84, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50\:dark, html.var.auto .sf-c-txt-greenyellow\:50\:dark { color: hsl(84, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60\:dark, html.var.auto .sf-c-txt-greenyellow\:60\:dark { color: hsl(84, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70\:dark, html.var.auto .sf-c-txt-greenyellow\:70\:dark { color: hsl(84, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80\:dark, html.var.auto .sf-c-txt-greenyellow\:80\:dark { color: hsl(84, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90\:dark, html.var.auto .sf-c-txt-greenyellow\:90\:dark { color: hsl(84, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100\:dark, html.var.auto .sf-c-txt-greenyellow\:100\:dark { color: hsl(84, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/grey.css b/src/colors/10/grey.css index 7b65b46..da8ed8a 100644 --- a/src/colors/10/grey.css +++ b/src/colors/10/grey.css @@ -1,4 +1,4 @@ -:root { +[class*='grey'] { --sf-c-grey: 0 0% 50%; --sf-c-grey-0: 0 0% 0%; --sf-c-grey-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-grey\:100\:dark, html.dark .sf-c-txt-grey\ html.var[data-theme='auto'] .sf-c-grey\:90\:dark, html.var.auto .sf-c-grey\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-grey\:100\:dark, html.var.auto .sf-c-grey\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey, html.auto .sf-c-txt-grey { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:0, html.auto .sf-c-txt-grey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:10, html.auto .sf-c-txt-grey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:20, html.auto .sf-c-txt-grey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:30, html.auto .sf-c-txt-grey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:40, html.auto .sf-c-txt-grey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:50, html.auto .sf-c-txt-grey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:60, html.auto .sf-c-txt-grey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:70, html.auto .sf-c-txt-grey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:80, html.auto .sf-c-txt-grey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:90, html.auto .sf-c-txt-grey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:100, html.auto .sf-c-txt-grey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-grey, html.var.auto .sf-c-txt-grey { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:0, html.var.auto .sf-c-txt-grey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:10, html.var.auto .sf-c-txt-grey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:20, html.var.auto .sf-c-txt-grey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:30, html.var.auto .sf-c-txt-grey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:40, html.var.auto .sf-c-txt-grey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:50, html.var.auto .sf-c-txt-grey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:60, html.var.auto .sf-c-txt-grey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:70, html.var.auto .sf-c-txt-grey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:80, html.var.auto .sf-c-txt-grey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:90, html.var.auto .sf-c-txt-grey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:100, html.var.auto .sf-c-txt-grey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:dark, html.auto .sf-c-txt-grey\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:0\:dark, html.auto .sf-c-txt-grey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:10\:dark, html.auto .sf-c-txt-grey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:20\:dark, html.auto .sf-c-txt-grey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:30\:dark, html.auto .sf-c-txt-grey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:40\:dark, html.auto .sf-c-txt-grey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:50\:dark, html.auto .sf-c-txt-grey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:60\:dark, html.auto .sf-c-txt-grey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:70\:dark, html.auto .sf-c-txt-grey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:80\:dark, html.auto .sf-c-txt-grey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:90\:dark, html.auto .sf-c-txt-grey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:100\:dark, html.auto .sf-c-txt-grey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:dark, html.var.auto .sf-c-txt-grey\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:0\:dark, html.var.auto .sf-c-txt-grey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:10\:dark, html.var.auto .sf-c-txt-grey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:20\:dark, html.var.auto .sf-c-txt-grey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:30\:dark, html.var.auto .sf-c-txt-grey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:40\:dark, html.var.auto .sf-c-txt-grey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:50\:dark, html.var.auto .sf-c-txt-grey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:60\:dark, html.var.auto .sf-c-txt-grey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:70\:dark, html.var.auto .sf-c-txt-grey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:80\:dark, html.var.auto .sf-c-txt-grey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:90\:dark, html.var.auto .sf-c-txt-grey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:100\:dark, html.var.auto .sf-c-txt-grey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/honeydew.css b/src/colors/10/honeydew.css index 276ff4f..7c624b9 100644 --- a/src/colors/10/honeydew.css +++ b/src/colors/10/honeydew.css @@ -1,4 +1,4 @@ -:root { +[class*='honeydew'] { --sf-c-honeydew: 120 100% 97%; --sf-c-honeydew-0: 120 100% 0%; --sf-c-honeydew-10: 120 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-honeydew\:100\:dark, html.dark .sf-c-txt-h html.var[data-theme='auto'] .sf-c-honeydew\:90\:dark, html.var.auto .sf-c-honeydew\:90\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 10%) } html.var[data-theme='auto'] .sf-c-honeydew\:100\:dark, html.var.auto .sf-c-honeydew\:100\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew, html.auto .sf-c-txt-honeydew { color: hsl(120, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:0, html.auto .sf-c-txt-honeydew\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:10, html.auto .sf-c-txt-honeydew\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:20, html.auto .sf-c-txt-honeydew\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:30, html.auto .sf-c-txt-honeydew\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:40, html.auto .sf-c-txt-honeydew\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:50, html.auto .sf-c-txt-honeydew\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:60, html.auto .sf-c-txt-honeydew\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:70, html.auto .sf-c-txt-honeydew\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:80, html.auto .sf-c-txt-honeydew\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:90, html.auto .sf-c-txt-honeydew\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:100, html.auto .sf-c-txt-honeydew\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew, html.var.auto .sf-c-txt-honeydew { color: hsl(120, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:0, html.var.auto .sf-c-txt-honeydew\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:10, html.var.auto .sf-c-txt-honeydew\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:20, html.var.auto .sf-c-txt-honeydew\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:30, html.var.auto .sf-c-txt-honeydew\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:40, html.var.auto .sf-c-txt-honeydew\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:50, html.var.auto .sf-c-txt-honeydew\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:60, html.var.auto .sf-c-txt-honeydew\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:70, html.var.auto .sf-c-txt-honeydew\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:80, html.var.auto .sf-c-txt-honeydew\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:90, html.var.auto .sf-c-txt-honeydew\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:100, html.var.auto .sf-c-txt-honeydew\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:dark, html.auto .sf-c-txt-honeydew\:dark { color: hsl(120, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:0\:dark, html.auto .sf-c-txt-honeydew\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:10\:dark, html.auto .sf-c-txt-honeydew\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:20\:dark, html.auto .sf-c-txt-honeydew\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:30\:dark, html.auto .sf-c-txt-honeydew\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:40\:dark, html.auto .sf-c-txt-honeydew\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:50\:dark, html.auto .sf-c-txt-honeydew\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:60\:dark, html.auto .sf-c-txt-honeydew\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:70\:dark, html.auto .sf-c-txt-honeydew\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:80\:dark, html.auto .sf-c-txt-honeydew\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:90\:dark, html.auto .sf-c-txt-honeydew\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:100\:dark, html.auto .sf-c-txt-honeydew\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:dark, html.var.auto .sf-c-txt-honeydew\:dark { color: hsl(120, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:0\:dark, html.var.auto .sf-c-txt-honeydew\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:10\:dark, html.var.auto .sf-c-txt-honeydew\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:20\:dark, html.var.auto .sf-c-txt-honeydew\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:30\:dark, html.var.auto .sf-c-txt-honeydew\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:40\:dark, html.var.auto .sf-c-txt-honeydew\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:50\:dark, html.var.auto .sf-c-txt-honeydew\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:60\:dark, html.var.auto .sf-c-txt-honeydew\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:70\:dark, html.var.auto .sf-c-txt-honeydew\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:80\:dark, html.var.auto .sf-c-txt-honeydew\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:90\:dark, html.var.auto .sf-c-txt-honeydew\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:100\:dark, html.var.auto .sf-c-txt-honeydew\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/hotpink.css b/src/colors/10/hotpink.css index da21afe..e6ae7e1 100644 --- a/src/colors/10/hotpink.css +++ b/src/colors/10/hotpink.css @@ -1,4 +1,4 @@ -:root { +[class*='hotpink'] { --sf-c-hotpink: 330 100% 71%; --sf-c-hotpink-0: 330 100% 0%; --sf-c-hotpink-10: 330 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-hotpink\:100\:dark, html.dark .sf-c-txt-ho html.var[data-theme='auto'] .sf-c-hotpink\:90\:dark, html.var.auto .sf-c-hotpink\:90\:dark { color: hsl(330, 100%, 90%); background: hsl(330, 100%, 10%) } html.var[data-theme='auto'] .sf-c-hotpink\:100\:dark, html.var.auto .sf-c-hotpink\:100\:dark { color: hsl(330, 100%, 90%); background: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink, html.auto .sf-c-txt-hotpink { color: hsl(330, 100%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:0, html.auto .sf-c-txt-hotpink\:0 { color: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:10, html.auto .sf-c-txt-hotpink\:10 { color: hsl(330, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:20, html.auto .sf-c-txt-hotpink\:20 { color: hsl(330, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:30, html.auto .sf-c-txt-hotpink\:30 { color: hsl(330, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:40, html.auto .sf-c-txt-hotpink\:40 { color: hsl(330, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:50, html.auto .sf-c-txt-hotpink\:50 { color: hsl(330, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:60, html.auto .sf-c-txt-hotpink\:60 { color: hsl(330, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:70, html.auto .sf-c-txt-hotpink\:70 { color: hsl(330, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:80, html.auto .sf-c-txt-hotpink\:80 { color: hsl(330, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:90, html.auto .sf-c-txt-hotpink\:90 { color: hsl(330, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:100, html.auto .sf-c-txt-hotpink\:100 { color: hsl(330, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink, html.var.auto .sf-c-txt-hotpink { color: hsl(330, 100%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:0, html.var.auto .sf-c-txt-hotpink\:0 { color: hsl(330, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:10, html.var.auto .sf-c-txt-hotpink\:10 { color: hsl(330, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:20, html.var.auto .sf-c-txt-hotpink\:20 { color: hsl(330, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:30, html.var.auto .sf-c-txt-hotpink\:30 { color: hsl(330, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:40, html.var.auto .sf-c-txt-hotpink\:40 { color: hsl(330, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:50, html.var.auto .sf-c-txt-hotpink\:50 { color: hsl(330, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:60, html.var.auto .sf-c-txt-hotpink\:60 { color: hsl(330, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:70, html.var.auto .sf-c-txt-hotpink\:70 { color: hsl(330, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:80, html.var.auto .sf-c-txt-hotpink\:80 { color: hsl(330, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:90, html.var.auto .sf-c-txt-hotpink\:90 { color: hsl(330, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:100, html.var.auto .sf-c-txt-hotpink\:100 { color: hsl(330, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:dark, html.auto .sf-c-txt-hotpink\:dark { color: hsl(330, 100%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:0\:dark, html.auto .sf-c-txt-hotpink\:0\:dark { color: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:10\:dark, html.auto .sf-c-txt-hotpink\:10\:dark { color: hsl(330, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:20\:dark, html.auto .sf-c-txt-hotpink\:20\:dark { color: hsl(330, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:30\:dark, html.auto .sf-c-txt-hotpink\:30\:dark { color: hsl(330, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:40\:dark, html.auto .sf-c-txt-hotpink\:40\:dark { color: hsl(330, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:50\:dark, html.auto .sf-c-txt-hotpink\:50\:dark { color: hsl(330, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:60\:dark, html.auto .sf-c-txt-hotpink\:60\:dark { color: hsl(330, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:70\:dark, html.auto .sf-c-txt-hotpink\:70\:dark { color: hsl(330, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:80\:dark, html.auto .sf-c-txt-hotpink\:80\:dark { color: hsl(330, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:90\:dark, html.auto .sf-c-txt-hotpink\:90\:dark { color: hsl(330, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:100\:dark, html.auto .sf-c-txt-hotpink\:100\:dark { color: hsl(330, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:dark, html.var.auto .sf-c-txt-hotpink\:dark { color: hsl(330, 100%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:0\:dark, html.var.auto .sf-c-txt-hotpink\:0\:dark { color: hsl(330, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:10\:dark, html.var.auto .sf-c-txt-hotpink\:10\:dark { color: hsl(330, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:20\:dark, html.var.auto .sf-c-txt-hotpink\:20\:dark { color: hsl(330, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:30\:dark, html.var.auto .sf-c-txt-hotpink\:30\:dark { color: hsl(330, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:40\:dark, html.var.auto .sf-c-txt-hotpink\:40\:dark { color: hsl(330, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:50\:dark, html.var.auto .sf-c-txt-hotpink\:50\:dark { color: hsl(330, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:60\:dark, html.var.auto .sf-c-txt-hotpink\:60\:dark { color: hsl(330, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:70\:dark, html.var.auto .sf-c-txt-hotpink\:70\:dark { color: hsl(330, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:80\:dark, html.var.auto .sf-c-txt-hotpink\:80\:dark { color: hsl(330, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:90\:dark, html.var.auto .sf-c-txt-hotpink\:90\:dark { color: hsl(330, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:100\:dark, html.var.auto .sf-c-txt-hotpink\:100\:dark { color: hsl(330, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/indianred.css b/src/colors/10/indianred.css index 77c03f7..5ab21e9 100644 --- a/src/colors/10/indianred.css +++ b/src/colors/10/indianred.css @@ -1,4 +1,4 @@ -:root { +[class*='indianred'] { --sf-c-indianred: 0 53% 58%; --sf-c-indianred-0: 0 53% 0%; --sf-c-indianred-10: 0 53% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-indianred\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-indianred\:90\:dark, html.var.auto .sf-c-indianred\:90\:dark { color: hsl(0, 53%, 90%); background: hsl(0, 53%, 10%) } html.var[data-theme='auto'] .sf-c-indianred\:100\:dark, html.var.auto .sf-c-indianred\:100\:dark { color: hsl(0, 53%, 90%); background: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred, html.auto .sf-c-txt-indianred { color: hsl(0, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:0, html.auto .sf-c-txt-indianred\:0 { color: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:10, html.auto .sf-c-txt-indianred\:10 { color: hsl(0, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:20, html.auto .sf-c-txt-indianred\:20 { color: hsl(0, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:30, html.auto .sf-c-txt-indianred\:30 { color: hsl(0, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:40, html.auto .sf-c-txt-indianred\:40 { color: hsl(0, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:50, html.auto .sf-c-txt-indianred\:50 { color: hsl(0, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:60, html.auto .sf-c-txt-indianred\:60 { color: hsl(0, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:70, html.auto .sf-c-txt-indianred\:70 { color: hsl(0, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:80, html.auto .sf-c-txt-indianred\:80 { color: hsl(0, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:90, html.auto .sf-c-txt-indianred\:90 { color: hsl(0, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:100, html.auto .sf-c-txt-indianred\:100 { color: hsl(0, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indianred, html.var.auto .sf-c-txt-indianred { color: hsl(0, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:0, html.var.auto .sf-c-txt-indianred\:0 { color: hsl(0, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:10, html.var.auto .sf-c-txt-indianred\:10 { color: hsl(0, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:20, html.var.auto .sf-c-txt-indianred\:20 { color: hsl(0, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:30, html.var.auto .sf-c-txt-indianred\:30 { color: hsl(0, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:40, html.var.auto .sf-c-txt-indianred\:40 { color: hsl(0, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:50, html.var.auto .sf-c-txt-indianred\:50 { color: hsl(0, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:60, html.var.auto .sf-c-txt-indianred\:60 { color: hsl(0, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:70, html.var.auto .sf-c-txt-indianred\:70 { color: hsl(0, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:80, html.var.auto .sf-c-txt-indianred\:80 { color: hsl(0, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:90, html.var.auto .sf-c-txt-indianred\:90 { color: hsl(0, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:100, html.var.auto .sf-c-txt-indianred\:100 { color: hsl(0, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:dark, html.auto .sf-c-txt-indianred\:dark { color: hsl(0, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:0\:dark, html.auto .sf-c-txt-indianred\:0\:dark { color: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:10\:dark, html.auto .sf-c-txt-indianred\:10\:dark { color: hsl(0, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:20\:dark, html.auto .sf-c-txt-indianred\:20\:dark { color: hsl(0, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:30\:dark, html.auto .sf-c-txt-indianred\:30\:dark { color: hsl(0, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:40\:dark, html.auto .sf-c-txt-indianred\:40\:dark { color: hsl(0, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:50\:dark, html.auto .sf-c-txt-indianred\:50\:dark { color: hsl(0, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:60\:dark, html.auto .sf-c-txt-indianred\:60\:dark { color: hsl(0, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:70\:dark, html.auto .sf-c-txt-indianred\:70\:dark { color: hsl(0, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:80\:dark, html.auto .sf-c-txt-indianred\:80\:dark { color: hsl(0, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:90\:dark, html.auto .sf-c-txt-indianred\:90\:dark { color: hsl(0, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:100\:dark, html.auto .sf-c-txt-indianred\:100\:dark { color: hsl(0, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:dark, html.var.auto .sf-c-txt-indianred\:dark { color: hsl(0, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:0\:dark, html.var.auto .sf-c-txt-indianred\:0\:dark { color: hsl(0, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:10\:dark, html.var.auto .sf-c-txt-indianred\:10\:dark { color: hsl(0, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:20\:dark, html.var.auto .sf-c-txt-indianred\:20\:dark { color: hsl(0, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:30\:dark, html.var.auto .sf-c-txt-indianred\:30\:dark { color: hsl(0, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:40\:dark, html.var.auto .sf-c-txt-indianred\:40\:dark { color: hsl(0, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:50\:dark, html.var.auto .sf-c-txt-indianred\:50\:dark { color: hsl(0, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:60\:dark, html.var.auto .sf-c-txt-indianred\:60\:dark { color: hsl(0, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:70\:dark, html.var.auto .sf-c-txt-indianred\:70\:dark { color: hsl(0, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:80\:dark, html.var.auto .sf-c-txt-indianred\:80\:dark { color: hsl(0, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:90\:dark, html.var.auto .sf-c-txt-indianred\:90\:dark { color: hsl(0, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:100\:dark, html.var.auto .sf-c-txt-indianred\:100\:dark { color: hsl(0, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/indigo.css b/src/colors/10/indigo.css index 68129f1..5b92ef9 100644 --- a/src/colors/10/indigo.css +++ b/src/colors/10/indigo.css @@ -1,4 +1,4 @@ -:root { +[class*='indigo'] { --sf-c-indigo: 275 100% 25%; --sf-c-indigo-0: 275 100% 0%; --sf-c-indigo-10: 275 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-indigo\:100\:dark, html.dark .sf-c-txt-ind html.var[data-theme='auto'] .sf-c-indigo\:90\:dark, html.var.auto .sf-c-indigo\:90\:dark { color: hsl(275, 100%, 90%); background: hsl(275, 100%, 10%) } html.var[data-theme='auto'] .sf-c-indigo\:100\:dark, html.var.auto .sf-c-indigo\:100\:dark { color: hsl(275, 100%, 90%); background: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo, html.auto .sf-c-txt-indigo { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:0, html.auto .sf-c-txt-indigo\:0 { color: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:10, html.auto .sf-c-txt-indigo\:10 { color: hsl(275, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:20, html.auto .sf-c-txt-indigo\:20 { color: hsl(275, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:30, html.auto .sf-c-txt-indigo\:30 { color: hsl(275, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:40, html.auto .sf-c-txt-indigo\:40 { color: hsl(275, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:50, html.auto .sf-c-txt-indigo\:50 { color: hsl(275, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:60, html.auto .sf-c-txt-indigo\:60 { color: hsl(275, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:70, html.auto .sf-c-txt-indigo\:70 { color: hsl(275, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:80, html.auto .sf-c-txt-indigo\:80 { color: hsl(275, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:90, html.auto .sf-c-txt-indigo\:90 { color: hsl(275, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:100, html.auto .sf-c-txt-indigo\:100 { color: hsl(275, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indigo, html.var.auto .sf-c-txt-indigo { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:0, html.var.auto .sf-c-txt-indigo\:0 { color: hsl(275, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:10, html.var.auto .sf-c-txt-indigo\:10 { color: hsl(275, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:20, html.var.auto .sf-c-txt-indigo\:20 { color: hsl(275, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:30, html.var.auto .sf-c-txt-indigo\:30 { color: hsl(275, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:40, html.var.auto .sf-c-txt-indigo\:40 { color: hsl(275, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:50, html.var.auto .sf-c-txt-indigo\:50 { color: hsl(275, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:60, html.var.auto .sf-c-txt-indigo\:60 { color: hsl(275, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:70, html.var.auto .sf-c-txt-indigo\:70 { color: hsl(275, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:80, html.var.auto .sf-c-txt-indigo\:80 { color: hsl(275, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:90, html.var.auto .sf-c-txt-indigo\:90 { color: hsl(275, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:100, html.var.auto .sf-c-txt-indigo\:100 { color: hsl(275, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:dark, html.auto .sf-c-txt-indigo\:dark { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:0\:dark, html.auto .sf-c-txt-indigo\:0\:dark { color: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:10\:dark, html.auto .sf-c-txt-indigo\:10\:dark { color: hsl(275, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:20\:dark, html.auto .sf-c-txt-indigo\:20\:dark { color: hsl(275, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:30\:dark, html.auto .sf-c-txt-indigo\:30\:dark { color: hsl(275, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:40\:dark, html.auto .sf-c-txt-indigo\:40\:dark { color: hsl(275, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:50\:dark, html.auto .sf-c-txt-indigo\:50\:dark { color: hsl(275, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:60\:dark, html.auto .sf-c-txt-indigo\:60\:dark { color: hsl(275, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:70\:dark, html.auto .sf-c-txt-indigo\:70\:dark { color: hsl(275, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:80\:dark, html.auto .sf-c-txt-indigo\:80\:dark { color: hsl(275, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:90\:dark, html.auto .sf-c-txt-indigo\:90\:dark { color: hsl(275, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:100\:dark, html.auto .sf-c-txt-indigo\:100\:dark { color: hsl(275, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:dark, html.var.auto .sf-c-txt-indigo\:dark { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:0\:dark, html.var.auto .sf-c-txt-indigo\:0\:dark { color: hsl(275, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:10\:dark, html.var.auto .sf-c-txt-indigo\:10\:dark { color: hsl(275, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:20\:dark, html.var.auto .sf-c-txt-indigo\:20\:dark { color: hsl(275, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:30\:dark, html.var.auto .sf-c-txt-indigo\:30\:dark { color: hsl(275, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:40\:dark, html.var.auto .sf-c-txt-indigo\:40\:dark { color: hsl(275, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:50\:dark, html.var.auto .sf-c-txt-indigo\:50\:dark { color: hsl(275, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:60\:dark, html.var.auto .sf-c-txt-indigo\:60\:dark { color: hsl(275, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:70\:dark, html.var.auto .sf-c-txt-indigo\:70\:dark { color: hsl(275, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:80\:dark, html.var.auto .sf-c-txt-indigo\:80\:dark { color: hsl(275, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:90\:dark, html.var.auto .sf-c-txt-indigo\:90\:dark { color: hsl(275, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:100\:dark, html.var.auto .sf-c-txt-indigo\:100\:dark { color: hsl(275, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/ivory.css b/src/colors/10/ivory.css index fcc7cbc..41ad3c3 100644 --- a/src/colors/10/ivory.css +++ b/src/colors/10/ivory.css @@ -1,4 +1,4 @@ -:root { +[class*='ivory'] { --sf-c-ivory: 60 100% 97%; --sf-c-ivory-0: 60 100% 0%; --sf-c-ivory-10: 60 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-ivory\:100\:dark, html.dark .sf-c-txt-ivor html.var[data-theme='auto'] .sf-c-ivory\:90\:dark, html.var.auto .sf-c-ivory\:90\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 10%) } html.var[data-theme='auto'] .sf-c-ivory\:100\:dark, html.var.auto .sf-c-ivory\:100\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory, html.auto .sf-c-txt-ivory { color: hsl(60, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:0, html.auto .sf-c-txt-ivory\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:10, html.auto .sf-c-txt-ivory\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:20, html.auto .sf-c-txt-ivory\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:30, html.auto .sf-c-txt-ivory\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:40, html.auto .sf-c-txt-ivory\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:50, html.auto .sf-c-txt-ivory\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:60, html.auto .sf-c-txt-ivory\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:70, html.auto .sf-c-txt-ivory\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:80, html.auto .sf-c-txt-ivory\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:90, html.auto .sf-c-txt-ivory\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:100, html.auto .sf-c-txt-ivory\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ivory, html.var.auto .sf-c-txt-ivory { color: hsl(60, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:0, html.var.auto .sf-c-txt-ivory\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:10, html.var.auto .sf-c-txt-ivory\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:20, html.var.auto .sf-c-txt-ivory\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:30, html.var.auto .sf-c-txt-ivory\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:40, html.var.auto .sf-c-txt-ivory\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:50, html.var.auto .sf-c-txt-ivory\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:60, html.var.auto .sf-c-txt-ivory\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:70, html.var.auto .sf-c-txt-ivory\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:80, html.var.auto .sf-c-txt-ivory\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:90, html.var.auto .sf-c-txt-ivory\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:100, html.var.auto .sf-c-txt-ivory\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:dark, html.auto .sf-c-txt-ivory\:dark { color: hsl(60, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:0\:dark, html.auto .sf-c-txt-ivory\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:10\:dark, html.auto .sf-c-txt-ivory\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:20\:dark, html.auto .sf-c-txt-ivory\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:30\:dark, html.auto .sf-c-txt-ivory\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:40\:dark, html.auto .sf-c-txt-ivory\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:50\:dark, html.auto .sf-c-txt-ivory\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:60\:dark, html.auto .sf-c-txt-ivory\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:70\:dark, html.auto .sf-c-txt-ivory\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:80\:dark, html.auto .sf-c-txt-ivory\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:90\:dark, html.auto .sf-c-txt-ivory\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:100\:dark, html.auto .sf-c-txt-ivory\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:dark, html.var.auto .sf-c-txt-ivory\:dark { color: hsl(60, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:0\:dark, html.var.auto .sf-c-txt-ivory\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:10\:dark, html.var.auto .sf-c-txt-ivory\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:20\:dark, html.var.auto .sf-c-txt-ivory\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:30\:dark, html.var.auto .sf-c-txt-ivory\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:40\:dark, html.var.auto .sf-c-txt-ivory\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:50\:dark, html.var.auto .sf-c-txt-ivory\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:60\:dark, html.var.auto .sf-c-txt-ivory\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:70\:dark, html.var.auto .sf-c-txt-ivory\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:80\:dark, html.var.auto .sf-c-txt-ivory\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:90\:dark, html.var.auto .sf-c-txt-ivory\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:100\:dark, html.var.auto .sf-c-txt-ivory\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/khaki.css b/src/colors/10/khaki.css index fc81883..da37ecf 100644 --- a/src/colors/10/khaki.css +++ b/src/colors/10/khaki.css @@ -1,4 +1,4 @@ -:root { +[class*='khaki'] { --sf-c-khaki: 54 77% 75%; --sf-c-khaki-0: 54 77% 0%; --sf-c-khaki-10: 54 77% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-khaki\:100\:dark, html.dark .sf-c-txt-khak html.var[data-theme='auto'] .sf-c-khaki\:90\:dark, html.var.auto .sf-c-khaki\:90\:dark { color: hsl(54, 77%, 90%); background: hsl(54, 77%, 10%) } html.var[data-theme='auto'] .sf-c-khaki\:100\:dark, html.var.auto .sf-c-khaki\:100\:dark { color: hsl(54, 77%, 90%); background: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki, html.auto .sf-c-txt-khaki { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:0, html.auto .sf-c-txt-khaki\:0 { color: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:10, html.auto .sf-c-txt-khaki\:10 { color: hsl(54, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:20, html.auto .sf-c-txt-khaki\:20 { color: hsl(54, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:30, html.auto .sf-c-txt-khaki\:30 { color: hsl(54, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:40, html.auto .sf-c-txt-khaki\:40 { color: hsl(54, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:50, html.auto .sf-c-txt-khaki\:50 { color: hsl(54, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:60, html.auto .sf-c-txt-khaki\:60 { color: hsl(54, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:70, html.auto .sf-c-txt-khaki\:70 { color: hsl(54, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:80, html.auto .sf-c-txt-khaki\:80 { color: hsl(54, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:90, html.auto .sf-c-txt-khaki\:90 { color: hsl(54, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:100, html.auto .sf-c-txt-khaki\:100 { color: hsl(54, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-khaki, html.var.auto .sf-c-txt-khaki { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:0, html.var.auto .sf-c-txt-khaki\:0 { color: hsl(54, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:10, html.var.auto .sf-c-txt-khaki\:10 { color: hsl(54, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:20, html.var.auto .sf-c-txt-khaki\:20 { color: hsl(54, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:30, html.var.auto .sf-c-txt-khaki\:30 { color: hsl(54, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:40, html.var.auto .sf-c-txt-khaki\:40 { color: hsl(54, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:50, html.var.auto .sf-c-txt-khaki\:50 { color: hsl(54, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:60, html.var.auto .sf-c-txt-khaki\:60 { color: hsl(54, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:70, html.var.auto .sf-c-txt-khaki\:70 { color: hsl(54, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:80, html.var.auto .sf-c-txt-khaki\:80 { color: hsl(54, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:90, html.var.auto .sf-c-txt-khaki\:90 { color: hsl(54, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:100, html.var.auto .sf-c-txt-khaki\:100 { color: hsl(54, 77%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:dark, html.auto .sf-c-txt-khaki\:dark { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:0\:dark, html.auto .sf-c-txt-khaki\:0\:dark { color: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:10\:dark, html.auto .sf-c-txt-khaki\:10\:dark { color: hsl(54, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:20\:dark, html.auto .sf-c-txt-khaki\:20\:dark { color: hsl(54, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:30\:dark, html.auto .sf-c-txt-khaki\:30\:dark { color: hsl(54, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:40\:dark, html.auto .sf-c-txt-khaki\:40\:dark { color: hsl(54, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:50\:dark, html.auto .sf-c-txt-khaki\:50\:dark { color: hsl(54, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:60\:dark, html.auto .sf-c-txt-khaki\:60\:dark { color: hsl(54, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:70\:dark, html.auto .sf-c-txt-khaki\:70\:dark { color: hsl(54, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:80\:dark, html.auto .sf-c-txt-khaki\:80\:dark { color: hsl(54, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:90\:dark, html.auto .sf-c-txt-khaki\:90\:dark { color: hsl(54, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:100\:dark, html.auto .sf-c-txt-khaki\:100\:dark { color: hsl(54, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:dark, html.var.auto .sf-c-txt-khaki\:dark { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:0\:dark, html.var.auto .sf-c-txt-khaki\:0\:dark { color: hsl(54, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:10\:dark, html.var.auto .sf-c-txt-khaki\:10\:dark { color: hsl(54, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:20\:dark, html.var.auto .sf-c-txt-khaki\:20\:dark { color: hsl(54, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:30\:dark, html.var.auto .sf-c-txt-khaki\:30\:dark { color: hsl(54, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:40\:dark, html.var.auto .sf-c-txt-khaki\:40\:dark { color: hsl(54, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:50\:dark, html.var.auto .sf-c-txt-khaki\:50\:dark { color: hsl(54, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:60\:dark, html.var.auto .sf-c-txt-khaki\:60\:dark { color: hsl(54, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:70\:dark, html.var.auto .sf-c-txt-khaki\:70\:dark { color: hsl(54, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:80\:dark, html.var.auto .sf-c-txt-khaki\:80\:dark { color: hsl(54, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:90\:dark, html.var.auto .sf-c-txt-khaki\:90\:dark { color: hsl(54, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:100\:dark, html.var.auto .sf-c-txt-khaki\:100\:dark { color: hsl(54, 77%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lavender.css b/src/colors/10/lavender.css index 7ae8ee2..1ecd559 100644 --- a/src/colors/10/lavender.css +++ b/src/colors/10/lavender.css @@ -1,4 +1,4 @@ -:root { +[class*='lavender'] { --sf-c-lavender: 240 67% 94%; --sf-c-lavender-0: 240 67% 0%; --sf-c-lavender-10: 240 67% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lavender\:100\:dark, html.dark .sf-c-txt-l html.var[data-theme='auto'] .sf-c-lavender\:90\:dark, html.var.auto .sf-c-lavender\:90\:dark { color: hsl(240, 67%, 90%); background: hsl(240, 67%, 10%) } html.var[data-theme='auto'] .sf-c-lavender\:100\:dark, html.var.auto .sf-c-lavender\:100\:dark { color: hsl(240, 67%, 90%); background: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender, html.auto .sf-c-txt-lavender { color: hsl(240, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:0, html.auto .sf-c-txt-lavender\:0 { color: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:10, html.auto .sf-c-txt-lavender\:10 { color: hsl(240, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:20, html.auto .sf-c-txt-lavender\:20 { color: hsl(240, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:30, html.auto .sf-c-txt-lavender\:30 { color: hsl(240, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:40, html.auto .sf-c-txt-lavender\:40 { color: hsl(240, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:50, html.auto .sf-c-txt-lavender\:50 { color: hsl(240, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:60, html.auto .sf-c-txt-lavender\:60 { color: hsl(240, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:70, html.auto .sf-c-txt-lavender\:70 { color: hsl(240, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:80, html.auto .sf-c-txt-lavender\:80 { color: hsl(240, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:90, html.auto .sf-c-txt-lavender\:90 { color: hsl(240, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:100, html.auto .sf-c-txt-lavender\:100 { color: hsl(240, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavender, html.var.auto .sf-c-txt-lavender { color: hsl(240, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:0, html.var.auto .sf-c-txt-lavender\:0 { color: hsl(240, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:10, html.var.auto .sf-c-txt-lavender\:10 { color: hsl(240, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:20, html.var.auto .sf-c-txt-lavender\:20 { color: hsl(240, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:30, html.var.auto .sf-c-txt-lavender\:30 { color: hsl(240, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:40, html.var.auto .sf-c-txt-lavender\:40 { color: hsl(240, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:50, html.var.auto .sf-c-txt-lavender\:50 { color: hsl(240, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:60, html.var.auto .sf-c-txt-lavender\:60 { color: hsl(240, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:70, html.var.auto .sf-c-txt-lavender\:70 { color: hsl(240, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:80, html.var.auto .sf-c-txt-lavender\:80 { color: hsl(240, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:90, html.var.auto .sf-c-txt-lavender\:90 { color: hsl(240, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:100, html.var.auto .sf-c-txt-lavender\:100 { color: hsl(240, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:dark, html.auto .sf-c-txt-lavender\:dark { color: hsl(240, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:0\:dark, html.auto .sf-c-txt-lavender\:0\:dark { color: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:10\:dark, html.auto .sf-c-txt-lavender\:10\:dark { color: hsl(240, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:20\:dark, html.auto .sf-c-txt-lavender\:20\:dark { color: hsl(240, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:30\:dark, html.auto .sf-c-txt-lavender\:30\:dark { color: hsl(240, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:40\:dark, html.auto .sf-c-txt-lavender\:40\:dark { color: hsl(240, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:50\:dark, html.auto .sf-c-txt-lavender\:50\:dark { color: hsl(240, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:60\:dark, html.auto .sf-c-txt-lavender\:60\:dark { color: hsl(240, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:70\:dark, html.auto .sf-c-txt-lavender\:70\:dark { color: hsl(240, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:80\:dark, html.auto .sf-c-txt-lavender\:80\:dark { color: hsl(240, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:90\:dark, html.auto .sf-c-txt-lavender\:90\:dark { color: hsl(240, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:100\:dark, html.auto .sf-c-txt-lavender\:100\:dark { color: hsl(240, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:dark, html.var.auto .sf-c-txt-lavender\:dark { color: hsl(240, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:0\:dark, html.var.auto .sf-c-txt-lavender\:0\:dark { color: hsl(240, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:10\:dark, html.var.auto .sf-c-txt-lavender\:10\:dark { color: hsl(240, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:20\:dark, html.var.auto .sf-c-txt-lavender\:20\:dark { color: hsl(240, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:30\:dark, html.var.auto .sf-c-txt-lavender\:30\:dark { color: hsl(240, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:40\:dark, html.var.auto .sf-c-txt-lavender\:40\:dark { color: hsl(240, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:50\:dark, html.var.auto .sf-c-txt-lavender\:50\:dark { color: hsl(240, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:60\:dark, html.var.auto .sf-c-txt-lavender\:60\:dark { color: hsl(240, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:70\:dark, html.var.auto .sf-c-txt-lavender\:70\:dark { color: hsl(240, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:80\:dark, html.var.auto .sf-c-txt-lavender\:80\:dark { color: hsl(240, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:90\:dark, html.var.auto .sf-c-txt-lavender\:90\:dark { color: hsl(240, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:100\:dark, html.var.auto .sf-c-txt-lavender\:100\:dark { color: hsl(240, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lavenderblush.css b/src/colors/10/lavenderblush.css index c9f00ab..2cecea4 100644 --- a/src/colors/10/lavenderblush.css +++ b/src/colors/10/lavenderblush.css @@ -1,4 +1,4 @@ -:root { +[class*='lavenderblush'] { --sf-c-lavenderblush: 340 100% 97%; --sf-c-lavenderblush-0: 340 100% 0%; --sf-c-lavenderblush-10: 340 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lavenderblush\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-lavenderblush\:90\:dark, html.var.auto .sf-c-lavenderblush\:90\:dark { color: hsl(340, 100%, 90%); background: hsl(340, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lavenderblush\:100\:dark, html.var.auto .sf-c-lavenderblush\:100\:dark { color: hsl(340, 100%, 90%); background: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush, html.auto .sf-c-txt-lavenderblush { color: hsl(340, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0, html.auto .sf-c-txt-lavenderblush\:0 { color: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10, html.auto .sf-c-txt-lavenderblush\:10 { color: hsl(340, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20, html.auto .sf-c-txt-lavenderblush\:20 { color: hsl(340, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30, html.auto .sf-c-txt-lavenderblush\:30 { color: hsl(340, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40, html.auto .sf-c-txt-lavenderblush\:40 { color: hsl(340, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50, html.auto .sf-c-txt-lavenderblush\:50 { color: hsl(340, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60, html.auto .sf-c-txt-lavenderblush\:60 { color: hsl(340, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70, html.auto .sf-c-txt-lavenderblush\:70 { color: hsl(340, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80, html.auto .sf-c-txt-lavenderblush\:80 { color: hsl(340, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90, html.auto .sf-c-txt-lavenderblush\:90 { color: hsl(340, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100, html.auto .sf-c-txt-lavenderblush\:100 { color: hsl(340, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush, html.var.auto .sf-c-txt-lavenderblush { color: hsl(340, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0, html.var.auto .sf-c-txt-lavenderblush\:0 { color: hsl(340, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10, html.var.auto .sf-c-txt-lavenderblush\:10 { color: hsl(340, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20, html.var.auto .sf-c-txt-lavenderblush\:20 { color: hsl(340, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30, html.var.auto .sf-c-txt-lavenderblush\:30 { color: hsl(340, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40, html.var.auto .sf-c-txt-lavenderblush\:40 { color: hsl(340, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50, html.var.auto .sf-c-txt-lavenderblush\:50 { color: hsl(340, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60, html.var.auto .sf-c-txt-lavenderblush\:60 { color: hsl(340, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70, html.var.auto .sf-c-txt-lavenderblush\:70 { color: hsl(340, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80, html.var.auto .sf-c-txt-lavenderblush\:80 { color: hsl(340, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90, html.var.auto .sf-c-txt-lavenderblush\:90 { color: hsl(340, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100, html.var.auto .sf-c-txt-lavenderblush\:100 { color: hsl(340, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:dark, html.auto .sf-c-txt-lavenderblush\:dark { color: hsl(340, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0\:dark, html.auto .sf-c-txt-lavenderblush\:0\:dark { color: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10\:dark, html.auto .sf-c-txt-lavenderblush\:10\:dark { color: hsl(340, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20\:dark, html.auto .sf-c-txt-lavenderblush\:20\:dark { color: hsl(340, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30\:dark, html.auto .sf-c-txt-lavenderblush\:30\:dark { color: hsl(340, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40\:dark, html.auto .sf-c-txt-lavenderblush\:40\:dark { color: hsl(340, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50\:dark, html.auto .sf-c-txt-lavenderblush\:50\:dark { color: hsl(340, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60\:dark, html.auto .sf-c-txt-lavenderblush\:60\:dark { color: hsl(340, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70\:dark, html.auto .sf-c-txt-lavenderblush\:70\:dark { color: hsl(340, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80\:dark, html.auto .sf-c-txt-lavenderblush\:80\:dark { color: hsl(340, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90\:dark, html.auto .sf-c-txt-lavenderblush\:90\:dark { color: hsl(340, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100\:dark, html.auto .sf-c-txt-lavenderblush\:100\:dark { color: hsl(340, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:dark, html.var.auto .sf-c-txt-lavenderblush\:dark { color: hsl(340, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0\:dark, html.var.auto .sf-c-txt-lavenderblush\:0\:dark { color: hsl(340, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10\:dark, html.var.auto .sf-c-txt-lavenderblush\:10\:dark { color: hsl(340, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20\:dark, html.var.auto .sf-c-txt-lavenderblush\:20\:dark { color: hsl(340, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30\:dark, html.var.auto .sf-c-txt-lavenderblush\:30\:dark { color: hsl(340, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40\:dark, html.var.auto .sf-c-txt-lavenderblush\:40\:dark { color: hsl(340, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50\:dark, html.var.auto .sf-c-txt-lavenderblush\:50\:dark { color: hsl(340, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60\:dark, html.var.auto .sf-c-txt-lavenderblush\:60\:dark { color: hsl(340, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70\:dark, html.var.auto .sf-c-txt-lavenderblush\:70\:dark { color: hsl(340, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80\:dark, html.var.auto .sf-c-txt-lavenderblush\:80\:dark { color: hsl(340, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90\:dark, html.var.auto .sf-c-txt-lavenderblush\:90\:dark { color: hsl(340, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100\:dark, html.var.auto .sf-c-txt-lavenderblush\:100\:dark { color: hsl(340, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lawngreen.css b/src/colors/10/lawngreen.css index 4f92060..ecb5417 100644 --- a/src/colors/10/lawngreen.css +++ b/src/colors/10/lawngreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lawngreen'] { --sf-c-lawngreen: 90 100% 49%; --sf-c-lawngreen-0: 90 100% 0%; --sf-c-lawngreen-10: 90 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lawngreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lawngreen\:90\:dark, html.var.auto .sf-c-lawngreen\:90\:dark { color: hsl(90, 100%, 90%); background: hsl(90, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lawngreen\:100\:dark, html.var.auto .sf-c-lawngreen\:100\:dark { color: hsl(90, 100%, 90%); background: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen, html.auto .sf-c-txt-lawngreen { color: hsl(90, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0, html.auto .sf-c-txt-lawngreen\:0 { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10, html.auto .sf-c-txt-lawngreen\:10 { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20, html.auto .sf-c-txt-lawngreen\:20 { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30, html.auto .sf-c-txt-lawngreen\:30 { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40, html.auto .sf-c-txt-lawngreen\:40 { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50, html.auto .sf-c-txt-lawngreen\:50 { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60, html.auto .sf-c-txt-lawngreen\:60 { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70, html.auto .sf-c-txt-lawngreen\:70 { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80, html.auto .sf-c-txt-lawngreen\:80 { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90, html.auto .sf-c-txt-lawngreen\:90 { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100, html.auto .sf-c-txt-lawngreen\:100 { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen, html.var.auto .sf-c-txt-lawngreen { color: hsl(90, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0, html.var.auto .sf-c-txt-lawngreen\:0 { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10, html.var.auto .sf-c-txt-lawngreen\:10 { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20, html.var.auto .sf-c-txt-lawngreen\:20 { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30, html.var.auto .sf-c-txt-lawngreen\:30 { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40, html.var.auto .sf-c-txt-lawngreen\:40 { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50, html.var.auto .sf-c-txt-lawngreen\:50 { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60, html.var.auto .sf-c-txt-lawngreen\:60 { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70, html.var.auto .sf-c-txt-lawngreen\:70 { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80, html.var.auto .sf-c-txt-lawngreen\:80 { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90, html.var.auto .sf-c-txt-lawngreen\:90 { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100, html.var.auto .sf-c-txt-lawngreen\:100 { color: hsl(90, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:dark, html.auto .sf-c-txt-lawngreen\:dark { color: hsl(90, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0\:dark, html.auto .sf-c-txt-lawngreen\:0\:dark { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10\:dark, html.auto .sf-c-txt-lawngreen\:10\:dark { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20\:dark, html.auto .sf-c-txt-lawngreen\:20\:dark { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30\:dark, html.auto .sf-c-txt-lawngreen\:30\:dark { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40\:dark, html.auto .sf-c-txt-lawngreen\:40\:dark { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50\:dark, html.auto .sf-c-txt-lawngreen\:50\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60\:dark, html.auto .sf-c-txt-lawngreen\:60\:dark { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70\:dark, html.auto .sf-c-txt-lawngreen\:70\:dark { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80\:dark, html.auto .sf-c-txt-lawngreen\:80\:dark { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90\:dark, html.auto .sf-c-txt-lawngreen\:90\:dark { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100\:dark, html.auto .sf-c-txt-lawngreen\:100\:dark { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:dark, html.var.auto .sf-c-txt-lawngreen\:dark { color: hsl(90, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0\:dark, html.var.auto .sf-c-txt-lawngreen\:0\:dark { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10\:dark, html.var.auto .sf-c-txt-lawngreen\:10\:dark { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20\:dark, html.var.auto .sf-c-txt-lawngreen\:20\:dark { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30\:dark, html.var.auto .sf-c-txt-lawngreen\:30\:dark { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40\:dark, html.var.auto .sf-c-txt-lawngreen\:40\:dark { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50\:dark, html.var.auto .sf-c-txt-lawngreen\:50\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60\:dark, html.var.auto .sf-c-txt-lawngreen\:60\:dark { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70\:dark, html.var.auto .sf-c-txt-lawngreen\:70\:dark { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80\:dark, html.var.auto .sf-c-txt-lawngreen\:80\:dark { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90\:dark, html.var.auto .sf-c-txt-lawngreen\:90\:dark { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100\:dark, html.var.auto .sf-c-txt-lawngreen\:100\:dark { color: hsl(90, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lemonchiffon.css b/src/colors/10/lemonchiffon.css index b8bc1f0..6a36458 100644 --- a/src/colors/10/lemonchiffon.css +++ b/src/colors/10/lemonchiffon.css @@ -1,4 +1,4 @@ -:root { +[class*='lemonchiffon'] { --sf-c-lemonchiffon: 54 100% 90%; --sf-c-lemonchiffon-0: 54 100% 0%; --sf-c-lemonchiffon-10: 54 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lemonchiffon\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-lemonchiffon\:90\:dark, html.var.auto .sf-c-lemonchiffon\:90\:dark { color: hsl(54, 100%, 90%); background: hsl(54, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lemonchiffon\:100\:dark, html.var.auto .sf-c-lemonchiffon\:100\:dark { color: hsl(54, 100%, 90%); background: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon, html.auto .sf-c-txt-lemonchiffon { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0, html.auto .sf-c-txt-lemonchiffon\:0 { color: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10, html.auto .sf-c-txt-lemonchiffon\:10 { color: hsl(54, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20, html.auto .sf-c-txt-lemonchiffon\:20 { color: hsl(54, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30, html.auto .sf-c-txt-lemonchiffon\:30 { color: hsl(54, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40, html.auto .sf-c-txt-lemonchiffon\:40 { color: hsl(54, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50, html.auto .sf-c-txt-lemonchiffon\:50 { color: hsl(54, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60, html.auto .sf-c-txt-lemonchiffon\:60 { color: hsl(54, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70, html.auto .sf-c-txt-lemonchiffon\:70 { color: hsl(54, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80, html.auto .sf-c-txt-lemonchiffon\:80 { color: hsl(54, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90, html.auto .sf-c-txt-lemonchiffon\:90 { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100, html.auto .sf-c-txt-lemonchiffon\:100 { color: hsl(54, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon, html.var.auto .sf-c-txt-lemonchiffon { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0, html.var.auto .sf-c-txt-lemonchiffon\:0 { color: hsl(54, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10, html.var.auto .sf-c-txt-lemonchiffon\:10 { color: hsl(54, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20, html.var.auto .sf-c-txt-lemonchiffon\:20 { color: hsl(54, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30, html.var.auto .sf-c-txt-lemonchiffon\:30 { color: hsl(54, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40, html.var.auto .sf-c-txt-lemonchiffon\:40 { color: hsl(54, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50, html.var.auto .sf-c-txt-lemonchiffon\:50 { color: hsl(54, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60, html.var.auto .sf-c-txt-lemonchiffon\:60 { color: hsl(54, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70, html.var.auto .sf-c-txt-lemonchiffon\:70 { color: hsl(54, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80, html.var.auto .sf-c-txt-lemonchiffon\:80 { color: hsl(54, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90, html.var.auto .sf-c-txt-lemonchiffon\:90 { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100, html.var.auto .sf-c-txt-lemonchiffon\:100 { color: hsl(54, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:dark, html.auto .sf-c-txt-lemonchiffon\:dark { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0\:dark, html.auto .sf-c-txt-lemonchiffon\:0\:dark { color: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10\:dark, html.auto .sf-c-txt-lemonchiffon\:10\:dark { color: hsl(54, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20\:dark, html.auto .sf-c-txt-lemonchiffon\:20\:dark { color: hsl(54, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30\:dark, html.auto .sf-c-txt-lemonchiffon\:30\:dark { color: hsl(54, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40\:dark, html.auto .sf-c-txt-lemonchiffon\:40\:dark { color: hsl(54, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50\:dark, html.auto .sf-c-txt-lemonchiffon\:50\:dark { color: hsl(54, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60\:dark, html.auto .sf-c-txt-lemonchiffon\:60\:dark { color: hsl(54, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70\:dark, html.auto .sf-c-txt-lemonchiffon\:70\:dark { color: hsl(54, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80\:dark, html.auto .sf-c-txt-lemonchiffon\:80\:dark { color: hsl(54, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90\:dark, html.auto .sf-c-txt-lemonchiffon\:90\:dark { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100\:dark, html.auto .sf-c-txt-lemonchiffon\:100\:dark { color: hsl(54, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:dark, html.var.auto .sf-c-txt-lemonchiffon\:dark { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0\:dark, html.var.auto .sf-c-txt-lemonchiffon\:0\:dark { color: hsl(54, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10\:dark, html.var.auto .sf-c-txt-lemonchiffon\:10\:dark { color: hsl(54, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20\:dark, html.var.auto .sf-c-txt-lemonchiffon\:20\:dark { color: hsl(54, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30\:dark, html.var.auto .sf-c-txt-lemonchiffon\:30\:dark { color: hsl(54, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40\:dark, html.var.auto .sf-c-txt-lemonchiffon\:40\:dark { color: hsl(54, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50\:dark, html.var.auto .sf-c-txt-lemonchiffon\:50\:dark { color: hsl(54, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60\:dark, html.var.auto .sf-c-txt-lemonchiffon\:60\:dark { color: hsl(54, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70\:dark, html.var.auto .sf-c-txt-lemonchiffon\:70\:dark { color: hsl(54, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80\:dark, html.var.auto .sf-c-txt-lemonchiffon\:80\:dark { color: hsl(54, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90\:dark, html.var.auto .sf-c-txt-lemonchiffon\:90\:dark { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100\:dark, html.var.auto .sf-c-txt-lemonchiffon\:100\:dark { color: hsl(54, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightblue.css b/src/colors/10/lightblue.css index 6ad6654..32d031b 100644 --- a/src/colors/10/lightblue.css +++ b/src/colors/10/lightblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightblue'] { --sf-c-lightblue: 195 53% 79%; --sf-c-lightblue-0: 195 53% 0%; --sf-c-lightblue-10: 195 53% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightblue\:90\:dark, html.var.auto .sf-c-lightblue\:90\:dark { color: hsl(195, 53%, 90%); background: hsl(195, 53%, 10%) } html.var[data-theme='auto'] .sf-c-lightblue\:100\:dark, html.var.auto .sf-c-lightblue\:100\:dark { color: hsl(195, 53%, 90%); background: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue, html.auto .sf-c-txt-lightblue { color: hsl(195, 53%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:0, html.auto .sf-c-txt-lightblue\:0 { color: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:10, html.auto .sf-c-txt-lightblue\:10 { color: hsl(195, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:20, html.auto .sf-c-txt-lightblue\:20 { color: hsl(195, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:30, html.auto .sf-c-txt-lightblue\:30 { color: hsl(195, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:40, html.auto .sf-c-txt-lightblue\:40 { color: hsl(195, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:50, html.auto .sf-c-txt-lightblue\:50 { color: hsl(195, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:60, html.auto .sf-c-txt-lightblue\:60 { color: hsl(195, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:70, html.auto .sf-c-txt-lightblue\:70 { color: hsl(195, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:80, html.auto .sf-c-txt-lightblue\:80 { color: hsl(195, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:90, html.auto .sf-c-txt-lightblue\:90 { color: hsl(195, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:100, html.auto .sf-c-txt-lightblue\:100 { color: hsl(195, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue, html.var.auto .sf-c-txt-lightblue { color: hsl(195, 53%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:0, html.var.auto .sf-c-txt-lightblue\:0 { color: hsl(195, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:10, html.var.auto .sf-c-txt-lightblue\:10 { color: hsl(195, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:20, html.var.auto .sf-c-txt-lightblue\:20 { color: hsl(195, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:30, html.var.auto .sf-c-txt-lightblue\:30 { color: hsl(195, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:40, html.var.auto .sf-c-txt-lightblue\:40 { color: hsl(195, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:50, html.var.auto .sf-c-txt-lightblue\:50 { color: hsl(195, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:60, html.var.auto .sf-c-txt-lightblue\:60 { color: hsl(195, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:70, html.var.auto .sf-c-txt-lightblue\:70 { color: hsl(195, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:80, html.var.auto .sf-c-txt-lightblue\:80 { color: hsl(195, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:90, html.var.auto .sf-c-txt-lightblue\:90 { color: hsl(195, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:100, html.var.auto .sf-c-txt-lightblue\:100 { color: hsl(195, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:dark, html.auto .sf-c-txt-lightblue\:dark { color: hsl(195, 53%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:0\:dark, html.auto .sf-c-txt-lightblue\:0\:dark { color: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:10\:dark, html.auto .sf-c-txt-lightblue\:10\:dark { color: hsl(195, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:20\:dark, html.auto .sf-c-txt-lightblue\:20\:dark { color: hsl(195, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:30\:dark, html.auto .sf-c-txt-lightblue\:30\:dark { color: hsl(195, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:40\:dark, html.auto .sf-c-txt-lightblue\:40\:dark { color: hsl(195, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:50\:dark, html.auto .sf-c-txt-lightblue\:50\:dark { color: hsl(195, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:60\:dark, html.auto .sf-c-txt-lightblue\:60\:dark { color: hsl(195, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:70\:dark, html.auto .sf-c-txt-lightblue\:70\:dark { color: hsl(195, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:80\:dark, html.auto .sf-c-txt-lightblue\:80\:dark { color: hsl(195, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:90\:dark, html.auto .sf-c-txt-lightblue\:90\:dark { color: hsl(195, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:100\:dark, html.auto .sf-c-txt-lightblue\:100\:dark { color: hsl(195, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:dark, html.var.auto .sf-c-txt-lightblue\:dark { color: hsl(195, 53%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:0\:dark, html.var.auto .sf-c-txt-lightblue\:0\:dark { color: hsl(195, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:10\:dark, html.var.auto .sf-c-txt-lightblue\:10\:dark { color: hsl(195, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:20\:dark, html.var.auto .sf-c-txt-lightblue\:20\:dark { color: hsl(195, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:30\:dark, html.var.auto .sf-c-txt-lightblue\:30\:dark { color: hsl(195, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:40\:dark, html.var.auto .sf-c-txt-lightblue\:40\:dark { color: hsl(195, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:50\:dark, html.var.auto .sf-c-txt-lightblue\:50\:dark { color: hsl(195, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:60\:dark, html.var.auto .sf-c-txt-lightblue\:60\:dark { color: hsl(195, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:70\:dark, html.var.auto .sf-c-txt-lightblue\:70\:dark { color: hsl(195, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:80\:dark, html.var.auto .sf-c-txt-lightblue\:80\:dark { color: hsl(195, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:90\:dark, html.var.auto .sf-c-txt-lightblue\:90\:dark { color: hsl(195, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:100\:dark, html.var.auto .sf-c-txt-lightblue\:100\:dark { color: hsl(195, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightcoral.css b/src/colors/10/lightcoral.css index 8b0e51d..ffb0f23 100644 --- a/src/colors/10/lightcoral.css +++ b/src/colors/10/lightcoral.css @@ -1,4 +1,4 @@ -:root { +[class*='lightcoral'] { --sf-c-lightcoral: 0 79% 72%; --sf-c-lightcoral-0: 0 79% 0%; --sf-c-lightcoral-10: 0 79% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightcoral\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-lightcoral\:90\:dark, html.var.auto .sf-c-lightcoral\:90\:dark { color: hsl(0, 79%, 90%); background: hsl(0, 79%, 10%) } html.var[data-theme='auto'] .sf-c-lightcoral\:100\:dark, html.var.auto .sf-c-lightcoral\:100\:dark { color: hsl(0, 79%, 90%); background: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral, html.auto .sf-c-txt-lightcoral { color: hsl(0, 79%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0, html.auto .sf-c-txt-lightcoral\:0 { color: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10, html.auto .sf-c-txt-lightcoral\:10 { color: hsl(0, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20, html.auto .sf-c-txt-lightcoral\:20 { color: hsl(0, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30, html.auto .sf-c-txt-lightcoral\:30 { color: hsl(0, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40, html.auto .sf-c-txt-lightcoral\:40 { color: hsl(0, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50, html.auto .sf-c-txt-lightcoral\:50 { color: hsl(0, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60, html.auto .sf-c-txt-lightcoral\:60 { color: hsl(0, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70, html.auto .sf-c-txt-lightcoral\:70 { color: hsl(0, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80, html.auto .sf-c-txt-lightcoral\:80 { color: hsl(0, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90, html.auto .sf-c-txt-lightcoral\:90 { color: hsl(0, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100, html.auto .sf-c-txt-lightcoral\:100 { color: hsl(0, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral, html.var.auto .sf-c-txt-lightcoral { color: hsl(0, 79%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0, html.var.auto .sf-c-txt-lightcoral\:0 { color: hsl(0, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10, html.var.auto .sf-c-txt-lightcoral\:10 { color: hsl(0, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20, html.var.auto .sf-c-txt-lightcoral\:20 { color: hsl(0, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30, html.var.auto .sf-c-txt-lightcoral\:30 { color: hsl(0, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40, html.var.auto .sf-c-txt-lightcoral\:40 { color: hsl(0, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50, html.var.auto .sf-c-txt-lightcoral\:50 { color: hsl(0, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60, html.var.auto .sf-c-txt-lightcoral\:60 { color: hsl(0, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70, html.var.auto .sf-c-txt-lightcoral\:70 { color: hsl(0, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80, html.var.auto .sf-c-txt-lightcoral\:80 { color: hsl(0, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90, html.var.auto .sf-c-txt-lightcoral\:90 { color: hsl(0, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100, html.var.auto .sf-c-txt-lightcoral\:100 { color: hsl(0, 79%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:dark, html.auto .sf-c-txt-lightcoral\:dark { color: hsl(0, 79%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0\:dark, html.auto .sf-c-txt-lightcoral\:0\:dark { color: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10\:dark, html.auto .sf-c-txt-lightcoral\:10\:dark { color: hsl(0, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20\:dark, html.auto .sf-c-txt-lightcoral\:20\:dark { color: hsl(0, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30\:dark, html.auto .sf-c-txt-lightcoral\:30\:dark { color: hsl(0, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40\:dark, html.auto .sf-c-txt-lightcoral\:40\:dark { color: hsl(0, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50\:dark, html.auto .sf-c-txt-lightcoral\:50\:dark { color: hsl(0, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60\:dark, html.auto .sf-c-txt-lightcoral\:60\:dark { color: hsl(0, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70\:dark, html.auto .sf-c-txt-lightcoral\:70\:dark { color: hsl(0, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80\:dark, html.auto .sf-c-txt-lightcoral\:80\:dark { color: hsl(0, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90\:dark, html.auto .sf-c-txt-lightcoral\:90\:dark { color: hsl(0, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100\:dark, html.auto .sf-c-txt-lightcoral\:100\:dark { color: hsl(0, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:dark, html.var.auto .sf-c-txt-lightcoral\:dark { color: hsl(0, 79%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0\:dark, html.var.auto .sf-c-txt-lightcoral\:0\:dark { color: hsl(0, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10\:dark, html.var.auto .sf-c-txt-lightcoral\:10\:dark { color: hsl(0, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20\:dark, html.var.auto .sf-c-txt-lightcoral\:20\:dark { color: hsl(0, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30\:dark, html.var.auto .sf-c-txt-lightcoral\:30\:dark { color: hsl(0, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40\:dark, html.var.auto .sf-c-txt-lightcoral\:40\:dark { color: hsl(0, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50\:dark, html.var.auto .sf-c-txt-lightcoral\:50\:dark { color: hsl(0, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60\:dark, html.var.auto .sf-c-txt-lightcoral\:60\:dark { color: hsl(0, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70\:dark, html.var.auto .sf-c-txt-lightcoral\:70\:dark { color: hsl(0, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80\:dark, html.var.auto .sf-c-txt-lightcoral\:80\:dark { color: hsl(0, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90\:dark, html.var.auto .sf-c-txt-lightcoral\:90\:dark { color: hsl(0, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100\:dark, html.var.auto .sf-c-txt-lightcoral\:100\:dark { color: hsl(0, 79%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightcyan.css b/src/colors/10/lightcyan.css index b822f27..eb4b6fa 100644 --- a/src/colors/10/lightcyan.css +++ b/src/colors/10/lightcyan.css @@ -1,4 +1,4 @@ -:root { +[class*='lightcyan'] { --sf-c-lightcyan: 180 100% 94%; --sf-c-lightcyan-0: 180 100% 0%; --sf-c-lightcyan-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightcyan\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightcyan\:90\:dark, html.var.auto .sf-c-lightcyan\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lightcyan\:100\:dark, html.var.auto .sf-c-lightcyan\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan, html.auto .sf-c-txt-lightcyan { color: hsl(180, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0, html.auto .sf-c-txt-lightcyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10, html.auto .sf-c-txt-lightcyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20, html.auto .sf-c-txt-lightcyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30, html.auto .sf-c-txt-lightcyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40, html.auto .sf-c-txt-lightcyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50, html.auto .sf-c-txt-lightcyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60, html.auto .sf-c-txt-lightcyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70, html.auto .sf-c-txt-lightcyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80, html.auto .sf-c-txt-lightcyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90, html.auto .sf-c-txt-lightcyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100, html.auto .sf-c-txt-lightcyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan, html.var.auto .sf-c-txt-lightcyan { color: hsl(180, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0, html.var.auto .sf-c-txt-lightcyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10, html.var.auto .sf-c-txt-lightcyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20, html.var.auto .sf-c-txt-lightcyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30, html.var.auto .sf-c-txt-lightcyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40, html.var.auto .sf-c-txt-lightcyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50, html.var.auto .sf-c-txt-lightcyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60, html.var.auto .sf-c-txt-lightcyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70, html.var.auto .sf-c-txt-lightcyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80, html.var.auto .sf-c-txt-lightcyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90, html.var.auto .sf-c-txt-lightcyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100, html.var.auto .sf-c-txt-lightcyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:dark, html.auto .sf-c-txt-lightcyan\:dark { color: hsl(180, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0\:dark, html.auto .sf-c-txt-lightcyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10\:dark, html.auto .sf-c-txt-lightcyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20\:dark, html.auto .sf-c-txt-lightcyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30\:dark, html.auto .sf-c-txt-lightcyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40\:dark, html.auto .sf-c-txt-lightcyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50\:dark, html.auto .sf-c-txt-lightcyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60\:dark, html.auto .sf-c-txt-lightcyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70\:dark, html.auto .sf-c-txt-lightcyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80\:dark, html.auto .sf-c-txt-lightcyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90\:dark, html.auto .sf-c-txt-lightcyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100\:dark, html.auto .sf-c-txt-lightcyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:dark, html.var.auto .sf-c-txt-lightcyan\:dark { color: hsl(180, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0\:dark, html.var.auto .sf-c-txt-lightcyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10\:dark, html.var.auto .sf-c-txt-lightcyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20\:dark, html.var.auto .sf-c-txt-lightcyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30\:dark, html.var.auto .sf-c-txt-lightcyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40\:dark, html.var.auto .sf-c-txt-lightcyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50\:dark, html.var.auto .sf-c-txt-lightcyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60\:dark, html.var.auto .sf-c-txt-lightcyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70\:dark, html.var.auto .sf-c-txt-lightcyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80\:dark, html.var.auto .sf-c-txt-lightcyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90\:dark, html.var.auto .sf-c-txt-lightcyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100\:dark, html.var.auto .sf-c-txt-lightcyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightgoldenrodyellow.css b/src/colors/10/lightgoldenrodyellow.css index 1a7cdff..b208468 100644 --- a/src/colors/10/lightgoldenrodyellow.css +++ b/src/colors/10/lightgoldenrodyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgoldenrodyellow'] { --sf-c-lightgoldenrodyellow: 60 80% 90%; --sf-c-lightgoldenrodyellow-0: 60 80% 0%; --sf-c-lightgoldenrodyellow-10: 60 80% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.dark html.var[data-theme='auto'] .sf-c-lightgoldenrodyellow\:90\:dark, html.var.auto .sf-c-lightgoldenrodyellow\:90\:dark { color: hsl(60, 80%, 90%); background: hsl(60, 80%, 10%) } html.var[data-theme='auto'] .sf-c-lightgoldenrodyellow\:100\:dark, html.var.auto .sf-c-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 90%); background: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow, html.auto .sf-c-txt-lightgoldenrodyellow { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0, html.auto .sf-c-txt-lightgoldenrodyellow\:0 { color: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10, html.auto .sf-c-txt-lightgoldenrodyellow\:10 { color: hsl(60, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20, html.auto .sf-c-txt-lightgoldenrodyellow\:20 { color: hsl(60, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30, html.auto .sf-c-txt-lightgoldenrodyellow\:30 { color: hsl(60, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40, html.auto .sf-c-txt-lightgoldenrodyellow\:40 { color: hsl(60, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50, html.auto .sf-c-txt-lightgoldenrodyellow\:50 { color: hsl(60, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60, html.auto .sf-c-txt-lightgoldenrodyellow\:60 { color: hsl(60, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70, html.auto .sf-c-txt-lightgoldenrodyellow\:70 { color: hsl(60, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80, html.auto .sf-c-txt-lightgoldenrodyellow\:80 { color: hsl(60, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90, html.auto .sf-c-txt-lightgoldenrodyellow\:90 { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100, html.auto .sf-c-txt-lightgoldenrodyellow\:100 { color: hsl(60, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow, html.var.auto .sf-c-txt-lightgoldenrodyellow { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0, html.var.auto .sf-c-txt-lightgoldenrodyellow\:0 { color: hsl(60, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10, html.var.auto .sf-c-txt-lightgoldenrodyellow\:10 { color: hsl(60, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20, html.var.auto .sf-c-txt-lightgoldenrodyellow\:20 { color: hsl(60, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30, html.var.auto .sf-c-txt-lightgoldenrodyellow\:30 { color: hsl(60, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40, html.var.auto .sf-c-txt-lightgoldenrodyellow\:40 { color: hsl(60, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50, html.var.auto .sf-c-txt-lightgoldenrodyellow\:50 { color: hsl(60, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60, html.var.auto .sf-c-txt-lightgoldenrodyellow\:60 { color: hsl(60, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70, html.var.auto .sf-c-txt-lightgoldenrodyellow\:70 { color: hsl(60, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80, html.var.auto .sf-c-txt-lightgoldenrodyellow\:80 { color: hsl(60, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90, html.var.auto .sf-c-txt-lightgoldenrodyellow\:90 { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100, html.var.auto .sf-c-txt-lightgoldenrodyellow\:100 { color: hsl(60, 80%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:dark { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:0\:dark { color: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:10\:dark { color: hsl(60, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:20\:dark { color: hsl(60, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:30\:dark { color: hsl(60, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:40\:dark { color: hsl(60, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:50\:dark { color: hsl(60, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:60\:dark { color: hsl(60, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:70\:dark { color: hsl(60, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:80\:dark { color: hsl(60, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:90\:dark { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:dark { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:0\:dark { color: hsl(60, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:10\:dark { color: hsl(60, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:20\:dark { color: hsl(60, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:30\:dark { color: hsl(60, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:40\:dark { color: hsl(60, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:50\:dark { color: hsl(60, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:60\:dark { color: hsl(60, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:70\:dark { color: hsl(60, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:80\:dark { color: hsl(60, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:90\:dark { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightgray.css b/src/colors/10/lightgray.css index b304aaa..d718eba 100644 --- a/src/colors/10/lightgray.css +++ b/src/colors/10/lightgray.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgray'] { --sf-c-lightgray: 0 0% 83%; --sf-c-lightgray-0: 0 0% 0%; --sf-c-lightgray-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightgray\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightgray\:90\:dark, html.var.auto .sf-c-lightgray\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-lightgray\:100\:dark, html.var.auto .sf-c-lightgray\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray, html.auto .sf-c-txt-lightgray { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:0, html.auto .sf-c-txt-lightgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:10, html.auto .sf-c-txt-lightgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:20, html.auto .sf-c-txt-lightgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:30, html.auto .sf-c-txt-lightgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:40, html.auto .sf-c-txt-lightgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:50, html.auto .sf-c-txt-lightgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:60, html.auto .sf-c-txt-lightgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:70, html.auto .sf-c-txt-lightgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:80, html.auto .sf-c-txt-lightgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:90, html.auto .sf-c-txt-lightgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:100, html.auto .sf-c-txt-lightgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray, html.var.auto .sf-c-txt-lightgray { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:0, html.var.auto .sf-c-txt-lightgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:10, html.var.auto .sf-c-txt-lightgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:20, html.var.auto .sf-c-txt-lightgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:30, html.var.auto .sf-c-txt-lightgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:40, html.var.auto .sf-c-txt-lightgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:50, html.var.auto .sf-c-txt-lightgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:60, html.var.auto .sf-c-txt-lightgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:70, html.var.auto .sf-c-txt-lightgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:80, html.var.auto .sf-c-txt-lightgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:90, html.var.auto .sf-c-txt-lightgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:100, html.var.auto .sf-c-txt-lightgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:dark, html.auto .sf-c-txt-lightgray\:dark { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:0\:dark, html.auto .sf-c-txt-lightgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:10\:dark, html.auto .sf-c-txt-lightgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:20\:dark, html.auto .sf-c-txt-lightgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:30\:dark, html.auto .sf-c-txt-lightgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:40\:dark, html.auto .sf-c-txt-lightgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:50\:dark, html.auto .sf-c-txt-lightgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:60\:dark, html.auto .sf-c-txt-lightgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:70\:dark, html.auto .sf-c-txt-lightgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:80\:dark, html.auto .sf-c-txt-lightgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:90\:dark, html.auto .sf-c-txt-lightgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:100\:dark, html.auto .sf-c-txt-lightgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:dark, html.var.auto .sf-c-txt-lightgray\:dark { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:0\:dark, html.var.auto .sf-c-txt-lightgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:10\:dark, html.var.auto .sf-c-txt-lightgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:20\:dark, html.var.auto .sf-c-txt-lightgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:30\:dark, html.var.auto .sf-c-txt-lightgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:40\:dark, html.var.auto .sf-c-txt-lightgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:50\:dark, html.var.auto .sf-c-txt-lightgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:60\:dark, html.var.auto .sf-c-txt-lightgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:70\:dark, html.var.auto .sf-c-txt-lightgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:80\:dark, html.var.auto .sf-c-txt-lightgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:90\:dark, html.var.auto .sf-c-txt-lightgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:100\:dark, html.var.auto .sf-c-txt-lightgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightgreen.css b/src/colors/10/lightgreen.css index 6f83170..3999399 100644 --- a/src/colors/10/lightgreen.css +++ b/src/colors/10/lightgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgreen'] { --sf-c-lightgreen: 120 73% 75%; --sf-c-lightgreen-0: 120 73% 0%; --sf-c-lightgreen-10: 120 73% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightgreen\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-lightgreen\:90\:dark, html.var.auto .sf-c-lightgreen\:90\:dark { color: hsl(120, 73%, 90%); background: hsl(120, 73%, 10%) } html.var[data-theme='auto'] .sf-c-lightgreen\:100\:dark, html.var.auto .sf-c-lightgreen\:100\:dark { color: hsl(120, 73%, 90%); background: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen, html.auto .sf-c-txt-lightgreen { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0, html.auto .sf-c-txt-lightgreen\:0 { color: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10, html.auto .sf-c-txt-lightgreen\:10 { color: hsl(120, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20, html.auto .sf-c-txt-lightgreen\:20 { color: hsl(120, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30, html.auto .sf-c-txt-lightgreen\:30 { color: hsl(120, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40, html.auto .sf-c-txt-lightgreen\:40 { color: hsl(120, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50, html.auto .sf-c-txt-lightgreen\:50 { color: hsl(120, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60, html.auto .sf-c-txt-lightgreen\:60 { color: hsl(120, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70, html.auto .sf-c-txt-lightgreen\:70 { color: hsl(120, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80, html.auto .sf-c-txt-lightgreen\:80 { color: hsl(120, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90, html.auto .sf-c-txt-lightgreen\:90 { color: hsl(120, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100, html.auto .sf-c-txt-lightgreen\:100 { color: hsl(120, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen, html.var.auto .sf-c-txt-lightgreen { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0, html.var.auto .sf-c-txt-lightgreen\:0 { color: hsl(120, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10, html.var.auto .sf-c-txt-lightgreen\:10 { color: hsl(120, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20, html.var.auto .sf-c-txt-lightgreen\:20 { color: hsl(120, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30, html.var.auto .sf-c-txt-lightgreen\:30 { color: hsl(120, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40, html.var.auto .sf-c-txt-lightgreen\:40 { color: hsl(120, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50, html.var.auto .sf-c-txt-lightgreen\:50 { color: hsl(120, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60, html.var.auto .sf-c-txt-lightgreen\:60 { color: hsl(120, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70, html.var.auto .sf-c-txt-lightgreen\:70 { color: hsl(120, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80, html.var.auto .sf-c-txt-lightgreen\:80 { color: hsl(120, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90, html.var.auto .sf-c-txt-lightgreen\:90 { color: hsl(120, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100, html.var.auto .sf-c-txt-lightgreen\:100 { color: hsl(120, 73%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:dark, html.auto .sf-c-txt-lightgreen\:dark { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0\:dark, html.auto .sf-c-txt-lightgreen\:0\:dark { color: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10\:dark, html.auto .sf-c-txt-lightgreen\:10\:dark { color: hsl(120, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20\:dark, html.auto .sf-c-txt-lightgreen\:20\:dark { color: hsl(120, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30\:dark, html.auto .sf-c-txt-lightgreen\:30\:dark { color: hsl(120, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40\:dark, html.auto .sf-c-txt-lightgreen\:40\:dark { color: hsl(120, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50\:dark, html.auto .sf-c-txt-lightgreen\:50\:dark { color: hsl(120, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60\:dark, html.auto .sf-c-txt-lightgreen\:60\:dark { color: hsl(120, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70\:dark, html.auto .sf-c-txt-lightgreen\:70\:dark { color: hsl(120, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80\:dark, html.auto .sf-c-txt-lightgreen\:80\:dark { color: hsl(120, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90\:dark, html.auto .sf-c-txt-lightgreen\:90\:dark { color: hsl(120, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100\:dark, html.auto .sf-c-txt-lightgreen\:100\:dark { color: hsl(120, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:dark, html.var.auto .sf-c-txt-lightgreen\:dark { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0\:dark, html.var.auto .sf-c-txt-lightgreen\:0\:dark { color: hsl(120, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10\:dark, html.var.auto .sf-c-txt-lightgreen\:10\:dark { color: hsl(120, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20\:dark, html.var.auto .sf-c-txt-lightgreen\:20\:dark { color: hsl(120, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30\:dark, html.var.auto .sf-c-txt-lightgreen\:30\:dark { color: hsl(120, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40\:dark, html.var.auto .sf-c-txt-lightgreen\:40\:dark { color: hsl(120, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50\:dark, html.var.auto .sf-c-txt-lightgreen\:50\:dark { color: hsl(120, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60\:dark, html.var.auto .sf-c-txt-lightgreen\:60\:dark { color: hsl(120, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70\:dark, html.var.auto .sf-c-txt-lightgreen\:70\:dark { color: hsl(120, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80\:dark, html.var.auto .sf-c-txt-lightgreen\:80\:dark { color: hsl(120, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90\:dark, html.var.auto .sf-c-txt-lightgreen\:90\:dark { color: hsl(120, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100\:dark, html.var.auto .sf-c-txt-lightgreen\:100\:dark { color: hsl(120, 73%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightgrey.css b/src/colors/10/lightgrey.css index 4b6ae63..e95cdc3 100644 --- a/src/colors/10/lightgrey.css +++ b/src/colors/10/lightgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgrey'] { --sf-c-lightgrey: 0 0% 83%; --sf-c-lightgrey-0: 0 0% 0%; --sf-c-lightgrey-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightgrey\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightgrey\:90\:dark, html.var.auto .sf-c-lightgrey\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-lightgrey\:100\:dark, html.var.auto .sf-c-lightgrey\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey, html.auto .sf-c-txt-lightgrey { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0, html.auto .sf-c-txt-lightgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10, html.auto .sf-c-txt-lightgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20, html.auto .sf-c-txt-lightgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30, html.auto .sf-c-txt-lightgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40, html.auto .sf-c-txt-lightgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50, html.auto .sf-c-txt-lightgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60, html.auto .sf-c-txt-lightgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70, html.auto .sf-c-txt-lightgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80, html.auto .sf-c-txt-lightgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90, html.auto .sf-c-txt-lightgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100, html.auto .sf-c-txt-lightgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey, html.var.auto .sf-c-txt-lightgrey { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0, html.var.auto .sf-c-txt-lightgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10, html.var.auto .sf-c-txt-lightgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20, html.var.auto .sf-c-txt-lightgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30, html.var.auto .sf-c-txt-lightgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40, html.var.auto .sf-c-txt-lightgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50, html.var.auto .sf-c-txt-lightgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60, html.var.auto .sf-c-txt-lightgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70, html.var.auto .sf-c-txt-lightgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80, html.var.auto .sf-c-txt-lightgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90, html.var.auto .sf-c-txt-lightgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100, html.var.auto .sf-c-txt-lightgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:dark, html.auto .sf-c-txt-lightgrey\:dark { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0\:dark, html.auto .sf-c-txt-lightgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10\:dark, html.auto .sf-c-txt-lightgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20\:dark, html.auto .sf-c-txt-lightgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30\:dark, html.auto .sf-c-txt-lightgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40\:dark, html.auto .sf-c-txt-lightgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50\:dark, html.auto .sf-c-txt-lightgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60\:dark, html.auto .sf-c-txt-lightgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70\:dark, html.auto .sf-c-txt-lightgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80\:dark, html.auto .sf-c-txt-lightgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90\:dark, html.auto .sf-c-txt-lightgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100\:dark, html.auto .sf-c-txt-lightgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:dark, html.var.auto .sf-c-txt-lightgrey\:dark { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0\:dark, html.var.auto .sf-c-txt-lightgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10\:dark, html.var.auto .sf-c-txt-lightgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20\:dark, html.var.auto .sf-c-txt-lightgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30\:dark, html.var.auto .sf-c-txt-lightgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40\:dark, html.var.auto .sf-c-txt-lightgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50\:dark, html.var.auto .sf-c-txt-lightgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60\:dark, html.var.auto .sf-c-txt-lightgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70\:dark, html.var.auto .sf-c-txt-lightgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80\:dark, html.var.auto .sf-c-txt-lightgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90\:dark, html.var.auto .sf-c-txt-lightgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100\:dark, html.var.auto .sf-c-txt-lightgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightpink.css b/src/colors/10/lightpink.css index e615df4..a17cbae 100644 --- a/src/colors/10/lightpink.css +++ b/src/colors/10/lightpink.css @@ -1,4 +1,4 @@ -:root { +[class*='lightpink'] { --sf-c-lightpink: 351 100% 86%; --sf-c-lightpink-0: 351 100% 0%; --sf-c-lightpink-10: 351 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightpink\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightpink\:90\:dark, html.var.auto .sf-c-lightpink\:90\:dark { color: hsl(351, 100%, 90%); background: hsl(351, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lightpink\:100\:dark, html.var.auto .sf-c-lightpink\:100\:dark { color: hsl(351, 100%, 90%); background: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink, html.auto .sf-c-txt-lightpink { color: hsl(351, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:0, html.auto .sf-c-txt-lightpink\:0 { color: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:10, html.auto .sf-c-txt-lightpink\:10 { color: hsl(351, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:20, html.auto .sf-c-txt-lightpink\:20 { color: hsl(351, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:30, html.auto .sf-c-txt-lightpink\:30 { color: hsl(351, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:40, html.auto .sf-c-txt-lightpink\:40 { color: hsl(351, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:50, html.auto .sf-c-txt-lightpink\:50 { color: hsl(351, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:60, html.auto .sf-c-txt-lightpink\:60 { color: hsl(351, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:70, html.auto .sf-c-txt-lightpink\:70 { color: hsl(351, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:80, html.auto .sf-c-txt-lightpink\:80 { color: hsl(351, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:90, html.auto .sf-c-txt-lightpink\:90 { color: hsl(351, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:100, html.auto .sf-c-txt-lightpink\:100 { color: hsl(351, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink, html.var.auto .sf-c-txt-lightpink { color: hsl(351, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:0, html.var.auto .sf-c-txt-lightpink\:0 { color: hsl(351, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:10, html.var.auto .sf-c-txt-lightpink\:10 { color: hsl(351, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:20, html.var.auto .sf-c-txt-lightpink\:20 { color: hsl(351, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:30, html.var.auto .sf-c-txt-lightpink\:30 { color: hsl(351, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:40, html.var.auto .sf-c-txt-lightpink\:40 { color: hsl(351, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:50, html.var.auto .sf-c-txt-lightpink\:50 { color: hsl(351, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:60, html.var.auto .sf-c-txt-lightpink\:60 { color: hsl(351, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:70, html.var.auto .sf-c-txt-lightpink\:70 { color: hsl(351, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:80, html.var.auto .sf-c-txt-lightpink\:80 { color: hsl(351, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:90, html.var.auto .sf-c-txt-lightpink\:90 { color: hsl(351, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:100, html.var.auto .sf-c-txt-lightpink\:100 { color: hsl(351, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:dark, html.auto .sf-c-txt-lightpink\:dark { color: hsl(351, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:0\:dark, html.auto .sf-c-txt-lightpink\:0\:dark { color: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:10\:dark, html.auto .sf-c-txt-lightpink\:10\:dark { color: hsl(351, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:20\:dark, html.auto .sf-c-txt-lightpink\:20\:dark { color: hsl(351, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:30\:dark, html.auto .sf-c-txt-lightpink\:30\:dark { color: hsl(351, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:40\:dark, html.auto .sf-c-txt-lightpink\:40\:dark { color: hsl(351, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:50\:dark, html.auto .sf-c-txt-lightpink\:50\:dark { color: hsl(351, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:60\:dark, html.auto .sf-c-txt-lightpink\:60\:dark { color: hsl(351, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:70\:dark, html.auto .sf-c-txt-lightpink\:70\:dark { color: hsl(351, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:80\:dark, html.auto .sf-c-txt-lightpink\:80\:dark { color: hsl(351, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:90\:dark, html.auto .sf-c-txt-lightpink\:90\:dark { color: hsl(351, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:100\:dark, html.auto .sf-c-txt-lightpink\:100\:dark { color: hsl(351, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:dark, html.var.auto .sf-c-txt-lightpink\:dark { color: hsl(351, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:0\:dark, html.var.auto .sf-c-txt-lightpink\:0\:dark { color: hsl(351, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:10\:dark, html.var.auto .sf-c-txt-lightpink\:10\:dark { color: hsl(351, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:20\:dark, html.var.auto .sf-c-txt-lightpink\:20\:dark { color: hsl(351, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:30\:dark, html.var.auto .sf-c-txt-lightpink\:30\:dark { color: hsl(351, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:40\:dark, html.var.auto .sf-c-txt-lightpink\:40\:dark { color: hsl(351, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:50\:dark, html.var.auto .sf-c-txt-lightpink\:50\:dark { color: hsl(351, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:60\:dark, html.var.auto .sf-c-txt-lightpink\:60\:dark { color: hsl(351, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:70\:dark, html.var.auto .sf-c-txt-lightpink\:70\:dark { color: hsl(351, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:80\:dark, html.var.auto .sf-c-txt-lightpink\:80\:dark { color: hsl(351, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:90\:dark, html.var.auto .sf-c-txt-lightpink\:90\:dark { color: hsl(351, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:100\:dark, html.var.auto .sf-c-txt-lightpink\:100\:dark { color: hsl(351, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightsalmon.css b/src/colors/10/lightsalmon.css index 1aac1e4..a357375 100644 --- a/src/colors/10/lightsalmon.css +++ b/src/colors/10/lightsalmon.css @@ -1,4 +1,4 @@ -:root { +[class*='lightsalmon'] { --sf-c-lightsalmon: 17 100% 74%; --sf-c-lightsalmon-0: 17 100% 0%; --sf-c-lightsalmon-10: 17 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightsalmon\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-lightsalmon\:90\:dark, html.var.auto .sf-c-lightsalmon\:90\:dark { color: hsl(17, 100%, 90%); background: hsl(17, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lightsalmon\:100\:dark, html.var.auto .sf-c-lightsalmon\:100\:dark { color: hsl(17, 100%, 90%); background: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon, html.auto .sf-c-txt-lightsalmon { color: hsl(17, 100%, 74%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0, html.auto .sf-c-txt-lightsalmon\:0 { color: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10, html.auto .sf-c-txt-lightsalmon\:10 { color: hsl(17, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20, html.auto .sf-c-txt-lightsalmon\:20 { color: hsl(17, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30, html.auto .sf-c-txt-lightsalmon\:30 { color: hsl(17, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40, html.auto .sf-c-txt-lightsalmon\:40 { color: hsl(17, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50, html.auto .sf-c-txt-lightsalmon\:50 { color: hsl(17, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60, html.auto .sf-c-txt-lightsalmon\:60 { color: hsl(17, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70, html.auto .sf-c-txt-lightsalmon\:70 { color: hsl(17, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80, html.auto .sf-c-txt-lightsalmon\:80 { color: hsl(17, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90, html.auto .sf-c-txt-lightsalmon\:90 { color: hsl(17, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100, html.auto .sf-c-txt-lightsalmon\:100 { color: hsl(17, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon, html.var.auto .sf-c-txt-lightsalmon { color: hsl(17, 100%, 74%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0, html.var.auto .sf-c-txt-lightsalmon\:0 { color: hsl(17, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10, html.var.auto .sf-c-txt-lightsalmon\:10 { color: hsl(17, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20, html.var.auto .sf-c-txt-lightsalmon\:20 { color: hsl(17, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30, html.var.auto .sf-c-txt-lightsalmon\:30 { color: hsl(17, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40, html.var.auto .sf-c-txt-lightsalmon\:40 { color: hsl(17, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50, html.var.auto .sf-c-txt-lightsalmon\:50 { color: hsl(17, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60, html.var.auto .sf-c-txt-lightsalmon\:60 { color: hsl(17, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70, html.var.auto .sf-c-txt-lightsalmon\:70 { color: hsl(17, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80, html.var.auto .sf-c-txt-lightsalmon\:80 { color: hsl(17, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90, html.var.auto .sf-c-txt-lightsalmon\:90 { color: hsl(17, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100, html.var.auto .sf-c-txt-lightsalmon\:100 { color: hsl(17, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:dark, html.auto .sf-c-txt-lightsalmon\:dark { color: hsl(17, 100%, 74%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0\:dark, html.auto .sf-c-txt-lightsalmon\:0\:dark { color: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10\:dark, html.auto .sf-c-txt-lightsalmon\:10\:dark { color: hsl(17, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20\:dark, html.auto .sf-c-txt-lightsalmon\:20\:dark { color: hsl(17, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30\:dark, html.auto .sf-c-txt-lightsalmon\:30\:dark { color: hsl(17, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40\:dark, html.auto .sf-c-txt-lightsalmon\:40\:dark { color: hsl(17, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50\:dark, html.auto .sf-c-txt-lightsalmon\:50\:dark { color: hsl(17, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60\:dark, html.auto .sf-c-txt-lightsalmon\:60\:dark { color: hsl(17, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70\:dark, html.auto .sf-c-txt-lightsalmon\:70\:dark { color: hsl(17, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80\:dark, html.auto .sf-c-txt-lightsalmon\:80\:dark { color: hsl(17, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90\:dark, html.auto .sf-c-txt-lightsalmon\:90\:dark { color: hsl(17, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100\:dark, html.auto .sf-c-txt-lightsalmon\:100\:dark { color: hsl(17, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:dark, html.var.auto .sf-c-txt-lightsalmon\:dark { color: hsl(17, 100%, 74%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0\:dark, html.var.auto .sf-c-txt-lightsalmon\:0\:dark { color: hsl(17, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10\:dark, html.var.auto .sf-c-txt-lightsalmon\:10\:dark { color: hsl(17, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20\:dark, html.var.auto .sf-c-txt-lightsalmon\:20\:dark { color: hsl(17, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30\:dark, html.var.auto .sf-c-txt-lightsalmon\:30\:dark { color: hsl(17, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40\:dark, html.var.auto .sf-c-txt-lightsalmon\:40\:dark { color: hsl(17, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50\:dark, html.var.auto .sf-c-txt-lightsalmon\:50\:dark { color: hsl(17, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60\:dark, html.var.auto .sf-c-txt-lightsalmon\:60\:dark { color: hsl(17, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70\:dark, html.var.auto .sf-c-txt-lightsalmon\:70\:dark { color: hsl(17, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80\:dark, html.var.auto .sf-c-txt-lightsalmon\:80\:dark { color: hsl(17, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90\:dark, html.var.auto .sf-c-txt-lightsalmon\:90\:dark { color: hsl(17, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100\:dark, html.var.auto .sf-c-txt-lightsalmon\:100\:dark { color: hsl(17, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightseagreen.css b/src/colors/10/lightseagreen.css index e6e6c65..068e676 100644 --- a/src/colors/10/lightseagreen.css +++ b/src/colors/10/lightseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lightseagreen'] { --sf-c-lightseagreen: 177 70% 41%; --sf-c-lightseagreen-0: 177 70% 0%; --sf-c-lightseagreen-10: 177 70% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightseagreen\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-lightseagreen\:90\:dark, html.var.auto .sf-c-lightseagreen\:90\:dark { color: hsl(177, 70%, 90%); background: hsl(177, 70%, 10%) } html.var[data-theme='auto'] .sf-c-lightseagreen\:100\:dark, html.var.auto .sf-c-lightseagreen\:100\:dark { color: hsl(177, 70%, 90%); background: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen, html.auto .sf-c-txt-lightseagreen { color: hsl(177, 70%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0, html.auto .sf-c-txt-lightseagreen\:0 { color: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10, html.auto .sf-c-txt-lightseagreen\:10 { color: hsl(177, 70%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20, html.auto .sf-c-txt-lightseagreen\:20 { color: hsl(177, 70%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30, html.auto .sf-c-txt-lightseagreen\:30 { color: hsl(177, 70%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40, html.auto .sf-c-txt-lightseagreen\:40 { color: hsl(177, 70%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50, html.auto .sf-c-txt-lightseagreen\:50 { color: hsl(177, 70%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60, html.auto .sf-c-txt-lightseagreen\:60 { color: hsl(177, 70%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70, html.auto .sf-c-txt-lightseagreen\:70 { color: hsl(177, 70%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80, html.auto .sf-c-txt-lightseagreen\:80 { color: hsl(177, 70%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90, html.auto .sf-c-txt-lightseagreen\:90 { color: hsl(177, 70%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100, html.auto .sf-c-txt-lightseagreen\:100 { color: hsl(177, 70%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen, html.var.auto .sf-c-txt-lightseagreen { color: hsl(177, 70%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0, html.var.auto .sf-c-txt-lightseagreen\:0 { color: hsl(177, 70%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10, html.var.auto .sf-c-txt-lightseagreen\:10 { color: hsl(177, 70%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20, html.var.auto .sf-c-txt-lightseagreen\:20 { color: hsl(177, 70%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30, html.var.auto .sf-c-txt-lightseagreen\:30 { color: hsl(177, 70%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40, html.var.auto .sf-c-txt-lightseagreen\:40 { color: hsl(177, 70%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50, html.var.auto .sf-c-txt-lightseagreen\:50 { color: hsl(177, 70%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60, html.var.auto .sf-c-txt-lightseagreen\:60 { color: hsl(177, 70%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70, html.var.auto .sf-c-txt-lightseagreen\:70 { color: hsl(177, 70%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80, html.var.auto .sf-c-txt-lightseagreen\:80 { color: hsl(177, 70%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90, html.var.auto .sf-c-txt-lightseagreen\:90 { color: hsl(177, 70%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100, html.var.auto .sf-c-txt-lightseagreen\:100 { color: hsl(177, 70%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:dark, html.auto .sf-c-txt-lightseagreen\:dark { color: hsl(177, 70%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0\:dark, html.auto .sf-c-txt-lightseagreen\:0\:dark { color: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10\:dark, html.auto .sf-c-txt-lightseagreen\:10\:dark { color: hsl(177, 70%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20\:dark, html.auto .sf-c-txt-lightseagreen\:20\:dark { color: hsl(177, 70%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30\:dark, html.auto .sf-c-txt-lightseagreen\:30\:dark { color: hsl(177, 70%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40\:dark, html.auto .sf-c-txt-lightseagreen\:40\:dark { color: hsl(177, 70%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50\:dark, html.auto .sf-c-txt-lightseagreen\:50\:dark { color: hsl(177, 70%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60\:dark, html.auto .sf-c-txt-lightseagreen\:60\:dark { color: hsl(177, 70%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70\:dark, html.auto .sf-c-txt-lightseagreen\:70\:dark { color: hsl(177, 70%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80\:dark, html.auto .sf-c-txt-lightseagreen\:80\:dark { color: hsl(177, 70%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90\:dark, html.auto .sf-c-txt-lightseagreen\:90\:dark { color: hsl(177, 70%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100\:dark, html.auto .sf-c-txt-lightseagreen\:100\:dark { color: hsl(177, 70%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:dark, html.var.auto .sf-c-txt-lightseagreen\:dark { color: hsl(177, 70%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0\:dark, html.var.auto .sf-c-txt-lightseagreen\:0\:dark { color: hsl(177, 70%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10\:dark, html.var.auto .sf-c-txt-lightseagreen\:10\:dark { color: hsl(177, 70%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20\:dark, html.var.auto .sf-c-txt-lightseagreen\:20\:dark { color: hsl(177, 70%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30\:dark, html.var.auto .sf-c-txt-lightseagreen\:30\:dark { color: hsl(177, 70%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40\:dark, html.var.auto .sf-c-txt-lightseagreen\:40\:dark { color: hsl(177, 70%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50\:dark, html.var.auto .sf-c-txt-lightseagreen\:50\:dark { color: hsl(177, 70%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60\:dark, html.var.auto .sf-c-txt-lightseagreen\:60\:dark { color: hsl(177, 70%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70\:dark, html.var.auto .sf-c-txt-lightseagreen\:70\:dark { color: hsl(177, 70%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80\:dark, html.var.auto .sf-c-txt-lightseagreen\:80\:dark { color: hsl(177, 70%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90\:dark, html.var.auto .sf-c-txt-lightseagreen\:90\:dark { color: hsl(177, 70%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100\:dark, html.var.auto .sf-c-txt-lightseagreen\:100\:dark { color: hsl(177, 70%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightskyblue.css b/src/colors/10/lightskyblue.css index e7516da..bb5069e 100644 --- a/src/colors/10/lightskyblue.css +++ b/src/colors/10/lightskyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightskyblue'] { --sf-c-lightskyblue: 203 92% 75%; --sf-c-lightskyblue-0: 203 92% 0%; --sf-c-lightskyblue-10: 203 92% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightskyblue\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-lightskyblue\:90\:dark, html.var.auto .sf-c-lightskyblue\:90\:dark { color: hsl(203, 92%, 90%); background: hsl(203, 92%, 10%) } html.var[data-theme='auto'] .sf-c-lightskyblue\:100\:dark, html.var.auto .sf-c-lightskyblue\:100\:dark { color: hsl(203, 92%, 90%); background: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue, html.auto .sf-c-txt-lightskyblue { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0, html.auto .sf-c-txt-lightskyblue\:0 { color: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10, html.auto .sf-c-txt-lightskyblue\:10 { color: hsl(203, 92%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20, html.auto .sf-c-txt-lightskyblue\:20 { color: hsl(203, 92%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30, html.auto .sf-c-txt-lightskyblue\:30 { color: hsl(203, 92%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40, html.auto .sf-c-txt-lightskyblue\:40 { color: hsl(203, 92%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50, html.auto .sf-c-txt-lightskyblue\:50 { color: hsl(203, 92%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60, html.auto .sf-c-txt-lightskyblue\:60 { color: hsl(203, 92%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70, html.auto .sf-c-txt-lightskyblue\:70 { color: hsl(203, 92%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80, html.auto .sf-c-txt-lightskyblue\:80 { color: hsl(203, 92%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90, html.auto .sf-c-txt-lightskyblue\:90 { color: hsl(203, 92%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100, html.auto .sf-c-txt-lightskyblue\:100 { color: hsl(203, 92%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue, html.var.auto .sf-c-txt-lightskyblue { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0, html.var.auto .sf-c-txt-lightskyblue\:0 { color: hsl(203, 92%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10, html.var.auto .sf-c-txt-lightskyblue\:10 { color: hsl(203, 92%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20, html.var.auto .sf-c-txt-lightskyblue\:20 { color: hsl(203, 92%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30, html.var.auto .sf-c-txt-lightskyblue\:30 { color: hsl(203, 92%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40, html.var.auto .sf-c-txt-lightskyblue\:40 { color: hsl(203, 92%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50, html.var.auto .sf-c-txt-lightskyblue\:50 { color: hsl(203, 92%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60, html.var.auto .sf-c-txt-lightskyblue\:60 { color: hsl(203, 92%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70, html.var.auto .sf-c-txt-lightskyblue\:70 { color: hsl(203, 92%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80, html.var.auto .sf-c-txt-lightskyblue\:80 { color: hsl(203, 92%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90, html.var.auto .sf-c-txt-lightskyblue\:90 { color: hsl(203, 92%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100, html.var.auto .sf-c-txt-lightskyblue\:100 { color: hsl(203, 92%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:dark, html.auto .sf-c-txt-lightskyblue\:dark { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0\:dark, html.auto .sf-c-txt-lightskyblue\:0\:dark { color: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10\:dark, html.auto .sf-c-txt-lightskyblue\:10\:dark { color: hsl(203, 92%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20\:dark, html.auto .sf-c-txt-lightskyblue\:20\:dark { color: hsl(203, 92%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30\:dark, html.auto .sf-c-txt-lightskyblue\:30\:dark { color: hsl(203, 92%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40\:dark, html.auto .sf-c-txt-lightskyblue\:40\:dark { color: hsl(203, 92%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50\:dark, html.auto .sf-c-txt-lightskyblue\:50\:dark { color: hsl(203, 92%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60\:dark, html.auto .sf-c-txt-lightskyblue\:60\:dark { color: hsl(203, 92%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70\:dark, html.auto .sf-c-txt-lightskyblue\:70\:dark { color: hsl(203, 92%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80\:dark, html.auto .sf-c-txt-lightskyblue\:80\:dark { color: hsl(203, 92%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90\:dark, html.auto .sf-c-txt-lightskyblue\:90\:dark { color: hsl(203, 92%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100\:dark, html.auto .sf-c-txt-lightskyblue\:100\:dark { color: hsl(203, 92%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:dark, html.var.auto .sf-c-txt-lightskyblue\:dark { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0\:dark, html.var.auto .sf-c-txt-lightskyblue\:0\:dark { color: hsl(203, 92%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10\:dark, html.var.auto .sf-c-txt-lightskyblue\:10\:dark { color: hsl(203, 92%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20\:dark, html.var.auto .sf-c-txt-lightskyblue\:20\:dark { color: hsl(203, 92%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30\:dark, html.var.auto .sf-c-txt-lightskyblue\:30\:dark { color: hsl(203, 92%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40\:dark, html.var.auto .sf-c-txt-lightskyblue\:40\:dark { color: hsl(203, 92%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50\:dark, html.var.auto .sf-c-txt-lightskyblue\:50\:dark { color: hsl(203, 92%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60\:dark, html.var.auto .sf-c-txt-lightskyblue\:60\:dark { color: hsl(203, 92%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70\:dark, html.var.auto .sf-c-txt-lightskyblue\:70\:dark { color: hsl(203, 92%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80\:dark, html.var.auto .sf-c-txt-lightskyblue\:80\:dark { color: hsl(203, 92%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90\:dark, html.var.auto .sf-c-txt-lightskyblue\:90\:dark { color: hsl(203, 92%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100\:dark, html.var.auto .sf-c-txt-lightskyblue\:100\:dark { color: hsl(203, 92%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightslategray.css b/src/colors/10/lightslategray.css index 25e2aec..2c7adef 100644 --- a/src/colors/10/lightslategray.css +++ b/src/colors/10/lightslategray.css @@ -1,4 +1,4 @@ -:root { +[class*='lightslategray'] { --sf-c-lightslategray: 210 14% 53%; --sf-c-lightslategray-0: 210 14% 0%; --sf-c-lightslategray-10: 210 14% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightslategray\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightslategray\:90\:dark, html.var.auto .sf-c-lightslategray\:90\:dark { color: hsl(210, 14%, 90%); background: hsl(210, 14%, 10%) } html.var[data-theme='auto'] .sf-c-lightslategray\:100\:dark, html.var.auto .sf-c-lightslategray\:100\:dark { color: hsl(210, 14%, 90%); background: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray, html.auto .sf-c-txt-lightslategray { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0, html.auto .sf-c-txt-lightslategray\:0 { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10, html.auto .sf-c-txt-lightslategray\:10 { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20, html.auto .sf-c-txt-lightslategray\:20 { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30, html.auto .sf-c-txt-lightslategray\:30 { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40, html.auto .sf-c-txt-lightslategray\:40 { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50, html.auto .sf-c-txt-lightslategray\:50 { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60, html.auto .sf-c-txt-lightslategray\:60 { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70, html.auto .sf-c-txt-lightslategray\:70 { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80, html.auto .sf-c-txt-lightslategray\:80 { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90, html.auto .sf-c-txt-lightslategray\:90 { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100, html.auto .sf-c-txt-lightslategray\:100 { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray, html.var.auto .sf-c-txt-lightslategray { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0, html.var.auto .sf-c-txt-lightslategray\:0 { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10, html.var.auto .sf-c-txt-lightslategray\:10 { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20, html.var.auto .sf-c-txt-lightslategray\:20 { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30, html.var.auto .sf-c-txt-lightslategray\:30 { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40, html.var.auto .sf-c-txt-lightslategray\:40 { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50, html.var.auto .sf-c-txt-lightslategray\:50 { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60, html.var.auto .sf-c-txt-lightslategray\:60 { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70, html.var.auto .sf-c-txt-lightslategray\:70 { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80, html.var.auto .sf-c-txt-lightslategray\:80 { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90, html.var.auto .sf-c-txt-lightslategray\:90 { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100, html.var.auto .sf-c-txt-lightslategray\:100 { color: hsl(210, 14%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:dark, html.auto .sf-c-txt-lightslategray\:dark { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0\:dark, html.auto .sf-c-txt-lightslategray\:0\:dark { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10\:dark, html.auto .sf-c-txt-lightslategray\:10\:dark { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20\:dark, html.auto .sf-c-txt-lightslategray\:20\:dark { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30\:dark, html.auto .sf-c-txt-lightslategray\:30\:dark { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40\:dark, html.auto .sf-c-txt-lightslategray\:40\:dark { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50\:dark, html.auto .sf-c-txt-lightslategray\:50\:dark { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60\:dark, html.auto .sf-c-txt-lightslategray\:60\:dark { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70\:dark, html.auto .sf-c-txt-lightslategray\:70\:dark { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80\:dark, html.auto .sf-c-txt-lightslategray\:80\:dark { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90\:dark, html.auto .sf-c-txt-lightslategray\:90\:dark { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100\:dark, html.auto .sf-c-txt-lightslategray\:100\:dark { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:dark, html.var.auto .sf-c-txt-lightslategray\:dark { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0\:dark, html.var.auto .sf-c-txt-lightslategray\:0\:dark { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10\:dark, html.var.auto .sf-c-txt-lightslategray\:10\:dark { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20\:dark, html.var.auto .sf-c-txt-lightslategray\:20\:dark { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30\:dark, html.var.auto .sf-c-txt-lightslategray\:30\:dark { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40\:dark, html.var.auto .sf-c-txt-lightslategray\:40\:dark { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50\:dark, html.var.auto .sf-c-txt-lightslategray\:50\:dark { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60\:dark, html.var.auto .sf-c-txt-lightslategray\:60\:dark { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70\:dark, html.var.auto .sf-c-txt-lightslategray\:70\:dark { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80\:dark, html.var.auto .sf-c-txt-lightslategray\:80\:dark { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90\:dark, html.var.auto .sf-c-txt-lightslategray\:90\:dark { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100\:dark, html.var.auto .sf-c-txt-lightslategray\:100\:dark { color: hsl(210, 14%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightslategrey.css b/src/colors/10/lightslategrey.css index 8583207..fa0695a 100644 --- a/src/colors/10/lightslategrey.css +++ b/src/colors/10/lightslategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='lightslategrey'] { --sf-c-lightslategrey: 210 14% 53%; --sf-c-lightslategrey-0: 210 14% 0%; --sf-c-lightslategrey-10: 210 14% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightslategrey\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightslategrey\:90\:dark, html.var.auto .sf-c-lightslategrey\:90\:dark { color: hsl(210, 14%, 90%); background: hsl(210, 14%, 10%) } html.var[data-theme='auto'] .sf-c-lightslategrey\:100\:dark, html.var.auto .sf-c-lightslategrey\:100\:dark { color: hsl(210, 14%, 90%); background: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey, html.auto .sf-c-txt-lightslategrey { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0, html.auto .sf-c-txt-lightslategrey\:0 { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10, html.auto .sf-c-txt-lightslategrey\:10 { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20, html.auto .sf-c-txt-lightslategrey\:20 { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30, html.auto .sf-c-txt-lightslategrey\:30 { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40, html.auto .sf-c-txt-lightslategrey\:40 { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50, html.auto .sf-c-txt-lightslategrey\:50 { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60, html.auto .sf-c-txt-lightslategrey\:60 { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70, html.auto .sf-c-txt-lightslategrey\:70 { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80, html.auto .sf-c-txt-lightslategrey\:80 { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90, html.auto .sf-c-txt-lightslategrey\:90 { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100, html.auto .sf-c-txt-lightslategrey\:100 { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey, html.var.auto .sf-c-txt-lightslategrey { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0, html.var.auto .sf-c-txt-lightslategrey\:0 { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10, html.var.auto .sf-c-txt-lightslategrey\:10 { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20, html.var.auto .sf-c-txt-lightslategrey\:20 { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30, html.var.auto .sf-c-txt-lightslategrey\:30 { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40, html.var.auto .sf-c-txt-lightslategrey\:40 { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50, html.var.auto .sf-c-txt-lightslategrey\:50 { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60, html.var.auto .sf-c-txt-lightslategrey\:60 { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70, html.var.auto .sf-c-txt-lightslategrey\:70 { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80, html.var.auto .sf-c-txt-lightslategrey\:80 { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90, html.var.auto .sf-c-txt-lightslategrey\:90 { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100, html.var.auto .sf-c-txt-lightslategrey\:100 { color: hsl(210, 14%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:dark, html.auto .sf-c-txt-lightslategrey\:dark { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0\:dark, html.auto .sf-c-txt-lightslategrey\:0\:dark { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10\:dark, html.auto .sf-c-txt-lightslategrey\:10\:dark { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20\:dark, html.auto .sf-c-txt-lightslategrey\:20\:dark { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30\:dark, html.auto .sf-c-txt-lightslategrey\:30\:dark { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40\:dark, html.auto .sf-c-txt-lightslategrey\:40\:dark { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50\:dark, html.auto .sf-c-txt-lightslategrey\:50\:dark { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60\:dark, html.auto .sf-c-txt-lightslategrey\:60\:dark { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70\:dark, html.auto .sf-c-txt-lightslategrey\:70\:dark { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80\:dark, html.auto .sf-c-txt-lightslategrey\:80\:dark { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90\:dark, html.auto .sf-c-txt-lightslategrey\:90\:dark { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100\:dark, html.auto .sf-c-txt-lightslategrey\:100\:dark { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:dark, html.var.auto .sf-c-txt-lightslategrey\:dark { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0\:dark, html.var.auto .sf-c-txt-lightslategrey\:0\:dark { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10\:dark, html.var.auto .sf-c-txt-lightslategrey\:10\:dark { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20\:dark, html.var.auto .sf-c-txt-lightslategrey\:20\:dark { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30\:dark, html.var.auto .sf-c-txt-lightslategrey\:30\:dark { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40\:dark, html.var.auto .sf-c-txt-lightslategrey\:40\:dark { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50\:dark, html.var.auto .sf-c-txt-lightslategrey\:50\:dark { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60\:dark, html.var.auto .sf-c-txt-lightslategrey\:60\:dark { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70\:dark, html.var.auto .sf-c-txt-lightslategrey\:70\:dark { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80\:dark, html.var.auto .sf-c-txt-lightslategrey\:80\:dark { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90\:dark, html.var.auto .sf-c-txt-lightslategrey\:90\:dark { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100\:dark, html.var.auto .sf-c-txt-lightslategrey\:100\:dark { color: hsl(210, 14%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightsteelblue.css b/src/colors/10/lightsteelblue.css index 8975950..b9a2d66 100644 --- a/src/colors/10/lightsteelblue.css +++ b/src/colors/10/lightsteelblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightsteelblue'] { --sf-c-lightsteelblue: 214 41% 78%; --sf-c-lightsteelblue-0: 214 41% 0%; --sf-c-lightsteelblue-10: 214 41% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightsteelblue\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightsteelblue\:90\:dark, html.var.auto .sf-c-lightsteelblue\:90\:dark { color: hsl(214, 41%, 90%); background: hsl(214, 41%, 10%) } html.var[data-theme='auto'] .sf-c-lightsteelblue\:100\:dark, html.var.auto .sf-c-lightsteelblue\:100\:dark { color: hsl(214, 41%, 90%); background: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue, html.auto .sf-c-txt-lightsteelblue { color: hsl(214, 41%, 78%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0, html.auto .sf-c-txt-lightsteelblue\:0 { color: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10, html.auto .sf-c-txt-lightsteelblue\:10 { color: hsl(214, 41%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20, html.auto .sf-c-txt-lightsteelblue\:20 { color: hsl(214, 41%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30, html.auto .sf-c-txt-lightsteelblue\:30 { color: hsl(214, 41%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40, html.auto .sf-c-txt-lightsteelblue\:40 { color: hsl(214, 41%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50, html.auto .sf-c-txt-lightsteelblue\:50 { color: hsl(214, 41%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60, html.auto .sf-c-txt-lightsteelblue\:60 { color: hsl(214, 41%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70, html.auto .sf-c-txt-lightsteelblue\:70 { color: hsl(214, 41%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80, html.auto .sf-c-txt-lightsteelblue\:80 { color: hsl(214, 41%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90, html.auto .sf-c-txt-lightsteelblue\:90 { color: hsl(214, 41%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100, html.auto .sf-c-txt-lightsteelblue\:100 { color: hsl(214, 41%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue, html.var.auto .sf-c-txt-lightsteelblue { color: hsl(214, 41%, 78%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0, html.var.auto .sf-c-txt-lightsteelblue\:0 { color: hsl(214, 41%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10, html.var.auto .sf-c-txt-lightsteelblue\:10 { color: hsl(214, 41%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20, html.var.auto .sf-c-txt-lightsteelblue\:20 { color: hsl(214, 41%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30, html.var.auto .sf-c-txt-lightsteelblue\:30 { color: hsl(214, 41%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40, html.var.auto .sf-c-txt-lightsteelblue\:40 { color: hsl(214, 41%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50, html.var.auto .sf-c-txt-lightsteelblue\:50 { color: hsl(214, 41%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60, html.var.auto .sf-c-txt-lightsteelblue\:60 { color: hsl(214, 41%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70, html.var.auto .sf-c-txt-lightsteelblue\:70 { color: hsl(214, 41%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80, html.var.auto .sf-c-txt-lightsteelblue\:80 { color: hsl(214, 41%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90, html.var.auto .sf-c-txt-lightsteelblue\:90 { color: hsl(214, 41%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100, html.var.auto .sf-c-txt-lightsteelblue\:100 { color: hsl(214, 41%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:dark, html.auto .sf-c-txt-lightsteelblue\:dark { color: hsl(214, 41%, 78%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0\:dark, html.auto .sf-c-txt-lightsteelblue\:0\:dark { color: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10\:dark, html.auto .sf-c-txt-lightsteelblue\:10\:dark { color: hsl(214, 41%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20\:dark, html.auto .sf-c-txt-lightsteelblue\:20\:dark { color: hsl(214, 41%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30\:dark, html.auto .sf-c-txt-lightsteelblue\:30\:dark { color: hsl(214, 41%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40\:dark, html.auto .sf-c-txt-lightsteelblue\:40\:dark { color: hsl(214, 41%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50\:dark, html.auto .sf-c-txt-lightsteelblue\:50\:dark { color: hsl(214, 41%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60\:dark, html.auto .sf-c-txt-lightsteelblue\:60\:dark { color: hsl(214, 41%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70\:dark, html.auto .sf-c-txt-lightsteelblue\:70\:dark { color: hsl(214, 41%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80\:dark, html.auto .sf-c-txt-lightsteelblue\:80\:dark { color: hsl(214, 41%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90\:dark, html.auto .sf-c-txt-lightsteelblue\:90\:dark { color: hsl(214, 41%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100\:dark, html.auto .sf-c-txt-lightsteelblue\:100\:dark { color: hsl(214, 41%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:dark, html.var.auto .sf-c-txt-lightsteelblue\:dark { color: hsl(214, 41%, 78%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0\:dark, html.var.auto .sf-c-txt-lightsteelblue\:0\:dark { color: hsl(214, 41%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10\:dark, html.var.auto .sf-c-txt-lightsteelblue\:10\:dark { color: hsl(214, 41%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20\:dark, html.var.auto .sf-c-txt-lightsteelblue\:20\:dark { color: hsl(214, 41%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30\:dark, html.var.auto .sf-c-txt-lightsteelblue\:30\:dark { color: hsl(214, 41%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40\:dark, html.var.auto .sf-c-txt-lightsteelblue\:40\:dark { color: hsl(214, 41%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50\:dark, html.var.auto .sf-c-txt-lightsteelblue\:50\:dark { color: hsl(214, 41%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60\:dark, html.var.auto .sf-c-txt-lightsteelblue\:60\:dark { color: hsl(214, 41%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70\:dark, html.var.auto .sf-c-txt-lightsteelblue\:70\:dark { color: hsl(214, 41%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80\:dark, html.var.auto .sf-c-txt-lightsteelblue\:80\:dark { color: hsl(214, 41%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90\:dark, html.var.auto .sf-c-txt-lightsteelblue\:90\:dark { color: hsl(214, 41%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100\:dark, html.var.auto .sf-c-txt-lightsteelblue\:100\:dark { color: hsl(214, 41%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lightyellow.css b/src/colors/10/lightyellow.css index 989dfcc..686adff 100644 --- a/src/colors/10/lightyellow.css +++ b/src/colors/10/lightyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='lightyellow'] { --sf-c-lightyellow: 60 100% 94%; --sf-c-lightyellow-0: 60 100% 0%; --sf-c-lightyellow-10: 60 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lightyellow\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-lightyellow\:90\:dark, html.var.auto .sf-c-lightyellow\:90\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lightyellow\:100\:dark, html.var.auto .sf-c-lightyellow\:100\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow, html.auto .sf-c-txt-lightyellow { color: hsl(60, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0, html.auto .sf-c-txt-lightyellow\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10, html.auto .sf-c-txt-lightyellow\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20, html.auto .sf-c-txt-lightyellow\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30, html.auto .sf-c-txt-lightyellow\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40, html.auto .sf-c-txt-lightyellow\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50, html.auto .sf-c-txt-lightyellow\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60, html.auto .sf-c-txt-lightyellow\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70, html.auto .sf-c-txt-lightyellow\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80, html.auto .sf-c-txt-lightyellow\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90, html.auto .sf-c-txt-lightyellow\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100, html.auto .sf-c-txt-lightyellow\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow, html.var.auto .sf-c-txt-lightyellow { color: hsl(60, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0, html.var.auto .sf-c-txt-lightyellow\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10, html.var.auto .sf-c-txt-lightyellow\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20, html.var.auto .sf-c-txt-lightyellow\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30, html.var.auto .sf-c-txt-lightyellow\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40, html.var.auto .sf-c-txt-lightyellow\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50, html.var.auto .sf-c-txt-lightyellow\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60, html.var.auto .sf-c-txt-lightyellow\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70, html.var.auto .sf-c-txt-lightyellow\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80, html.var.auto .sf-c-txt-lightyellow\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90, html.var.auto .sf-c-txt-lightyellow\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100, html.var.auto .sf-c-txt-lightyellow\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:dark, html.auto .sf-c-txt-lightyellow\:dark { color: hsl(60, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0\:dark, html.auto .sf-c-txt-lightyellow\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10\:dark, html.auto .sf-c-txt-lightyellow\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20\:dark, html.auto .sf-c-txt-lightyellow\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30\:dark, html.auto .sf-c-txt-lightyellow\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40\:dark, html.auto .sf-c-txt-lightyellow\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50\:dark, html.auto .sf-c-txt-lightyellow\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60\:dark, html.auto .sf-c-txt-lightyellow\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70\:dark, html.auto .sf-c-txt-lightyellow\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80\:dark, html.auto .sf-c-txt-lightyellow\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90\:dark, html.auto .sf-c-txt-lightyellow\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100\:dark, html.auto .sf-c-txt-lightyellow\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:dark, html.var.auto .sf-c-txt-lightyellow\:dark { color: hsl(60, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0\:dark, html.var.auto .sf-c-txt-lightyellow\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10\:dark, html.var.auto .sf-c-txt-lightyellow\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20\:dark, html.var.auto .sf-c-txt-lightyellow\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30\:dark, html.var.auto .sf-c-txt-lightyellow\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40\:dark, html.var.auto .sf-c-txt-lightyellow\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50\:dark, html.var.auto .sf-c-txt-lightyellow\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60\:dark, html.var.auto .sf-c-txt-lightyellow\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70\:dark, html.var.auto .sf-c-txt-lightyellow\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80\:dark, html.var.auto .sf-c-txt-lightyellow\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90\:dark, html.var.auto .sf-c-txt-lightyellow\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100\:dark, html.var.auto .sf-c-txt-lightyellow\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/lime.css b/src/colors/10/lime.css index eba7ba0..fb5ffe7 100644 --- a/src/colors/10/lime.css +++ b/src/colors/10/lime.css @@ -1,4 +1,4 @@ -:root { +[class*='lime'] { --sf-c-lime: 120 100% 50%; --sf-c-lime-0: 120 100% 0%; --sf-c-lime-10: 120 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-lime\:100\:dark, html.dark .sf-c-txt-lime\ html.var[data-theme='auto'] .sf-c-lime\:90\:dark, html.var.auto .sf-c-lime\:90\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 10%) } html.var[data-theme='auto'] .sf-c-lime\:100\:dark, html.var.auto .sf-c-lime\:100\:dark { color: hsl(120, 100%, 90%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime, html.auto .sf-c-txt-lime { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:0, html.auto .sf-c-txt-lime\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:10, html.auto .sf-c-txt-lime\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:20, html.auto .sf-c-txt-lime\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:30, html.auto .sf-c-txt-lime\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:40, html.auto .sf-c-txt-lime\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:50, html.auto .sf-c-txt-lime\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:60, html.auto .sf-c-txt-lime\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:70, html.auto .sf-c-txt-lime\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:80, html.auto .sf-c-txt-lime\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:90, html.auto .sf-c-txt-lime\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:100, html.auto .sf-c-txt-lime\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lime, html.var.auto .sf-c-txt-lime { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:0, html.var.auto .sf-c-txt-lime\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:10, html.var.auto .sf-c-txt-lime\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:20, html.var.auto .sf-c-txt-lime\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:30, html.var.auto .sf-c-txt-lime\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:40, html.var.auto .sf-c-txt-lime\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:50, html.var.auto .sf-c-txt-lime\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:60, html.var.auto .sf-c-txt-lime\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:70, html.var.auto .sf-c-txt-lime\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:80, html.var.auto .sf-c-txt-lime\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:90, html.var.auto .sf-c-txt-lime\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:100, html.var.auto .sf-c-txt-lime\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:dark, html.auto .sf-c-txt-lime\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark, html.auto .sf-c-txt-lime\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark, html.auto .sf-c-txt-lime\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark, html.auto .sf-c-txt-lime\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark, html.auto .sf-c-txt-lime\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark, html.auto .sf-c-txt-lime\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark, html.auto .sf-c-txt-lime\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark, html.auto .sf-c-txt-lime\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark, html.auto .sf-c-txt-lime\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark, html.auto .sf-c-txt-lime\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark, html.auto .sf-c-txt-lime\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark, html.auto .sf-c-txt-lime\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:dark, html.var.auto .sf-c-txt-lime\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark, html.var.auto .sf-c-txt-lime\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark, html.var.auto .sf-c-txt-lime\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark, html.var.auto .sf-c-txt-lime\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark, html.var.auto .sf-c-txt-lime\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark, html.var.auto .sf-c-txt-lime\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark, html.var.auto .sf-c-txt-lime\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark, html.var.auto .sf-c-txt-lime\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark, html.var.auto .sf-c-txt-lime\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark, html.var.auto .sf-c-txt-lime\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark, html.var.auto .sf-c-txt-lime\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark, html.var.auto .sf-c-txt-lime\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/limegreen.css b/src/colors/10/limegreen.css index ecaf41f..5cd3e89 100644 --- a/src/colors/10/limegreen.css +++ b/src/colors/10/limegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='limegreen'] { --sf-c-limegreen: 120 61% 50%; --sf-c-limegreen-0: 120 61% 0%; --sf-c-limegreen-10: 120 61% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-limegreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-limegreen\:90\:dark, html.var.auto .sf-c-limegreen\:90\:dark { color: hsl(120, 61%, 90%); background: hsl(120, 61%, 10%) } html.var[data-theme='auto'] .sf-c-limegreen\:100\:dark, html.var.auto .sf-c-limegreen\:100\:dark { color: hsl(120, 61%, 90%); background: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen, html.auto .sf-c-txt-limegreen { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:0, html.auto .sf-c-txt-limegreen\:0 { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:10, html.auto .sf-c-txt-limegreen\:10 { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:20, html.auto .sf-c-txt-limegreen\:20 { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:30, html.auto .sf-c-txt-limegreen\:30 { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:40, html.auto .sf-c-txt-limegreen\:40 { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:50, html.auto .sf-c-txt-limegreen\:50 { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:60, html.auto .sf-c-txt-limegreen\:60 { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:70, html.auto .sf-c-txt-limegreen\:70 { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:80, html.auto .sf-c-txt-limegreen\:80 { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:90, html.auto .sf-c-txt-limegreen\:90 { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:100, html.auto .sf-c-txt-limegreen\:100 { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen, html.var.auto .sf-c-txt-limegreen { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:0, html.var.auto .sf-c-txt-limegreen\:0 { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:10, html.var.auto .sf-c-txt-limegreen\:10 { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:20, html.var.auto .sf-c-txt-limegreen\:20 { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:30, html.var.auto .sf-c-txt-limegreen\:30 { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:40, html.var.auto .sf-c-txt-limegreen\:40 { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:50, html.var.auto .sf-c-txt-limegreen\:50 { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:60, html.var.auto .sf-c-txt-limegreen\:60 { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:70, html.var.auto .sf-c-txt-limegreen\:70 { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:80, html.var.auto .sf-c-txt-limegreen\:80 { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:90, html.var.auto .sf-c-txt-limegreen\:90 { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:100, html.var.auto .sf-c-txt-limegreen\:100 { color: hsl(120, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:dark, html.auto .sf-c-txt-limegreen\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:0\:dark, html.auto .sf-c-txt-limegreen\:0\:dark { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:10\:dark, html.auto .sf-c-txt-limegreen\:10\:dark { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:20\:dark, html.auto .sf-c-txt-limegreen\:20\:dark { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:30\:dark, html.auto .sf-c-txt-limegreen\:30\:dark { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:40\:dark, html.auto .sf-c-txt-limegreen\:40\:dark { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:50\:dark, html.auto .sf-c-txt-limegreen\:50\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:60\:dark, html.auto .sf-c-txt-limegreen\:60\:dark { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:70\:dark, html.auto .sf-c-txt-limegreen\:70\:dark { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:80\:dark, html.auto .sf-c-txt-limegreen\:80\:dark { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:90\:dark, html.auto .sf-c-txt-limegreen\:90\:dark { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:100\:dark, html.auto .sf-c-txt-limegreen\:100\:dark { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:dark, html.var.auto .sf-c-txt-limegreen\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:0\:dark, html.var.auto .sf-c-txt-limegreen\:0\:dark { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:10\:dark, html.var.auto .sf-c-txt-limegreen\:10\:dark { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:20\:dark, html.var.auto .sf-c-txt-limegreen\:20\:dark { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:30\:dark, html.var.auto .sf-c-txt-limegreen\:30\:dark { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:40\:dark, html.var.auto .sf-c-txt-limegreen\:40\:dark { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:50\:dark, html.var.auto .sf-c-txt-limegreen\:50\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:60\:dark, html.var.auto .sf-c-txt-limegreen\:60\:dark { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:70\:dark, html.var.auto .sf-c-txt-limegreen\:70\:dark { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:80\:dark, html.var.auto .sf-c-txt-limegreen\:80\:dark { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:90\:dark, html.var.auto .sf-c-txt-limegreen\:90\:dark { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:100\:dark, html.var.auto .sf-c-txt-limegreen\:100\:dark { color: hsl(120, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/linen.css b/src/colors/10/linen.css index 0c5edfb..915d8ad 100644 --- a/src/colors/10/linen.css +++ b/src/colors/10/linen.css @@ -1,4 +1,4 @@ -:root { +[class*='linen'] { --sf-c-linen: 30 67% 94%; --sf-c-linen-0: 30 67% 0%; --sf-c-linen-10: 30 67% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-linen\:100\:dark, html.dark .sf-c-txt-line html.var[data-theme='auto'] .sf-c-linen\:90\:dark, html.var.auto .sf-c-linen\:90\:dark { color: hsl(30, 67%, 90%); background: hsl(30, 67%, 10%) } html.var[data-theme='auto'] .sf-c-linen\:100\:dark, html.var.auto .sf-c-linen\:100\:dark { color: hsl(30, 67%, 90%); background: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen, html.auto .sf-c-txt-linen { color: hsl(30, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:0, html.auto .sf-c-txt-linen\:0 { color: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:10, html.auto .sf-c-txt-linen\:10 { color: hsl(30, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:20, html.auto .sf-c-txt-linen\:20 { color: hsl(30, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:30, html.auto .sf-c-txt-linen\:30 { color: hsl(30, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:40, html.auto .sf-c-txt-linen\:40 { color: hsl(30, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:50, html.auto .sf-c-txt-linen\:50 { color: hsl(30, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:60, html.auto .sf-c-txt-linen\:60 { color: hsl(30, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:70, html.auto .sf-c-txt-linen\:70 { color: hsl(30, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:80, html.auto .sf-c-txt-linen\:80 { color: hsl(30, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:90, html.auto .sf-c-txt-linen\:90 { color: hsl(30, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:100, html.auto .sf-c-txt-linen\:100 { color: hsl(30, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-linen, html.var.auto .sf-c-txt-linen { color: hsl(30, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:0, html.var.auto .sf-c-txt-linen\:0 { color: hsl(30, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:10, html.var.auto .sf-c-txt-linen\:10 { color: hsl(30, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:20, html.var.auto .sf-c-txt-linen\:20 { color: hsl(30, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:30, html.var.auto .sf-c-txt-linen\:30 { color: hsl(30, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:40, html.var.auto .sf-c-txt-linen\:40 { color: hsl(30, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:50, html.var.auto .sf-c-txt-linen\:50 { color: hsl(30, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:60, html.var.auto .sf-c-txt-linen\:60 { color: hsl(30, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:70, html.var.auto .sf-c-txt-linen\:70 { color: hsl(30, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:80, html.var.auto .sf-c-txt-linen\:80 { color: hsl(30, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:90, html.var.auto .sf-c-txt-linen\:90 { color: hsl(30, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:100, html.var.auto .sf-c-txt-linen\:100 { color: hsl(30, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:dark, html.auto .sf-c-txt-linen\:dark { color: hsl(30, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:0\:dark, html.auto .sf-c-txt-linen\:0\:dark { color: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:10\:dark, html.auto .sf-c-txt-linen\:10\:dark { color: hsl(30, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:20\:dark, html.auto .sf-c-txt-linen\:20\:dark { color: hsl(30, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:30\:dark, html.auto .sf-c-txt-linen\:30\:dark { color: hsl(30, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:40\:dark, html.auto .sf-c-txt-linen\:40\:dark { color: hsl(30, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:50\:dark, html.auto .sf-c-txt-linen\:50\:dark { color: hsl(30, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:60\:dark, html.auto .sf-c-txt-linen\:60\:dark { color: hsl(30, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:70\:dark, html.auto .sf-c-txt-linen\:70\:dark { color: hsl(30, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:80\:dark, html.auto .sf-c-txt-linen\:80\:dark { color: hsl(30, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:90\:dark, html.auto .sf-c-txt-linen\:90\:dark { color: hsl(30, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:100\:dark, html.auto .sf-c-txt-linen\:100\:dark { color: hsl(30, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:dark, html.var.auto .sf-c-txt-linen\:dark { color: hsl(30, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:0\:dark, html.var.auto .sf-c-txt-linen\:0\:dark { color: hsl(30, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:10\:dark, html.var.auto .sf-c-txt-linen\:10\:dark { color: hsl(30, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:20\:dark, html.var.auto .sf-c-txt-linen\:20\:dark { color: hsl(30, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:30\:dark, html.var.auto .sf-c-txt-linen\:30\:dark { color: hsl(30, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:40\:dark, html.var.auto .sf-c-txt-linen\:40\:dark { color: hsl(30, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:50\:dark, html.var.auto .sf-c-txt-linen\:50\:dark { color: hsl(30, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:60\:dark, html.var.auto .sf-c-txt-linen\:60\:dark { color: hsl(30, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:70\:dark, html.var.auto .sf-c-txt-linen\:70\:dark { color: hsl(30, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:80\:dark, html.var.auto .sf-c-txt-linen\:80\:dark { color: hsl(30, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:90\:dark, html.var.auto .sf-c-txt-linen\:90\:dark { color: hsl(30, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:100\:dark, html.var.auto .sf-c-txt-linen\:100\:dark { color: hsl(30, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/magenta.css b/src/colors/10/magenta.css index d760f80..efb3a4b 100644 --- a/src/colors/10/magenta.css +++ b/src/colors/10/magenta.css @@ -1,4 +1,4 @@ -:root { +[class*='magenta'] { --sf-c-magenta: 300 100% 50%; --sf-c-magenta-0: 300 100% 0%; --sf-c-magenta-10: 300 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-magenta\:100\:dark, html.dark .sf-c-txt-ma html.var[data-theme='auto'] .sf-c-magenta\:90\:dark, html.var.auto .sf-c-magenta\:90\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 10%) } html.var[data-theme='auto'] .sf-c-magenta\:100\:dark, html.var.auto .sf-c-magenta\:100\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta, html.auto .sf-c-txt-magenta { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:0, html.auto .sf-c-txt-magenta\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:10, html.auto .sf-c-txt-magenta\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:20, html.auto .sf-c-txt-magenta\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:30, html.auto .sf-c-txt-magenta\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:40, html.auto .sf-c-txt-magenta\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:50, html.auto .sf-c-txt-magenta\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:60, html.auto .sf-c-txt-magenta\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:70, html.auto .sf-c-txt-magenta\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:80, html.auto .sf-c-txt-magenta\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:90, html.auto .sf-c-txt-magenta\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:100, html.auto .sf-c-txt-magenta\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-magenta, html.var.auto .sf-c-txt-magenta { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:0, html.var.auto .sf-c-txt-magenta\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:10, html.var.auto .sf-c-txt-magenta\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:20, html.var.auto .sf-c-txt-magenta\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:30, html.var.auto .sf-c-txt-magenta\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:40, html.var.auto .sf-c-txt-magenta\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:50, html.var.auto .sf-c-txt-magenta\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:60, html.var.auto .sf-c-txt-magenta\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:70, html.var.auto .sf-c-txt-magenta\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:80, html.var.auto .sf-c-txt-magenta\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:90, html.var.auto .sf-c-txt-magenta\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:100, html.var.auto .sf-c-txt-magenta\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:dark, html.auto .sf-c-txt-magenta\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:0\:dark, html.auto .sf-c-txt-magenta\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:10\:dark, html.auto .sf-c-txt-magenta\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:20\:dark, html.auto .sf-c-txt-magenta\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:30\:dark, html.auto .sf-c-txt-magenta\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:40\:dark, html.auto .sf-c-txt-magenta\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:50\:dark, html.auto .sf-c-txt-magenta\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:60\:dark, html.auto .sf-c-txt-magenta\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:70\:dark, html.auto .sf-c-txt-magenta\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:80\:dark, html.auto .sf-c-txt-magenta\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:90\:dark, html.auto .sf-c-txt-magenta\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:100\:dark, html.auto .sf-c-txt-magenta\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:dark, html.var.auto .sf-c-txt-magenta\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:0\:dark, html.var.auto .sf-c-txt-magenta\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:10\:dark, html.var.auto .sf-c-txt-magenta\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:20\:dark, html.var.auto .sf-c-txt-magenta\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:30\:dark, html.var.auto .sf-c-txt-magenta\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:40\:dark, html.var.auto .sf-c-txt-magenta\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:50\:dark, html.var.auto .sf-c-txt-magenta\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:60\:dark, html.var.auto .sf-c-txt-magenta\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:70\:dark, html.var.auto .sf-c-txt-magenta\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:80\:dark, html.var.auto .sf-c-txt-magenta\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:90\:dark, html.var.auto .sf-c-txt-magenta\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:100\:dark, html.var.auto .sf-c-txt-magenta\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/maroon.css b/src/colors/10/maroon.css index 51eac96..53276a8 100644 --- a/src/colors/10/maroon.css +++ b/src/colors/10/maroon.css @@ -1,4 +1,4 @@ -:root { +[class*='maroon'] { --sf-c-maroon: 0 100% 25%; --sf-c-maroon-0: 0 100% 0%; --sf-c-maroon-10: 0 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-maroon\:100\:dark, html.dark .sf-c-txt-mar html.var[data-theme='auto'] .sf-c-maroon\:90\:dark, html.var.auto .sf-c-maroon\:90\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 10%) } html.var[data-theme='auto'] .sf-c-maroon\:100\:dark, html.var.auto .sf-c-maroon\:100\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon, html.auto .sf-c-txt-maroon { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:0, html.auto .sf-c-txt-maroon\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:10, html.auto .sf-c-txt-maroon\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:20, html.auto .sf-c-txt-maroon\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:30, html.auto .sf-c-txt-maroon\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:40, html.auto .sf-c-txt-maroon\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:50, html.auto .sf-c-txt-maroon\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:60, html.auto .sf-c-txt-maroon\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:70, html.auto .sf-c-txt-maroon\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:80, html.auto .sf-c-txt-maroon\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:90, html.auto .sf-c-txt-maroon\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:100, html.auto .sf-c-txt-maroon\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-maroon, html.var.auto .sf-c-txt-maroon { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:0, html.var.auto .sf-c-txt-maroon\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:10, html.var.auto .sf-c-txt-maroon\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:20, html.var.auto .sf-c-txt-maroon\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:30, html.var.auto .sf-c-txt-maroon\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:40, html.var.auto .sf-c-txt-maroon\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:50, html.var.auto .sf-c-txt-maroon\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:60, html.var.auto .sf-c-txt-maroon\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:70, html.var.auto .sf-c-txt-maroon\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:80, html.var.auto .sf-c-txt-maroon\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:90, html.var.auto .sf-c-txt-maroon\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:100, html.var.auto .sf-c-txt-maroon\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:dark, html.auto .sf-c-txt-maroon\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark, html.auto .sf-c-txt-maroon\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark, html.auto .sf-c-txt-maroon\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark, html.auto .sf-c-txt-maroon\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark, html.auto .sf-c-txt-maroon\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark, html.auto .sf-c-txt-maroon\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark, html.auto .sf-c-txt-maroon\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark, html.auto .sf-c-txt-maroon\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark, html.auto .sf-c-txt-maroon\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark, html.auto .sf-c-txt-maroon\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark, html.auto .sf-c-txt-maroon\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark, html.auto .sf-c-txt-maroon\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:dark, html.var.auto .sf-c-txt-maroon\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark, html.var.auto .sf-c-txt-maroon\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark, html.var.auto .sf-c-txt-maroon\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark, html.var.auto .sf-c-txt-maroon\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark, html.var.auto .sf-c-txt-maroon\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark, html.var.auto .sf-c-txt-maroon\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark, html.var.auto .sf-c-txt-maroon\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark, html.var.auto .sf-c-txt-maroon\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark, html.var.auto .sf-c-txt-maroon\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark, html.var.auto .sf-c-txt-maroon\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark, html.var.auto .sf-c-txt-maroon\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark, html.var.auto .sf-c-txt-maroon\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumaquamarine.css b/src/colors/10/mediumaquamarine.css index f43a44d..7400c1c 100644 --- a/src/colors/10/mediumaquamarine.css +++ b/src/colors/10/mediumaquamarine.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumaquamarine'] { --sf-c-mediumaquamarine: 160 51% 60%; --sf-c-mediumaquamarine-0: 160 51% 0%; --sf-c-mediumaquamarine-10: 160 51% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumaquamarine\:100\:dark, html.dark .sf html.var[data-theme='auto'] .sf-c-mediumaquamarine\:90\:dark, html.var.auto .sf-c-mediumaquamarine\:90\:dark { color: hsl(160, 51%, 90%); background: hsl(160, 51%, 10%) } html.var[data-theme='auto'] .sf-c-mediumaquamarine\:100\:dark, html.var.auto .sf-c-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 90%); background: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine, html.auto .sf-c-txt-mediumaquamarine { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0, html.auto .sf-c-txt-mediumaquamarine\:0 { color: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10, html.auto .sf-c-txt-mediumaquamarine\:10 { color: hsl(160, 51%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20, html.auto .sf-c-txt-mediumaquamarine\:20 { color: hsl(160, 51%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30, html.auto .sf-c-txt-mediumaquamarine\:30 { color: hsl(160, 51%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40, html.auto .sf-c-txt-mediumaquamarine\:40 { color: hsl(160, 51%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50, html.auto .sf-c-txt-mediumaquamarine\:50 { color: hsl(160, 51%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60, html.auto .sf-c-txt-mediumaquamarine\:60 { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70, html.auto .sf-c-txt-mediumaquamarine\:70 { color: hsl(160, 51%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80, html.auto .sf-c-txt-mediumaquamarine\:80 { color: hsl(160, 51%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90, html.auto .sf-c-txt-mediumaquamarine\:90 { color: hsl(160, 51%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100, html.auto .sf-c-txt-mediumaquamarine\:100 { color: hsl(160, 51%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine, html.var.auto .sf-c-txt-mediumaquamarine { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0, html.var.auto .sf-c-txt-mediumaquamarine\:0 { color: hsl(160, 51%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10, html.var.auto .sf-c-txt-mediumaquamarine\:10 { color: hsl(160, 51%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20, html.var.auto .sf-c-txt-mediumaquamarine\:20 { color: hsl(160, 51%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30, html.var.auto .sf-c-txt-mediumaquamarine\:30 { color: hsl(160, 51%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40, html.var.auto .sf-c-txt-mediumaquamarine\:40 { color: hsl(160, 51%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50, html.var.auto .sf-c-txt-mediumaquamarine\:50 { color: hsl(160, 51%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60, html.var.auto .sf-c-txt-mediumaquamarine\:60 { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70, html.var.auto .sf-c-txt-mediumaquamarine\:70 { color: hsl(160, 51%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80, html.var.auto .sf-c-txt-mediumaquamarine\:80 { color: hsl(160, 51%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90, html.var.auto .sf-c-txt-mediumaquamarine\:90 { color: hsl(160, 51%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100, html.var.auto .sf-c-txt-mediumaquamarine\:100 { color: hsl(160, 51%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:dark, html.auto .sf-c-txt-mediumaquamarine\:dark { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0\:dark, html.auto .sf-c-txt-mediumaquamarine\:0\:dark { color: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10\:dark, html.auto .sf-c-txt-mediumaquamarine\:10\:dark { color: hsl(160, 51%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20\:dark, html.auto .sf-c-txt-mediumaquamarine\:20\:dark { color: hsl(160, 51%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30\:dark, html.auto .sf-c-txt-mediumaquamarine\:30\:dark { color: hsl(160, 51%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40\:dark, html.auto .sf-c-txt-mediumaquamarine\:40\:dark { color: hsl(160, 51%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50\:dark, html.auto .sf-c-txt-mediumaquamarine\:50\:dark { color: hsl(160, 51%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60\:dark, html.auto .sf-c-txt-mediumaquamarine\:60\:dark { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70\:dark, html.auto .sf-c-txt-mediumaquamarine\:70\:dark { color: hsl(160, 51%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80\:dark, html.auto .sf-c-txt-mediumaquamarine\:80\:dark { color: hsl(160, 51%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90\:dark, html.auto .sf-c-txt-mediumaquamarine\:90\:dark { color: hsl(160, 51%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100\:dark, html.auto .sf-c-txt-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:dark { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:0\:dark { color: hsl(160, 51%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:10\:dark { color: hsl(160, 51%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:20\:dark { color: hsl(160, 51%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:30\:dark { color: hsl(160, 51%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:40\:dark { color: hsl(160, 51%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:50\:dark { color: hsl(160, 51%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:60\:dark { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:70\:dark { color: hsl(160, 51%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:80\:dark { color: hsl(160, 51%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:90\:dark { color: hsl(160, 51%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumblue.css b/src/colors/10/mediumblue.css index 4f882c6..e41b09f 100644 --- a/src/colors/10/mediumblue.css +++ b/src/colors/10/mediumblue.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumblue'] { --sf-c-mediumblue: 240 100% 40%; --sf-c-mediumblue-0: 240 100% 0%; --sf-c-mediumblue-10: 240 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-mediumblue\:90\:dark, html.var.auto .sf-c-mediumblue\:90\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 10%) } html.var[data-theme='auto'] .sf-c-mediumblue\:100\:dark, html.var.auto .sf-c-mediumblue\:100\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue, html.auto .sf-c-txt-mediumblue { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0, html.auto .sf-c-txt-mediumblue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10, html.auto .sf-c-txt-mediumblue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20, html.auto .sf-c-txt-mediumblue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30, html.auto .sf-c-txt-mediumblue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40, html.auto .sf-c-txt-mediumblue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50, html.auto .sf-c-txt-mediumblue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60, html.auto .sf-c-txt-mediumblue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70, html.auto .sf-c-txt-mediumblue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80, html.auto .sf-c-txt-mediumblue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90, html.auto .sf-c-txt-mediumblue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100, html.auto .sf-c-txt-mediumblue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue, html.var.auto .sf-c-txt-mediumblue { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0, html.var.auto .sf-c-txt-mediumblue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10, html.var.auto .sf-c-txt-mediumblue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20, html.var.auto .sf-c-txt-mediumblue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30, html.var.auto .sf-c-txt-mediumblue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40, html.var.auto .sf-c-txt-mediumblue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50, html.var.auto .sf-c-txt-mediumblue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60, html.var.auto .sf-c-txt-mediumblue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70, html.var.auto .sf-c-txt-mediumblue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80, html.var.auto .sf-c-txt-mediumblue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90, html.var.auto .sf-c-txt-mediumblue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100, html.var.auto .sf-c-txt-mediumblue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:dark, html.auto .sf-c-txt-mediumblue\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0\:dark, html.auto .sf-c-txt-mediumblue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10\:dark, html.auto .sf-c-txt-mediumblue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20\:dark, html.auto .sf-c-txt-mediumblue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30\:dark, html.auto .sf-c-txt-mediumblue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40\:dark, html.auto .sf-c-txt-mediumblue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50\:dark, html.auto .sf-c-txt-mediumblue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60\:dark, html.auto .sf-c-txt-mediumblue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70\:dark, html.auto .sf-c-txt-mediumblue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80\:dark, html.auto .sf-c-txt-mediumblue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90\:dark, html.auto .sf-c-txt-mediumblue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100\:dark, html.auto .sf-c-txt-mediumblue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:dark, html.var.auto .sf-c-txt-mediumblue\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0\:dark, html.var.auto .sf-c-txt-mediumblue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10\:dark, html.var.auto .sf-c-txt-mediumblue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20\:dark, html.var.auto .sf-c-txt-mediumblue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30\:dark, html.var.auto .sf-c-txt-mediumblue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40\:dark, html.var.auto .sf-c-txt-mediumblue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50\:dark, html.var.auto .sf-c-txt-mediumblue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60\:dark, html.var.auto .sf-c-txt-mediumblue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70\:dark, html.var.auto .sf-c-txt-mediumblue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80\:dark, html.var.auto .sf-c-txt-mediumblue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90\:dark, html.var.auto .sf-c-txt-mediumblue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100\:dark, html.var.auto .sf-c-txt-mediumblue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumorchid.css b/src/colors/10/mediumorchid.css index a2884e2..c05976f 100644 --- a/src/colors/10/mediumorchid.css +++ b/src/colors/10/mediumorchid.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumorchid'] { --sf-c-mediumorchid: 288 59% 58%; --sf-c-mediumorchid-0: 288 59% 0%; --sf-c-mediumorchid-10: 288 59% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumorchid\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-mediumorchid\:90\:dark, html.var.auto .sf-c-mediumorchid\:90\:dark { color: hsl(288, 59%, 90%); background: hsl(288, 59%, 10%) } html.var[data-theme='auto'] .sf-c-mediumorchid\:100\:dark, html.var.auto .sf-c-mediumorchid\:100\:dark { color: hsl(288, 59%, 90%); background: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid, html.auto .sf-c-txt-mediumorchid { color: hsl(288, 59%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0, html.auto .sf-c-txt-mediumorchid\:0 { color: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10, html.auto .sf-c-txt-mediumorchid\:10 { color: hsl(288, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20, html.auto .sf-c-txt-mediumorchid\:20 { color: hsl(288, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30, html.auto .sf-c-txt-mediumorchid\:30 { color: hsl(288, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40, html.auto .sf-c-txt-mediumorchid\:40 { color: hsl(288, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50, html.auto .sf-c-txt-mediumorchid\:50 { color: hsl(288, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60, html.auto .sf-c-txt-mediumorchid\:60 { color: hsl(288, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70, html.auto .sf-c-txt-mediumorchid\:70 { color: hsl(288, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80, html.auto .sf-c-txt-mediumorchid\:80 { color: hsl(288, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90, html.auto .sf-c-txt-mediumorchid\:90 { color: hsl(288, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100, html.auto .sf-c-txt-mediumorchid\:100 { color: hsl(288, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid, html.var.auto .sf-c-txt-mediumorchid { color: hsl(288, 59%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0, html.var.auto .sf-c-txt-mediumorchid\:0 { color: hsl(288, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10, html.var.auto .sf-c-txt-mediumorchid\:10 { color: hsl(288, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20, html.var.auto .sf-c-txt-mediumorchid\:20 { color: hsl(288, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30, html.var.auto .sf-c-txt-mediumorchid\:30 { color: hsl(288, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40, html.var.auto .sf-c-txt-mediumorchid\:40 { color: hsl(288, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50, html.var.auto .sf-c-txt-mediumorchid\:50 { color: hsl(288, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60, html.var.auto .sf-c-txt-mediumorchid\:60 { color: hsl(288, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70, html.var.auto .sf-c-txt-mediumorchid\:70 { color: hsl(288, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80, html.var.auto .sf-c-txt-mediumorchid\:80 { color: hsl(288, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90, html.var.auto .sf-c-txt-mediumorchid\:90 { color: hsl(288, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100, html.var.auto .sf-c-txt-mediumorchid\:100 { color: hsl(288, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:dark, html.auto .sf-c-txt-mediumorchid\:dark { color: hsl(288, 59%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0\:dark, html.auto .sf-c-txt-mediumorchid\:0\:dark { color: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10\:dark, html.auto .sf-c-txt-mediumorchid\:10\:dark { color: hsl(288, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20\:dark, html.auto .sf-c-txt-mediumorchid\:20\:dark { color: hsl(288, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30\:dark, html.auto .sf-c-txt-mediumorchid\:30\:dark { color: hsl(288, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40\:dark, html.auto .sf-c-txt-mediumorchid\:40\:dark { color: hsl(288, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50\:dark, html.auto .sf-c-txt-mediumorchid\:50\:dark { color: hsl(288, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60\:dark, html.auto .sf-c-txt-mediumorchid\:60\:dark { color: hsl(288, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70\:dark, html.auto .sf-c-txt-mediumorchid\:70\:dark { color: hsl(288, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80\:dark, html.auto .sf-c-txt-mediumorchid\:80\:dark { color: hsl(288, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90\:dark, html.auto .sf-c-txt-mediumorchid\:90\:dark { color: hsl(288, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100\:dark, html.auto .sf-c-txt-mediumorchid\:100\:dark { color: hsl(288, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:dark, html.var.auto .sf-c-txt-mediumorchid\:dark { color: hsl(288, 59%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0\:dark, html.var.auto .sf-c-txt-mediumorchid\:0\:dark { color: hsl(288, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10\:dark, html.var.auto .sf-c-txt-mediumorchid\:10\:dark { color: hsl(288, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20\:dark, html.var.auto .sf-c-txt-mediumorchid\:20\:dark { color: hsl(288, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30\:dark, html.var.auto .sf-c-txt-mediumorchid\:30\:dark { color: hsl(288, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40\:dark, html.var.auto .sf-c-txt-mediumorchid\:40\:dark { color: hsl(288, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50\:dark, html.var.auto .sf-c-txt-mediumorchid\:50\:dark { color: hsl(288, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60\:dark, html.var.auto .sf-c-txt-mediumorchid\:60\:dark { color: hsl(288, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70\:dark, html.var.auto .sf-c-txt-mediumorchid\:70\:dark { color: hsl(288, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80\:dark, html.var.auto .sf-c-txt-mediumorchid\:80\:dark { color: hsl(288, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90\:dark, html.var.auto .sf-c-txt-mediumorchid\:90\:dark { color: hsl(288, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100\:dark, html.var.auto .sf-c-txt-mediumorchid\:100\:dark { color: hsl(288, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumpurple.css b/src/colors/10/mediumpurple.css index 78cd7fc..a1ff3e9 100644 --- a/src/colors/10/mediumpurple.css +++ b/src/colors/10/mediumpurple.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumpurple'] { --sf-c-mediumpurple: 260 60% 65%; --sf-c-mediumpurple-0: 260 60% 0%; --sf-c-mediumpurple-10: 260 60% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumpurple\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-mediumpurple\:90\:dark, html.var.auto .sf-c-mediumpurple\:90\:dark { color: hsl(260, 60%, 90%); background: hsl(260, 60%, 10%) } html.var[data-theme='auto'] .sf-c-mediumpurple\:100\:dark, html.var.auto .sf-c-mediumpurple\:100\:dark { color: hsl(260, 60%, 90%); background: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple, html.auto .sf-c-txt-mediumpurple { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0, html.auto .sf-c-txt-mediumpurple\:0 { color: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10, html.auto .sf-c-txt-mediumpurple\:10 { color: hsl(260, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20, html.auto .sf-c-txt-mediumpurple\:20 { color: hsl(260, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30, html.auto .sf-c-txt-mediumpurple\:30 { color: hsl(260, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40, html.auto .sf-c-txt-mediumpurple\:40 { color: hsl(260, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50, html.auto .sf-c-txt-mediumpurple\:50 { color: hsl(260, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60, html.auto .sf-c-txt-mediumpurple\:60 { color: hsl(260, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70, html.auto .sf-c-txt-mediumpurple\:70 { color: hsl(260, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80, html.auto .sf-c-txt-mediumpurple\:80 { color: hsl(260, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90, html.auto .sf-c-txt-mediumpurple\:90 { color: hsl(260, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100, html.auto .sf-c-txt-mediumpurple\:100 { color: hsl(260, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple, html.var.auto .sf-c-txt-mediumpurple { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0, html.var.auto .sf-c-txt-mediumpurple\:0 { color: hsl(260, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10, html.var.auto .sf-c-txt-mediumpurple\:10 { color: hsl(260, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20, html.var.auto .sf-c-txt-mediumpurple\:20 { color: hsl(260, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30, html.var.auto .sf-c-txt-mediumpurple\:30 { color: hsl(260, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40, html.var.auto .sf-c-txt-mediumpurple\:40 { color: hsl(260, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50, html.var.auto .sf-c-txt-mediumpurple\:50 { color: hsl(260, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60, html.var.auto .sf-c-txt-mediumpurple\:60 { color: hsl(260, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70, html.var.auto .sf-c-txt-mediumpurple\:70 { color: hsl(260, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80, html.var.auto .sf-c-txt-mediumpurple\:80 { color: hsl(260, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90, html.var.auto .sf-c-txt-mediumpurple\:90 { color: hsl(260, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100, html.var.auto .sf-c-txt-mediumpurple\:100 { color: hsl(260, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:dark, html.auto .sf-c-txt-mediumpurple\:dark { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0\:dark, html.auto .sf-c-txt-mediumpurple\:0\:dark { color: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10\:dark, html.auto .sf-c-txt-mediumpurple\:10\:dark { color: hsl(260, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20\:dark, html.auto .sf-c-txt-mediumpurple\:20\:dark { color: hsl(260, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30\:dark, html.auto .sf-c-txt-mediumpurple\:30\:dark { color: hsl(260, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40\:dark, html.auto .sf-c-txt-mediumpurple\:40\:dark { color: hsl(260, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50\:dark, html.auto .sf-c-txt-mediumpurple\:50\:dark { color: hsl(260, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60\:dark, html.auto .sf-c-txt-mediumpurple\:60\:dark { color: hsl(260, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70\:dark, html.auto .sf-c-txt-mediumpurple\:70\:dark { color: hsl(260, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80\:dark, html.auto .sf-c-txt-mediumpurple\:80\:dark { color: hsl(260, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90\:dark, html.auto .sf-c-txt-mediumpurple\:90\:dark { color: hsl(260, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100\:dark, html.auto .sf-c-txt-mediumpurple\:100\:dark { color: hsl(260, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:dark, html.var.auto .sf-c-txt-mediumpurple\:dark { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0\:dark, html.var.auto .sf-c-txt-mediumpurple\:0\:dark { color: hsl(260, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10\:dark, html.var.auto .sf-c-txt-mediumpurple\:10\:dark { color: hsl(260, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20\:dark, html.var.auto .sf-c-txt-mediumpurple\:20\:dark { color: hsl(260, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30\:dark, html.var.auto .sf-c-txt-mediumpurple\:30\:dark { color: hsl(260, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40\:dark, html.var.auto .sf-c-txt-mediumpurple\:40\:dark { color: hsl(260, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50\:dark, html.var.auto .sf-c-txt-mediumpurple\:50\:dark { color: hsl(260, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60\:dark, html.var.auto .sf-c-txt-mediumpurple\:60\:dark { color: hsl(260, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70\:dark, html.var.auto .sf-c-txt-mediumpurple\:70\:dark { color: hsl(260, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80\:dark, html.var.auto .sf-c-txt-mediumpurple\:80\:dark { color: hsl(260, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90\:dark, html.var.auto .sf-c-txt-mediumpurple\:90\:dark { color: hsl(260, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100\:dark, html.var.auto .sf-c-txt-mediumpurple\:100\:dark { color: hsl(260, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumseagreen.css b/src/colors/10/mediumseagreen.css index 18b8684..54fea07 100644 --- a/src/colors/10/mediumseagreen.css +++ b/src/colors/10/mediumseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumseagreen'] { --sf-c-mediumseagreen: 147 50% 47%; --sf-c-mediumseagreen-0: 147 50% 0%; --sf-c-mediumseagreen-10: 147 50% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumseagreen\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-mediumseagreen\:90\:dark, html.var.auto .sf-c-mediumseagreen\:90\:dark { color: hsl(147, 50%, 90%); background: hsl(147, 50%, 10%) } html.var[data-theme='auto'] .sf-c-mediumseagreen\:100\:dark, html.var.auto .sf-c-mediumseagreen\:100\:dark { color: hsl(147, 50%, 90%); background: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen, html.auto .sf-c-txt-mediumseagreen { color: hsl(147, 50%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0, html.auto .sf-c-txt-mediumseagreen\:0 { color: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10, html.auto .sf-c-txt-mediumseagreen\:10 { color: hsl(147, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20, html.auto .sf-c-txt-mediumseagreen\:20 { color: hsl(147, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30, html.auto .sf-c-txt-mediumseagreen\:30 { color: hsl(147, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40, html.auto .sf-c-txt-mediumseagreen\:40 { color: hsl(147, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50, html.auto .sf-c-txt-mediumseagreen\:50 { color: hsl(147, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60, html.auto .sf-c-txt-mediumseagreen\:60 { color: hsl(147, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70, html.auto .sf-c-txt-mediumseagreen\:70 { color: hsl(147, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80, html.auto .sf-c-txt-mediumseagreen\:80 { color: hsl(147, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90, html.auto .sf-c-txt-mediumseagreen\:90 { color: hsl(147, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100, html.auto .sf-c-txt-mediumseagreen\:100 { color: hsl(147, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen, html.var.auto .sf-c-txt-mediumseagreen { color: hsl(147, 50%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0, html.var.auto .sf-c-txt-mediumseagreen\:0 { color: hsl(147, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10, html.var.auto .sf-c-txt-mediumseagreen\:10 { color: hsl(147, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20, html.var.auto .sf-c-txt-mediumseagreen\:20 { color: hsl(147, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30, html.var.auto .sf-c-txt-mediumseagreen\:30 { color: hsl(147, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40, html.var.auto .sf-c-txt-mediumseagreen\:40 { color: hsl(147, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50, html.var.auto .sf-c-txt-mediumseagreen\:50 { color: hsl(147, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60, html.var.auto .sf-c-txt-mediumseagreen\:60 { color: hsl(147, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70, html.var.auto .sf-c-txt-mediumseagreen\:70 { color: hsl(147, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80, html.var.auto .sf-c-txt-mediumseagreen\:80 { color: hsl(147, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90, html.var.auto .sf-c-txt-mediumseagreen\:90 { color: hsl(147, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100, html.var.auto .sf-c-txt-mediumseagreen\:100 { color: hsl(147, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:dark, html.auto .sf-c-txt-mediumseagreen\:dark { color: hsl(147, 50%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0\:dark, html.auto .sf-c-txt-mediumseagreen\:0\:dark { color: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10\:dark, html.auto .sf-c-txt-mediumseagreen\:10\:dark { color: hsl(147, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20\:dark, html.auto .sf-c-txt-mediumseagreen\:20\:dark { color: hsl(147, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30\:dark, html.auto .sf-c-txt-mediumseagreen\:30\:dark { color: hsl(147, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40\:dark, html.auto .sf-c-txt-mediumseagreen\:40\:dark { color: hsl(147, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50\:dark, html.auto .sf-c-txt-mediumseagreen\:50\:dark { color: hsl(147, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60\:dark, html.auto .sf-c-txt-mediumseagreen\:60\:dark { color: hsl(147, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70\:dark, html.auto .sf-c-txt-mediumseagreen\:70\:dark { color: hsl(147, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80\:dark, html.auto .sf-c-txt-mediumseagreen\:80\:dark { color: hsl(147, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90\:dark, html.auto .sf-c-txt-mediumseagreen\:90\:dark { color: hsl(147, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100\:dark, html.auto .sf-c-txt-mediumseagreen\:100\:dark { color: hsl(147, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:dark, html.var.auto .sf-c-txt-mediumseagreen\:dark { color: hsl(147, 50%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0\:dark, html.var.auto .sf-c-txt-mediumseagreen\:0\:dark { color: hsl(147, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10\:dark, html.var.auto .sf-c-txt-mediumseagreen\:10\:dark { color: hsl(147, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20\:dark, html.var.auto .sf-c-txt-mediumseagreen\:20\:dark { color: hsl(147, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30\:dark, html.var.auto .sf-c-txt-mediumseagreen\:30\:dark { color: hsl(147, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40\:dark, html.var.auto .sf-c-txt-mediumseagreen\:40\:dark { color: hsl(147, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50\:dark, html.var.auto .sf-c-txt-mediumseagreen\:50\:dark { color: hsl(147, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60\:dark, html.var.auto .sf-c-txt-mediumseagreen\:60\:dark { color: hsl(147, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70\:dark, html.var.auto .sf-c-txt-mediumseagreen\:70\:dark { color: hsl(147, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80\:dark, html.var.auto .sf-c-txt-mediumseagreen\:80\:dark { color: hsl(147, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90\:dark, html.var.auto .sf-c-txt-mediumseagreen\:90\:dark { color: hsl(147, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100\:dark, html.var.auto .sf-c-txt-mediumseagreen\:100\:dark { color: hsl(147, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumslateblue.css b/src/colors/10/mediumslateblue.css index e638eb6..6222a31 100644 --- a/src/colors/10/mediumslateblue.css +++ b/src/colors/10/mediumslateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumslateblue'] { --sf-c-mediumslateblue: 249 80% 67%; --sf-c-mediumslateblue-0: 249 80% 0%; --sf-c-mediumslateblue-10: 249 80% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumslateblue\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumslateblue\:90\:dark, html.var.auto .sf-c-mediumslateblue\:90\:dark { color: hsl(249, 80%, 90%); background: hsl(249, 80%, 10%) } html.var[data-theme='auto'] .sf-c-mediumslateblue\:100\:dark, html.var.auto .sf-c-mediumslateblue\:100\:dark { color: hsl(249, 80%, 90%); background: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue, html.auto .sf-c-txt-mediumslateblue { color: hsl(249, 80%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0, html.auto .sf-c-txt-mediumslateblue\:0 { color: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10, html.auto .sf-c-txt-mediumslateblue\:10 { color: hsl(249, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20, html.auto .sf-c-txt-mediumslateblue\:20 { color: hsl(249, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30, html.auto .sf-c-txt-mediumslateblue\:30 { color: hsl(249, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40, html.auto .sf-c-txt-mediumslateblue\:40 { color: hsl(249, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50, html.auto .sf-c-txt-mediumslateblue\:50 { color: hsl(249, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60, html.auto .sf-c-txt-mediumslateblue\:60 { color: hsl(249, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70, html.auto .sf-c-txt-mediumslateblue\:70 { color: hsl(249, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80, html.auto .sf-c-txt-mediumslateblue\:80 { color: hsl(249, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90, html.auto .sf-c-txt-mediumslateblue\:90 { color: hsl(249, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100, html.auto .sf-c-txt-mediumslateblue\:100 { color: hsl(249, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue, html.var.auto .sf-c-txt-mediumslateblue { color: hsl(249, 80%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0, html.var.auto .sf-c-txt-mediumslateblue\:0 { color: hsl(249, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10, html.var.auto .sf-c-txt-mediumslateblue\:10 { color: hsl(249, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20, html.var.auto .sf-c-txt-mediumslateblue\:20 { color: hsl(249, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30, html.var.auto .sf-c-txt-mediumslateblue\:30 { color: hsl(249, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40, html.var.auto .sf-c-txt-mediumslateblue\:40 { color: hsl(249, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50, html.var.auto .sf-c-txt-mediumslateblue\:50 { color: hsl(249, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60, html.var.auto .sf-c-txt-mediumslateblue\:60 { color: hsl(249, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70, html.var.auto .sf-c-txt-mediumslateblue\:70 { color: hsl(249, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80, html.var.auto .sf-c-txt-mediumslateblue\:80 { color: hsl(249, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90, html.var.auto .sf-c-txt-mediumslateblue\:90 { color: hsl(249, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100, html.var.auto .sf-c-txt-mediumslateblue\:100 { color: hsl(249, 80%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:dark, html.auto .sf-c-txt-mediumslateblue\:dark { color: hsl(249, 80%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0\:dark, html.auto .sf-c-txt-mediumslateblue\:0\:dark { color: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10\:dark, html.auto .sf-c-txt-mediumslateblue\:10\:dark { color: hsl(249, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20\:dark, html.auto .sf-c-txt-mediumslateblue\:20\:dark { color: hsl(249, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30\:dark, html.auto .sf-c-txt-mediumslateblue\:30\:dark { color: hsl(249, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40\:dark, html.auto .sf-c-txt-mediumslateblue\:40\:dark { color: hsl(249, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50\:dark, html.auto .sf-c-txt-mediumslateblue\:50\:dark { color: hsl(249, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60\:dark, html.auto .sf-c-txt-mediumslateblue\:60\:dark { color: hsl(249, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70\:dark, html.auto .sf-c-txt-mediumslateblue\:70\:dark { color: hsl(249, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80\:dark, html.auto .sf-c-txt-mediumslateblue\:80\:dark { color: hsl(249, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90\:dark, html.auto .sf-c-txt-mediumslateblue\:90\:dark { color: hsl(249, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100\:dark, html.auto .sf-c-txt-mediumslateblue\:100\:dark { color: hsl(249, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:dark, html.var.auto .sf-c-txt-mediumslateblue\:dark { color: hsl(249, 80%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0\:dark, html.var.auto .sf-c-txt-mediumslateblue\:0\:dark { color: hsl(249, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10\:dark, html.var.auto .sf-c-txt-mediumslateblue\:10\:dark { color: hsl(249, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20\:dark, html.var.auto .sf-c-txt-mediumslateblue\:20\:dark { color: hsl(249, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30\:dark, html.var.auto .sf-c-txt-mediumslateblue\:30\:dark { color: hsl(249, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40\:dark, html.var.auto .sf-c-txt-mediumslateblue\:40\:dark { color: hsl(249, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50\:dark, html.var.auto .sf-c-txt-mediumslateblue\:50\:dark { color: hsl(249, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60\:dark, html.var.auto .sf-c-txt-mediumslateblue\:60\:dark { color: hsl(249, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70\:dark, html.var.auto .sf-c-txt-mediumslateblue\:70\:dark { color: hsl(249, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80\:dark, html.var.auto .sf-c-txt-mediumslateblue\:80\:dark { color: hsl(249, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90\:dark, html.var.auto .sf-c-txt-mediumslateblue\:90\:dark { color: hsl(249, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100\:dark, html.var.auto .sf-c-txt-mediumslateblue\:100\:dark { color: hsl(249, 80%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumspringgreen.css b/src/colors/10/mediumspringgreen.css index ca32127..82661cc 100644 --- a/src/colors/10/mediumspringgreen.css +++ b/src/colors/10/mediumspringgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumspringgreen'] { --sf-c-mediumspringgreen: 157 100% 49%; --sf-c-mediumspringgreen-0: 157 100% 0%; --sf-c-mediumspringgreen-10: 157 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumspringgreen\:100\:dark, html.dark .s html.var[data-theme='auto'] .sf-c-mediumspringgreen\:90\:dark, html.var.auto .sf-c-mediumspringgreen\:90\:dark { color: hsl(157, 100%, 90%); background: hsl(157, 100%, 10%) } html.var[data-theme='auto'] .sf-c-mediumspringgreen\:100\:dark, html.var.auto .sf-c-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 90%); background: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen, html.auto .sf-c-txt-mediumspringgreen { color: hsl(157, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0, html.auto .sf-c-txt-mediumspringgreen\:0 { color: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10, html.auto .sf-c-txt-mediumspringgreen\:10 { color: hsl(157, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20, html.auto .sf-c-txt-mediumspringgreen\:20 { color: hsl(157, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30, html.auto .sf-c-txt-mediumspringgreen\:30 { color: hsl(157, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40, html.auto .sf-c-txt-mediumspringgreen\:40 { color: hsl(157, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50, html.auto .sf-c-txt-mediumspringgreen\:50 { color: hsl(157, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60, html.auto .sf-c-txt-mediumspringgreen\:60 { color: hsl(157, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70, html.auto .sf-c-txt-mediumspringgreen\:70 { color: hsl(157, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80, html.auto .sf-c-txt-mediumspringgreen\:80 { color: hsl(157, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90, html.auto .sf-c-txt-mediumspringgreen\:90 { color: hsl(157, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100, html.auto .sf-c-txt-mediumspringgreen\:100 { color: hsl(157, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen, html.var.auto .sf-c-txt-mediumspringgreen { color: hsl(157, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0, html.var.auto .sf-c-txt-mediumspringgreen\:0 { color: hsl(157, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10, html.var.auto .sf-c-txt-mediumspringgreen\:10 { color: hsl(157, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20, html.var.auto .sf-c-txt-mediumspringgreen\:20 { color: hsl(157, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30, html.var.auto .sf-c-txt-mediumspringgreen\:30 { color: hsl(157, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40, html.var.auto .sf-c-txt-mediumspringgreen\:40 { color: hsl(157, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50, html.var.auto .sf-c-txt-mediumspringgreen\:50 { color: hsl(157, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60, html.var.auto .sf-c-txt-mediumspringgreen\:60 { color: hsl(157, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70, html.var.auto .sf-c-txt-mediumspringgreen\:70 { color: hsl(157, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80, html.var.auto .sf-c-txt-mediumspringgreen\:80 { color: hsl(157, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90, html.var.auto .sf-c-txt-mediumspringgreen\:90 { color: hsl(157, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100, html.var.auto .sf-c-txt-mediumspringgreen\:100 { color: hsl(157, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:dark, html.auto .sf-c-txt-mediumspringgreen\:dark { color: hsl(157, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0\:dark, html.auto .sf-c-txt-mediumspringgreen\:0\:dark { color: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10\:dark, html.auto .sf-c-txt-mediumspringgreen\:10\:dark { color: hsl(157, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20\:dark, html.auto .sf-c-txt-mediumspringgreen\:20\:dark { color: hsl(157, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30\:dark, html.auto .sf-c-txt-mediumspringgreen\:30\:dark { color: hsl(157, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40\:dark, html.auto .sf-c-txt-mediumspringgreen\:40\:dark { color: hsl(157, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50\:dark, html.auto .sf-c-txt-mediumspringgreen\:50\:dark { color: hsl(157, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60\:dark, html.auto .sf-c-txt-mediumspringgreen\:60\:dark { color: hsl(157, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70\:dark, html.auto .sf-c-txt-mediumspringgreen\:70\:dark { color: hsl(157, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80\:dark, html.auto .sf-c-txt-mediumspringgreen\:80\:dark { color: hsl(157, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90\:dark, html.auto .sf-c-txt-mediumspringgreen\:90\:dark { color: hsl(157, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100\:dark, html.auto .sf-c-txt-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:dark { color: hsl(157, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:0\:dark { color: hsl(157, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:10\:dark { color: hsl(157, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:20\:dark { color: hsl(157, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:30\:dark { color: hsl(157, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:40\:dark { color: hsl(157, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:50\:dark { color: hsl(157, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:60\:dark { color: hsl(157, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:70\:dark { color: hsl(157, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:80\:dark { color: hsl(157, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:90\:dark { color: hsl(157, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumturquoise.css b/src/colors/10/mediumturquoise.css index 28cc087..0678065 100644 --- a/src/colors/10/mediumturquoise.css +++ b/src/colors/10/mediumturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumturquoise'] { --sf-c-mediumturquoise: 178 60% 55%; --sf-c-mediumturquoise-0: 178 60% 0%; --sf-c-mediumturquoise-10: 178 60% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumturquoise\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumturquoise\:90\:dark, html.var.auto .sf-c-mediumturquoise\:90\:dark { color: hsl(178, 60%, 90%); background: hsl(178, 60%, 10%) } html.var[data-theme='auto'] .sf-c-mediumturquoise\:100\:dark, html.var.auto .sf-c-mediumturquoise\:100\:dark { color: hsl(178, 60%, 90%); background: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise, html.auto .sf-c-txt-mediumturquoise { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0, html.auto .sf-c-txt-mediumturquoise\:0 { color: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10, html.auto .sf-c-txt-mediumturquoise\:10 { color: hsl(178, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20, html.auto .sf-c-txt-mediumturquoise\:20 { color: hsl(178, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30, html.auto .sf-c-txt-mediumturquoise\:30 { color: hsl(178, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40, html.auto .sf-c-txt-mediumturquoise\:40 { color: hsl(178, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50, html.auto .sf-c-txt-mediumturquoise\:50 { color: hsl(178, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60, html.auto .sf-c-txt-mediumturquoise\:60 { color: hsl(178, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70, html.auto .sf-c-txt-mediumturquoise\:70 { color: hsl(178, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80, html.auto .sf-c-txt-mediumturquoise\:80 { color: hsl(178, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90, html.auto .sf-c-txt-mediumturquoise\:90 { color: hsl(178, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100, html.auto .sf-c-txt-mediumturquoise\:100 { color: hsl(178, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise, html.var.auto .sf-c-txt-mediumturquoise { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0, html.var.auto .sf-c-txt-mediumturquoise\:0 { color: hsl(178, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10, html.var.auto .sf-c-txt-mediumturquoise\:10 { color: hsl(178, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20, html.var.auto .sf-c-txt-mediumturquoise\:20 { color: hsl(178, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30, html.var.auto .sf-c-txt-mediumturquoise\:30 { color: hsl(178, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40, html.var.auto .sf-c-txt-mediumturquoise\:40 { color: hsl(178, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50, html.var.auto .sf-c-txt-mediumturquoise\:50 { color: hsl(178, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60, html.var.auto .sf-c-txt-mediumturquoise\:60 { color: hsl(178, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70, html.var.auto .sf-c-txt-mediumturquoise\:70 { color: hsl(178, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80, html.var.auto .sf-c-txt-mediumturquoise\:80 { color: hsl(178, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90, html.var.auto .sf-c-txt-mediumturquoise\:90 { color: hsl(178, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100, html.var.auto .sf-c-txt-mediumturquoise\:100 { color: hsl(178, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:dark, html.auto .sf-c-txt-mediumturquoise\:dark { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0\:dark, html.auto .sf-c-txt-mediumturquoise\:0\:dark { color: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10\:dark, html.auto .sf-c-txt-mediumturquoise\:10\:dark { color: hsl(178, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20\:dark, html.auto .sf-c-txt-mediumturquoise\:20\:dark { color: hsl(178, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30\:dark, html.auto .sf-c-txt-mediumturquoise\:30\:dark { color: hsl(178, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40\:dark, html.auto .sf-c-txt-mediumturquoise\:40\:dark { color: hsl(178, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50\:dark, html.auto .sf-c-txt-mediumturquoise\:50\:dark { color: hsl(178, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60\:dark, html.auto .sf-c-txt-mediumturquoise\:60\:dark { color: hsl(178, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70\:dark, html.auto .sf-c-txt-mediumturquoise\:70\:dark { color: hsl(178, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80\:dark, html.auto .sf-c-txt-mediumturquoise\:80\:dark { color: hsl(178, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90\:dark, html.auto .sf-c-txt-mediumturquoise\:90\:dark { color: hsl(178, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100\:dark, html.auto .sf-c-txt-mediumturquoise\:100\:dark { color: hsl(178, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:dark, html.var.auto .sf-c-txt-mediumturquoise\:dark { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0\:dark, html.var.auto .sf-c-txt-mediumturquoise\:0\:dark { color: hsl(178, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10\:dark, html.var.auto .sf-c-txt-mediumturquoise\:10\:dark { color: hsl(178, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20\:dark, html.var.auto .sf-c-txt-mediumturquoise\:20\:dark { color: hsl(178, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30\:dark, html.var.auto .sf-c-txt-mediumturquoise\:30\:dark { color: hsl(178, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40\:dark, html.var.auto .sf-c-txt-mediumturquoise\:40\:dark { color: hsl(178, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50\:dark, html.var.auto .sf-c-txt-mediumturquoise\:50\:dark { color: hsl(178, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60\:dark, html.var.auto .sf-c-txt-mediumturquoise\:60\:dark { color: hsl(178, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70\:dark, html.var.auto .sf-c-txt-mediumturquoise\:70\:dark { color: hsl(178, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80\:dark, html.var.auto .sf-c-txt-mediumturquoise\:80\:dark { color: hsl(178, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90\:dark, html.var.auto .sf-c-txt-mediumturquoise\:90\:dark { color: hsl(178, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100\:dark, html.var.auto .sf-c-txt-mediumturquoise\:100\:dark { color: hsl(178, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mediumvioletred.css b/src/colors/10/mediumvioletred.css index fc6e723..49c86b6 100644 --- a/src/colors/10/mediumvioletred.css +++ b/src/colors/10/mediumvioletred.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumvioletred'] { --sf-c-mediumvioletred: 322 81% 43%; --sf-c-mediumvioletred-0: 322 81% 0%; --sf-c-mediumvioletred-10: 322 81% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mediumvioletred\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumvioletred\:90\:dark, html.var.auto .sf-c-mediumvioletred\:90\:dark { color: hsl(322, 81%, 90%); background: hsl(322, 81%, 10%) } html.var[data-theme='auto'] .sf-c-mediumvioletred\:100\:dark, html.var.auto .sf-c-mediumvioletred\:100\:dark { color: hsl(322, 81%, 90%); background: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred, html.auto .sf-c-txt-mediumvioletred { color: hsl(322, 81%, 43%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0, html.auto .sf-c-txt-mediumvioletred\:0 { color: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10, html.auto .sf-c-txt-mediumvioletred\:10 { color: hsl(322, 81%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20, html.auto .sf-c-txt-mediumvioletred\:20 { color: hsl(322, 81%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30, html.auto .sf-c-txt-mediumvioletred\:30 { color: hsl(322, 81%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40, html.auto .sf-c-txt-mediumvioletred\:40 { color: hsl(322, 81%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50, html.auto .sf-c-txt-mediumvioletred\:50 { color: hsl(322, 81%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60, html.auto .sf-c-txt-mediumvioletred\:60 { color: hsl(322, 81%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70, html.auto .sf-c-txt-mediumvioletred\:70 { color: hsl(322, 81%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80, html.auto .sf-c-txt-mediumvioletred\:80 { color: hsl(322, 81%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90, html.auto .sf-c-txt-mediumvioletred\:90 { color: hsl(322, 81%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100, html.auto .sf-c-txt-mediumvioletred\:100 { color: hsl(322, 81%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred, html.var.auto .sf-c-txt-mediumvioletred { color: hsl(322, 81%, 43%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0, html.var.auto .sf-c-txt-mediumvioletred\:0 { color: hsl(322, 81%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10, html.var.auto .sf-c-txt-mediumvioletred\:10 { color: hsl(322, 81%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20, html.var.auto .sf-c-txt-mediumvioletred\:20 { color: hsl(322, 81%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30, html.var.auto .sf-c-txt-mediumvioletred\:30 { color: hsl(322, 81%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40, html.var.auto .sf-c-txt-mediumvioletred\:40 { color: hsl(322, 81%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50, html.var.auto .sf-c-txt-mediumvioletred\:50 { color: hsl(322, 81%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60, html.var.auto .sf-c-txt-mediumvioletred\:60 { color: hsl(322, 81%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70, html.var.auto .sf-c-txt-mediumvioletred\:70 { color: hsl(322, 81%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80, html.var.auto .sf-c-txt-mediumvioletred\:80 { color: hsl(322, 81%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90, html.var.auto .sf-c-txt-mediumvioletred\:90 { color: hsl(322, 81%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100, html.var.auto .sf-c-txt-mediumvioletred\:100 { color: hsl(322, 81%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:dark, html.auto .sf-c-txt-mediumvioletred\:dark { color: hsl(322, 81%, 43%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0\:dark, html.auto .sf-c-txt-mediumvioletred\:0\:dark { color: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10\:dark, html.auto .sf-c-txt-mediumvioletred\:10\:dark { color: hsl(322, 81%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20\:dark, html.auto .sf-c-txt-mediumvioletred\:20\:dark { color: hsl(322, 81%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30\:dark, html.auto .sf-c-txt-mediumvioletred\:30\:dark { color: hsl(322, 81%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40\:dark, html.auto .sf-c-txt-mediumvioletred\:40\:dark { color: hsl(322, 81%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50\:dark, html.auto .sf-c-txt-mediumvioletred\:50\:dark { color: hsl(322, 81%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60\:dark, html.auto .sf-c-txt-mediumvioletred\:60\:dark { color: hsl(322, 81%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70\:dark, html.auto .sf-c-txt-mediumvioletred\:70\:dark { color: hsl(322, 81%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80\:dark, html.auto .sf-c-txt-mediumvioletred\:80\:dark { color: hsl(322, 81%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90\:dark, html.auto .sf-c-txt-mediumvioletred\:90\:dark { color: hsl(322, 81%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100\:dark, html.auto .sf-c-txt-mediumvioletred\:100\:dark { color: hsl(322, 81%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:dark, html.var.auto .sf-c-txt-mediumvioletred\:dark { color: hsl(322, 81%, 43%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0\:dark, html.var.auto .sf-c-txt-mediumvioletred\:0\:dark { color: hsl(322, 81%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10\:dark, html.var.auto .sf-c-txt-mediumvioletred\:10\:dark { color: hsl(322, 81%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20\:dark, html.var.auto .sf-c-txt-mediumvioletred\:20\:dark { color: hsl(322, 81%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30\:dark, html.var.auto .sf-c-txt-mediumvioletred\:30\:dark { color: hsl(322, 81%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40\:dark, html.var.auto .sf-c-txt-mediumvioletred\:40\:dark { color: hsl(322, 81%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50\:dark, html.var.auto .sf-c-txt-mediumvioletred\:50\:dark { color: hsl(322, 81%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60\:dark, html.var.auto .sf-c-txt-mediumvioletred\:60\:dark { color: hsl(322, 81%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70\:dark, html.var.auto .sf-c-txt-mediumvioletred\:70\:dark { color: hsl(322, 81%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80\:dark, html.var.auto .sf-c-txt-mediumvioletred\:80\:dark { color: hsl(322, 81%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90\:dark, html.var.auto .sf-c-txt-mediumvioletred\:90\:dark { color: hsl(322, 81%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100\:dark, html.var.auto .sf-c-txt-mediumvioletred\:100\:dark { color: hsl(322, 81%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/midnightblue.css b/src/colors/10/midnightblue.css index 822f161..9d73be2 100644 --- a/src/colors/10/midnightblue.css +++ b/src/colors/10/midnightblue.css @@ -1,4 +1,4 @@ -:root { +[class*='midnightblue'] { --sf-c-midnightblue: 240 64% 27%; --sf-c-midnightblue-0: 240 64% 0%; --sf-c-midnightblue-10: 240 64% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-midnightblue\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-midnightblue\:90\:dark, html.var.auto .sf-c-midnightblue\:90\:dark { color: hsl(240, 64%, 90%); background: hsl(240, 64%, 10%) } html.var[data-theme='auto'] .sf-c-midnightblue\:100\:dark, html.var.auto .sf-c-midnightblue\:100\:dark { color: hsl(240, 64%, 90%); background: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue, html.auto .sf-c-txt-midnightblue { color: hsl(240, 64%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0, html.auto .sf-c-txt-midnightblue\:0 { color: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10, html.auto .sf-c-txt-midnightblue\:10 { color: hsl(240, 64%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20, html.auto .sf-c-txt-midnightblue\:20 { color: hsl(240, 64%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30, html.auto .sf-c-txt-midnightblue\:30 { color: hsl(240, 64%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40, html.auto .sf-c-txt-midnightblue\:40 { color: hsl(240, 64%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50, html.auto .sf-c-txt-midnightblue\:50 { color: hsl(240, 64%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60, html.auto .sf-c-txt-midnightblue\:60 { color: hsl(240, 64%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70, html.auto .sf-c-txt-midnightblue\:70 { color: hsl(240, 64%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80, html.auto .sf-c-txt-midnightblue\:80 { color: hsl(240, 64%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90, html.auto .sf-c-txt-midnightblue\:90 { color: hsl(240, 64%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100, html.auto .sf-c-txt-midnightblue\:100 { color: hsl(240, 64%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue, html.var.auto .sf-c-txt-midnightblue { color: hsl(240, 64%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0, html.var.auto .sf-c-txt-midnightblue\:0 { color: hsl(240, 64%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10, html.var.auto .sf-c-txt-midnightblue\:10 { color: hsl(240, 64%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20, html.var.auto .sf-c-txt-midnightblue\:20 { color: hsl(240, 64%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30, html.var.auto .sf-c-txt-midnightblue\:30 { color: hsl(240, 64%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40, html.var.auto .sf-c-txt-midnightblue\:40 { color: hsl(240, 64%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50, html.var.auto .sf-c-txt-midnightblue\:50 { color: hsl(240, 64%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60, html.var.auto .sf-c-txt-midnightblue\:60 { color: hsl(240, 64%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70, html.var.auto .sf-c-txt-midnightblue\:70 { color: hsl(240, 64%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80, html.var.auto .sf-c-txt-midnightblue\:80 { color: hsl(240, 64%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90, html.var.auto .sf-c-txt-midnightblue\:90 { color: hsl(240, 64%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100, html.var.auto .sf-c-txt-midnightblue\:100 { color: hsl(240, 64%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:dark, html.auto .sf-c-txt-midnightblue\:dark { color: hsl(240, 64%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0\:dark, html.auto .sf-c-txt-midnightblue\:0\:dark { color: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10\:dark, html.auto .sf-c-txt-midnightblue\:10\:dark { color: hsl(240, 64%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20\:dark, html.auto .sf-c-txt-midnightblue\:20\:dark { color: hsl(240, 64%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30\:dark, html.auto .sf-c-txt-midnightblue\:30\:dark { color: hsl(240, 64%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40\:dark, html.auto .sf-c-txt-midnightblue\:40\:dark { color: hsl(240, 64%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50\:dark, html.auto .sf-c-txt-midnightblue\:50\:dark { color: hsl(240, 64%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60\:dark, html.auto .sf-c-txt-midnightblue\:60\:dark { color: hsl(240, 64%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70\:dark, html.auto .sf-c-txt-midnightblue\:70\:dark { color: hsl(240, 64%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80\:dark, html.auto .sf-c-txt-midnightblue\:80\:dark { color: hsl(240, 64%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90\:dark, html.auto .sf-c-txt-midnightblue\:90\:dark { color: hsl(240, 64%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100\:dark, html.auto .sf-c-txt-midnightblue\:100\:dark { color: hsl(240, 64%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:dark, html.var.auto .sf-c-txt-midnightblue\:dark { color: hsl(240, 64%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0\:dark, html.var.auto .sf-c-txt-midnightblue\:0\:dark { color: hsl(240, 64%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10\:dark, html.var.auto .sf-c-txt-midnightblue\:10\:dark { color: hsl(240, 64%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20\:dark, html.var.auto .sf-c-txt-midnightblue\:20\:dark { color: hsl(240, 64%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30\:dark, html.var.auto .sf-c-txt-midnightblue\:30\:dark { color: hsl(240, 64%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40\:dark, html.var.auto .sf-c-txt-midnightblue\:40\:dark { color: hsl(240, 64%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50\:dark, html.var.auto .sf-c-txt-midnightblue\:50\:dark { color: hsl(240, 64%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60\:dark, html.var.auto .sf-c-txt-midnightblue\:60\:dark { color: hsl(240, 64%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70\:dark, html.var.auto .sf-c-txt-midnightblue\:70\:dark { color: hsl(240, 64%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80\:dark, html.var.auto .sf-c-txt-midnightblue\:80\:dark { color: hsl(240, 64%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90\:dark, html.var.auto .sf-c-txt-midnightblue\:90\:dark { color: hsl(240, 64%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100\:dark, html.var.auto .sf-c-txt-midnightblue\:100\:dark { color: hsl(240, 64%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mintcream.css b/src/colors/10/mintcream.css index 908e1b9..7fbd4e1 100644 --- a/src/colors/10/mintcream.css +++ b/src/colors/10/mintcream.css @@ -1,4 +1,4 @@ -:root { +[class*='mintcream'] { --sf-c-mintcream: 150 100% 98%; --sf-c-mintcream-0: 150 100% 0%; --sf-c-mintcream-10: 150 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mintcream\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-mintcream\:90\:dark, html.var.auto .sf-c-mintcream\:90\:dark { color: hsl(150, 100%, 90%); background: hsl(150, 100%, 10%) } html.var[data-theme='auto'] .sf-c-mintcream\:100\:dark, html.var.auto .sf-c-mintcream\:100\:dark { color: hsl(150, 100%, 90%); background: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream, html.auto .sf-c-txt-mintcream { color: hsl(150, 100%, 98%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:0, html.auto .sf-c-txt-mintcream\:0 { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:10, html.auto .sf-c-txt-mintcream\:10 { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:20, html.auto .sf-c-txt-mintcream\:20 { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:30, html.auto .sf-c-txt-mintcream\:30 { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:40, html.auto .sf-c-txt-mintcream\:40 { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:50, html.auto .sf-c-txt-mintcream\:50 { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:60, html.auto .sf-c-txt-mintcream\:60 { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:70, html.auto .sf-c-txt-mintcream\:70 { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:80, html.auto .sf-c-txt-mintcream\:80 { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:90, html.auto .sf-c-txt-mintcream\:90 { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:100, html.auto .sf-c-txt-mintcream\:100 { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream, html.var.auto .sf-c-txt-mintcream { color: hsl(150, 100%, 98%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:0, html.var.auto .sf-c-txt-mintcream\:0 { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:10, html.var.auto .sf-c-txt-mintcream\:10 { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:20, html.var.auto .sf-c-txt-mintcream\:20 { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:30, html.var.auto .sf-c-txt-mintcream\:30 { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:40, html.var.auto .sf-c-txt-mintcream\:40 { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:50, html.var.auto .sf-c-txt-mintcream\:50 { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:60, html.var.auto .sf-c-txt-mintcream\:60 { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:70, html.var.auto .sf-c-txt-mintcream\:70 { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:80, html.var.auto .sf-c-txt-mintcream\:80 { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:90, html.var.auto .sf-c-txt-mintcream\:90 { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:100, html.var.auto .sf-c-txt-mintcream\:100 { color: hsl(150, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:dark, html.auto .sf-c-txt-mintcream\:dark { color: hsl(150, 100%, 98%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:0\:dark, html.auto .sf-c-txt-mintcream\:0\:dark { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:10\:dark, html.auto .sf-c-txt-mintcream\:10\:dark { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:20\:dark, html.auto .sf-c-txt-mintcream\:20\:dark { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:30\:dark, html.auto .sf-c-txt-mintcream\:30\:dark { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:40\:dark, html.auto .sf-c-txt-mintcream\:40\:dark { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:50\:dark, html.auto .sf-c-txt-mintcream\:50\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:60\:dark, html.auto .sf-c-txt-mintcream\:60\:dark { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:70\:dark, html.auto .sf-c-txt-mintcream\:70\:dark { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:80\:dark, html.auto .sf-c-txt-mintcream\:80\:dark { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:90\:dark, html.auto .sf-c-txt-mintcream\:90\:dark { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:100\:dark, html.auto .sf-c-txt-mintcream\:100\:dark { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:dark, html.var.auto .sf-c-txt-mintcream\:dark { color: hsl(150, 100%, 98%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:0\:dark, html.var.auto .sf-c-txt-mintcream\:0\:dark { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:10\:dark, html.var.auto .sf-c-txt-mintcream\:10\:dark { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:20\:dark, html.var.auto .sf-c-txt-mintcream\:20\:dark { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:30\:dark, html.var.auto .sf-c-txt-mintcream\:30\:dark { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:40\:dark, html.var.auto .sf-c-txt-mintcream\:40\:dark { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:50\:dark, html.var.auto .sf-c-txt-mintcream\:50\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:60\:dark, html.var.auto .sf-c-txt-mintcream\:60\:dark { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:70\:dark, html.var.auto .sf-c-txt-mintcream\:70\:dark { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:80\:dark, html.var.auto .sf-c-txt-mintcream\:80\:dark { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:90\:dark, html.var.auto .sf-c-txt-mintcream\:90\:dark { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:100\:dark, html.var.auto .sf-c-txt-mintcream\:100\:dark { color: hsl(150, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/mistyrose.css b/src/colors/10/mistyrose.css index a4a190f..10854e3 100644 --- a/src/colors/10/mistyrose.css +++ b/src/colors/10/mistyrose.css @@ -1,4 +1,4 @@ -:root { +[class*='mistyrose'] { --sf-c-mistyrose: 6 100% 94%; --sf-c-mistyrose-0: 6 100% 0%; --sf-c-mistyrose-10: 6 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-mistyrose\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-mistyrose\:90\:dark, html.var.auto .sf-c-mistyrose\:90\:dark { color: hsl(6, 100%, 90%); background: hsl(6, 100%, 10%) } html.var[data-theme='auto'] .sf-c-mistyrose\:100\:dark, html.var.auto .sf-c-mistyrose\:100\:dark { color: hsl(6, 100%, 90%); background: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose, html.auto .sf-c-txt-mistyrose { color: hsl(6, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0, html.auto .sf-c-txt-mistyrose\:0 { color: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10, html.auto .sf-c-txt-mistyrose\:10 { color: hsl(6, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20, html.auto .sf-c-txt-mistyrose\:20 { color: hsl(6, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30, html.auto .sf-c-txt-mistyrose\:30 { color: hsl(6, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40, html.auto .sf-c-txt-mistyrose\:40 { color: hsl(6, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50, html.auto .sf-c-txt-mistyrose\:50 { color: hsl(6, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60, html.auto .sf-c-txt-mistyrose\:60 { color: hsl(6, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70, html.auto .sf-c-txt-mistyrose\:70 { color: hsl(6, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80, html.auto .sf-c-txt-mistyrose\:80 { color: hsl(6, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90, html.auto .sf-c-txt-mistyrose\:90 { color: hsl(6, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100, html.auto .sf-c-txt-mistyrose\:100 { color: hsl(6, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose, html.var.auto .sf-c-txt-mistyrose { color: hsl(6, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0, html.var.auto .sf-c-txt-mistyrose\:0 { color: hsl(6, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10, html.var.auto .sf-c-txt-mistyrose\:10 { color: hsl(6, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20, html.var.auto .sf-c-txt-mistyrose\:20 { color: hsl(6, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30, html.var.auto .sf-c-txt-mistyrose\:30 { color: hsl(6, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40, html.var.auto .sf-c-txt-mistyrose\:40 { color: hsl(6, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50, html.var.auto .sf-c-txt-mistyrose\:50 { color: hsl(6, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60, html.var.auto .sf-c-txt-mistyrose\:60 { color: hsl(6, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70, html.var.auto .sf-c-txt-mistyrose\:70 { color: hsl(6, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80, html.var.auto .sf-c-txt-mistyrose\:80 { color: hsl(6, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90, html.var.auto .sf-c-txt-mistyrose\:90 { color: hsl(6, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100, html.var.auto .sf-c-txt-mistyrose\:100 { color: hsl(6, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:dark, html.auto .sf-c-txt-mistyrose\:dark { color: hsl(6, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0\:dark, html.auto .sf-c-txt-mistyrose\:0\:dark { color: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10\:dark, html.auto .sf-c-txt-mistyrose\:10\:dark { color: hsl(6, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20\:dark, html.auto .sf-c-txt-mistyrose\:20\:dark { color: hsl(6, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30\:dark, html.auto .sf-c-txt-mistyrose\:30\:dark { color: hsl(6, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40\:dark, html.auto .sf-c-txt-mistyrose\:40\:dark { color: hsl(6, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50\:dark, html.auto .sf-c-txt-mistyrose\:50\:dark { color: hsl(6, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60\:dark, html.auto .sf-c-txt-mistyrose\:60\:dark { color: hsl(6, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70\:dark, html.auto .sf-c-txt-mistyrose\:70\:dark { color: hsl(6, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80\:dark, html.auto .sf-c-txt-mistyrose\:80\:dark { color: hsl(6, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90\:dark, html.auto .sf-c-txt-mistyrose\:90\:dark { color: hsl(6, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100\:dark, html.auto .sf-c-txt-mistyrose\:100\:dark { color: hsl(6, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:dark, html.var.auto .sf-c-txt-mistyrose\:dark { color: hsl(6, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0\:dark, html.var.auto .sf-c-txt-mistyrose\:0\:dark { color: hsl(6, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10\:dark, html.var.auto .sf-c-txt-mistyrose\:10\:dark { color: hsl(6, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20\:dark, html.var.auto .sf-c-txt-mistyrose\:20\:dark { color: hsl(6, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30\:dark, html.var.auto .sf-c-txt-mistyrose\:30\:dark { color: hsl(6, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40\:dark, html.var.auto .sf-c-txt-mistyrose\:40\:dark { color: hsl(6, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50\:dark, html.var.auto .sf-c-txt-mistyrose\:50\:dark { color: hsl(6, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60\:dark, html.var.auto .sf-c-txt-mistyrose\:60\:dark { color: hsl(6, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70\:dark, html.var.auto .sf-c-txt-mistyrose\:70\:dark { color: hsl(6, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80\:dark, html.var.auto .sf-c-txt-mistyrose\:80\:dark { color: hsl(6, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90\:dark, html.var.auto .sf-c-txt-mistyrose\:90\:dark { color: hsl(6, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100\:dark, html.var.auto .sf-c-txt-mistyrose\:100\:dark { color: hsl(6, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/moccasin.css b/src/colors/10/moccasin.css index 1275f40..dd9c95d 100644 --- a/src/colors/10/moccasin.css +++ b/src/colors/10/moccasin.css @@ -1,4 +1,4 @@ -:root { +[class*='moccasin'] { --sf-c-moccasin: 38 100% 85%; --sf-c-moccasin-0: 38 100% 0%; --sf-c-moccasin-10: 38 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-moccasin\:100\:dark, html.dark .sf-c-txt-m html.var[data-theme='auto'] .sf-c-moccasin\:90\:dark, html.var.auto .sf-c-moccasin\:90\:dark { color: hsl(38, 100%, 90%); background: hsl(38, 100%, 10%) } html.var[data-theme='auto'] .sf-c-moccasin\:100\:dark, html.var.auto .sf-c-moccasin\:100\:dark { color: hsl(38, 100%, 90%); background: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin, html.auto .sf-c-txt-moccasin { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:0, html.auto .sf-c-txt-moccasin\:0 { color: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:10, html.auto .sf-c-txt-moccasin\:10 { color: hsl(38, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:20, html.auto .sf-c-txt-moccasin\:20 { color: hsl(38, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:30, html.auto .sf-c-txt-moccasin\:30 { color: hsl(38, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:40, html.auto .sf-c-txt-moccasin\:40 { color: hsl(38, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:50, html.auto .sf-c-txt-moccasin\:50 { color: hsl(38, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:60, html.auto .sf-c-txt-moccasin\:60 { color: hsl(38, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:70, html.auto .sf-c-txt-moccasin\:70 { color: hsl(38, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:80, html.auto .sf-c-txt-moccasin\:80 { color: hsl(38, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:90, html.auto .sf-c-txt-moccasin\:90 { color: hsl(38, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:100, html.auto .sf-c-txt-moccasin\:100 { color: hsl(38, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin, html.var.auto .sf-c-txt-moccasin { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:0, html.var.auto .sf-c-txt-moccasin\:0 { color: hsl(38, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:10, html.var.auto .sf-c-txt-moccasin\:10 { color: hsl(38, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:20, html.var.auto .sf-c-txt-moccasin\:20 { color: hsl(38, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:30, html.var.auto .sf-c-txt-moccasin\:30 { color: hsl(38, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:40, html.var.auto .sf-c-txt-moccasin\:40 { color: hsl(38, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:50, html.var.auto .sf-c-txt-moccasin\:50 { color: hsl(38, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:60, html.var.auto .sf-c-txt-moccasin\:60 { color: hsl(38, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:70, html.var.auto .sf-c-txt-moccasin\:70 { color: hsl(38, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:80, html.var.auto .sf-c-txt-moccasin\:80 { color: hsl(38, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:90, html.var.auto .sf-c-txt-moccasin\:90 { color: hsl(38, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:100, html.var.auto .sf-c-txt-moccasin\:100 { color: hsl(38, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:dark, html.auto .sf-c-txt-moccasin\:dark { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:0\:dark, html.auto .sf-c-txt-moccasin\:0\:dark { color: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:10\:dark, html.auto .sf-c-txt-moccasin\:10\:dark { color: hsl(38, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:20\:dark, html.auto .sf-c-txt-moccasin\:20\:dark { color: hsl(38, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:30\:dark, html.auto .sf-c-txt-moccasin\:30\:dark { color: hsl(38, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:40\:dark, html.auto .sf-c-txt-moccasin\:40\:dark { color: hsl(38, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:50\:dark, html.auto .sf-c-txt-moccasin\:50\:dark { color: hsl(38, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:60\:dark, html.auto .sf-c-txt-moccasin\:60\:dark { color: hsl(38, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:70\:dark, html.auto .sf-c-txt-moccasin\:70\:dark { color: hsl(38, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:80\:dark, html.auto .sf-c-txt-moccasin\:80\:dark { color: hsl(38, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:90\:dark, html.auto .sf-c-txt-moccasin\:90\:dark { color: hsl(38, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:100\:dark, html.auto .sf-c-txt-moccasin\:100\:dark { color: hsl(38, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:dark, html.var.auto .sf-c-txt-moccasin\:dark { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:0\:dark, html.var.auto .sf-c-txt-moccasin\:0\:dark { color: hsl(38, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:10\:dark, html.var.auto .sf-c-txt-moccasin\:10\:dark { color: hsl(38, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:20\:dark, html.var.auto .sf-c-txt-moccasin\:20\:dark { color: hsl(38, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:30\:dark, html.var.auto .sf-c-txt-moccasin\:30\:dark { color: hsl(38, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:40\:dark, html.var.auto .sf-c-txt-moccasin\:40\:dark { color: hsl(38, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:50\:dark, html.var.auto .sf-c-txt-moccasin\:50\:dark { color: hsl(38, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:60\:dark, html.var.auto .sf-c-txt-moccasin\:60\:dark { color: hsl(38, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:70\:dark, html.var.auto .sf-c-txt-moccasin\:70\:dark { color: hsl(38, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:80\:dark, html.var.auto .sf-c-txt-moccasin\:80\:dark { color: hsl(38, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:90\:dark, html.var.auto .sf-c-txt-moccasin\:90\:dark { color: hsl(38, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:100\:dark, html.var.auto .sf-c-txt-moccasin\:100\:dark { color: hsl(38, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/navajowhite.css b/src/colors/10/navajowhite.css index af2ef2a..4f4eeb1 100644 --- a/src/colors/10/navajowhite.css +++ b/src/colors/10/navajowhite.css @@ -1,4 +1,4 @@ -:root { +[class*='navajowhite'] { --sf-c-navajowhite: 36 100% 84%; --sf-c-navajowhite-0: 36 100% 0%; --sf-c-navajowhite-10: 36 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-navajowhite\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-navajowhite\:90\:dark, html.var.auto .sf-c-navajowhite\:90\:dark { color: hsl(36, 100%, 90%); background: hsl(36, 100%, 10%) } html.var[data-theme='auto'] .sf-c-navajowhite\:100\:dark, html.var.auto .sf-c-navajowhite\:100\:dark { color: hsl(36, 100%, 90%); background: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite, html.auto .sf-c-txt-navajowhite { color: hsl(36, 100%, 84%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0, html.auto .sf-c-txt-navajowhite\:0 { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10, html.auto .sf-c-txt-navajowhite\:10 { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20, html.auto .sf-c-txt-navajowhite\:20 { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30, html.auto .sf-c-txt-navajowhite\:30 { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40, html.auto .sf-c-txt-navajowhite\:40 { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50, html.auto .sf-c-txt-navajowhite\:50 { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60, html.auto .sf-c-txt-navajowhite\:60 { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70, html.auto .sf-c-txt-navajowhite\:70 { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80, html.auto .sf-c-txt-navajowhite\:80 { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90, html.auto .sf-c-txt-navajowhite\:90 { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100, html.auto .sf-c-txt-navajowhite\:100 { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite, html.var.auto .sf-c-txt-navajowhite { color: hsl(36, 100%, 84%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0, html.var.auto .sf-c-txt-navajowhite\:0 { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10, html.var.auto .sf-c-txt-navajowhite\:10 { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20, html.var.auto .sf-c-txt-navajowhite\:20 { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30, html.var.auto .sf-c-txt-navajowhite\:30 { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40, html.var.auto .sf-c-txt-navajowhite\:40 { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50, html.var.auto .sf-c-txt-navajowhite\:50 { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60, html.var.auto .sf-c-txt-navajowhite\:60 { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70, html.var.auto .sf-c-txt-navajowhite\:70 { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80, html.var.auto .sf-c-txt-navajowhite\:80 { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90, html.var.auto .sf-c-txt-navajowhite\:90 { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100, html.var.auto .sf-c-txt-navajowhite\:100 { color: hsl(36, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:dark, html.auto .sf-c-txt-navajowhite\:dark { color: hsl(36, 100%, 84%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0\:dark, html.auto .sf-c-txt-navajowhite\:0\:dark { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10\:dark, html.auto .sf-c-txt-navajowhite\:10\:dark { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20\:dark, html.auto .sf-c-txt-navajowhite\:20\:dark { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30\:dark, html.auto .sf-c-txt-navajowhite\:30\:dark { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40\:dark, html.auto .sf-c-txt-navajowhite\:40\:dark { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50\:dark, html.auto .sf-c-txt-navajowhite\:50\:dark { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60\:dark, html.auto .sf-c-txt-navajowhite\:60\:dark { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70\:dark, html.auto .sf-c-txt-navajowhite\:70\:dark { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80\:dark, html.auto .sf-c-txt-navajowhite\:80\:dark { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90\:dark, html.auto .sf-c-txt-navajowhite\:90\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100\:dark, html.auto .sf-c-txt-navajowhite\:100\:dark { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:dark, html.var.auto .sf-c-txt-navajowhite\:dark { color: hsl(36, 100%, 84%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0\:dark, html.var.auto .sf-c-txt-navajowhite\:0\:dark { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10\:dark, html.var.auto .sf-c-txt-navajowhite\:10\:dark { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20\:dark, html.var.auto .sf-c-txt-navajowhite\:20\:dark { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30\:dark, html.var.auto .sf-c-txt-navajowhite\:30\:dark { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40\:dark, html.var.auto .sf-c-txt-navajowhite\:40\:dark { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50\:dark, html.var.auto .sf-c-txt-navajowhite\:50\:dark { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60\:dark, html.var.auto .sf-c-txt-navajowhite\:60\:dark { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70\:dark, html.var.auto .sf-c-txt-navajowhite\:70\:dark { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80\:dark, html.var.auto .sf-c-txt-navajowhite\:80\:dark { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90\:dark, html.var.auto .sf-c-txt-navajowhite\:90\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100\:dark, html.var.auto .sf-c-txt-navajowhite\:100\:dark { color: hsl(36, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/navy.css b/src/colors/10/navy.css index 285fd4a..037342b 100644 --- a/src/colors/10/navy.css +++ b/src/colors/10/navy.css @@ -1,4 +1,4 @@ -:root { +[class*='navy'] { --sf-c-navy: 240 100% 25%; --sf-c-navy-0: 240 100% 0%; --sf-c-navy-10: 240 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-navy\:100\:dark, html.dark .sf-c-txt-navy\ html.var[data-theme='auto'] .sf-c-navy\:90\:dark, html.var.auto .sf-c-navy\:90\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 10%) } html.var[data-theme='auto'] .sf-c-navy\:100\:dark, html.var.auto .sf-c-navy\:100\:dark { color: hsl(240, 100%, 90%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy, html.auto .sf-c-txt-navy { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:0, html.auto .sf-c-txt-navy\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:10, html.auto .sf-c-txt-navy\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:20, html.auto .sf-c-txt-navy\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:30, html.auto .sf-c-txt-navy\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:40, html.auto .sf-c-txt-navy\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:50, html.auto .sf-c-txt-navy\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:60, html.auto .sf-c-txt-navy\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:70, html.auto .sf-c-txt-navy\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:80, html.auto .sf-c-txt-navy\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:90, html.auto .sf-c-txt-navy\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:100, html.auto .sf-c-txt-navy\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navy, html.var.auto .sf-c-txt-navy { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:0, html.var.auto .sf-c-txt-navy\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:10, html.var.auto .sf-c-txt-navy\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:20, html.var.auto .sf-c-txt-navy\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:30, html.var.auto .sf-c-txt-navy\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:40, html.var.auto .sf-c-txt-navy\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:50, html.var.auto .sf-c-txt-navy\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:60, html.var.auto .sf-c-txt-navy\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:70, html.var.auto .sf-c-txt-navy\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:80, html.var.auto .sf-c-txt-navy\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:90, html.var.auto .sf-c-txt-navy\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:100, html.var.auto .sf-c-txt-navy\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:dark, html.auto .sf-c-txt-navy\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark, html.auto .sf-c-txt-navy\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark, html.auto .sf-c-txt-navy\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark, html.auto .sf-c-txt-navy\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark, html.auto .sf-c-txt-navy\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark, html.auto .sf-c-txt-navy\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark, html.auto .sf-c-txt-navy\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark, html.auto .sf-c-txt-navy\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark, html.auto .sf-c-txt-navy\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark, html.auto .sf-c-txt-navy\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark, html.auto .sf-c-txt-navy\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark, html.auto .sf-c-txt-navy\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:dark, html.var.auto .sf-c-txt-navy\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark, html.var.auto .sf-c-txt-navy\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark, html.var.auto .sf-c-txt-navy\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark, html.var.auto .sf-c-txt-navy\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark, html.var.auto .sf-c-txt-navy\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark, html.var.auto .sf-c-txt-navy\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark, html.var.auto .sf-c-txt-navy\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark, html.var.auto .sf-c-txt-navy\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark, html.var.auto .sf-c-txt-navy\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark, html.var.auto .sf-c-txt-navy\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark, html.var.auto .sf-c-txt-navy\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark, html.var.auto .sf-c-txt-navy\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/oldlace.css b/src/colors/10/oldlace.css index 83ae9e1..b2c9c00 100644 --- a/src/colors/10/oldlace.css +++ b/src/colors/10/oldlace.css @@ -1,4 +1,4 @@ -:root { +[class*='oldlace'] { --sf-c-oldlace: 39 85% 95%; --sf-c-oldlace-0: 39 85% 0%; --sf-c-oldlace-10: 39 85% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-oldlace\:100\:dark, html.dark .sf-c-txt-ol html.var[data-theme='auto'] .sf-c-oldlace\:90\:dark, html.var.auto .sf-c-oldlace\:90\:dark { color: hsl(39, 85%, 90%); background: hsl(39, 85%, 10%) } html.var[data-theme='auto'] .sf-c-oldlace\:100\:dark, html.var.auto .sf-c-oldlace\:100\:dark { color: hsl(39, 85%, 90%); background: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace, html.auto .sf-c-txt-oldlace { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:0, html.auto .sf-c-txt-oldlace\:0 { color: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:10, html.auto .sf-c-txt-oldlace\:10 { color: hsl(39, 85%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:20, html.auto .sf-c-txt-oldlace\:20 { color: hsl(39, 85%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:30, html.auto .sf-c-txt-oldlace\:30 { color: hsl(39, 85%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:40, html.auto .sf-c-txt-oldlace\:40 { color: hsl(39, 85%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:50, html.auto .sf-c-txt-oldlace\:50 { color: hsl(39, 85%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:60, html.auto .sf-c-txt-oldlace\:60 { color: hsl(39, 85%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:70, html.auto .sf-c-txt-oldlace\:70 { color: hsl(39, 85%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:80, html.auto .sf-c-txt-oldlace\:80 { color: hsl(39, 85%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:90, html.auto .sf-c-txt-oldlace\:90 { color: hsl(39, 85%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:100, html.auto .sf-c-txt-oldlace\:100 { color: hsl(39, 85%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace, html.var.auto .sf-c-txt-oldlace { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:0, html.var.auto .sf-c-txt-oldlace\:0 { color: hsl(39, 85%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:10, html.var.auto .sf-c-txt-oldlace\:10 { color: hsl(39, 85%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:20, html.var.auto .sf-c-txt-oldlace\:20 { color: hsl(39, 85%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:30, html.var.auto .sf-c-txt-oldlace\:30 { color: hsl(39, 85%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:40, html.var.auto .sf-c-txt-oldlace\:40 { color: hsl(39, 85%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:50, html.var.auto .sf-c-txt-oldlace\:50 { color: hsl(39, 85%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:60, html.var.auto .sf-c-txt-oldlace\:60 { color: hsl(39, 85%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:70, html.var.auto .sf-c-txt-oldlace\:70 { color: hsl(39, 85%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:80, html.var.auto .sf-c-txt-oldlace\:80 { color: hsl(39, 85%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:90, html.var.auto .sf-c-txt-oldlace\:90 { color: hsl(39, 85%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:100, html.var.auto .sf-c-txt-oldlace\:100 { color: hsl(39, 85%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:dark, html.auto .sf-c-txt-oldlace\:dark { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:0\:dark, html.auto .sf-c-txt-oldlace\:0\:dark { color: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:10\:dark, html.auto .sf-c-txt-oldlace\:10\:dark { color: hsl(39, 85%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:20\:dark, html.auto .sf-c-txt-oldlace\:20\:dark { color: hsl(39, 85%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:30\:dark, html.auto .sf-c-txt-oldlace\:30\:dark { color: hsl(39, 85%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:40\:dark, html.auto .sf-c-txt-oldlace\:40\:dark { color: hsl(39, 85%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:50\:dark, html.auto .sf-c-txt-oldlace\:50\:dark { color: hsl(39, 85%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:60\:dark, html.auto .sf-c-txt-oldlace\:60\:dark { color: hsl(39, 85%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:70\:dark, html.auto .sf-c-txt-oldlace\:70\:dark { color: hsl(39, 85%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:80\:dark, html.auto .sf-c-txt-oldlace\:80\:dark { color: hsl(39, 85%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:90\:dark, html.auto .sf-c-txt-oldlace\:90\:dark { color: hsl(39, 85%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:100\:dark, html.auto .sf-c-txt-oldlace\:100\:dark { color: hsl(39, 85%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:dark, html.var.auto .sf-c-txt-oldlace\:dark { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:0\:dark, html.var.auto .sf-c-txt-oldlace\:0\:dark { color: hsl(39, 85%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:10\:dark, html.var.auto .sf-c-txt-oldlace\:10\:dark { color: hsl(39, 85%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:20\:dark, html.var.auto .sf-c-txt-oldlace\:20\:dark { color: hsl(39, 85%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:30\:dark, html.var.auto .sf-c-txt-oldlace\:30\:dark { color: hsl(39, 85%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:40\:dark, html.var.auto .sf-c-txt-oldlace\:40\:dark { color: hsl(39, 85%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:50\:dark, html.var.auto .sf-c-txt-oldlace\:50\:dark { color: hsl(39, 85%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:60\:dark, html.var.auto .sf-c-txt-oldlace\:60\:dark { color: hsl(39, 85%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:70\:dark, html.var.auto .sf-c-txt-oldlace\:70\:dark { color: hsl(39, 85%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:80\:dark, html.var.auto .sf-c-txt-oldlace\:80\:dark { color: hsl(39, 85%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:90\:dark, html.var.auto .sf-c-txt-oldlace\:90\:dark { color: hsl(39, 85%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:100\:dark, html.var.auto .sf-c-txt-oldlace\:100\:dark { color: hsl(39, 85%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/olive.css b/src/colors/10/olive.css index caeac3b..ffd832b 100644 --- a/src/colors/10/olive.css +++ b/src/colors/10/olive.css @@ -1,4 +1,4 @@ -:root { +[class*='olive'] { --sf-c-olive: 60 100% 25%; --sf-c-olive-0: 60 100% 0%; --sf-c-olive-10: 60 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-olive\:100\:dark, html.dark .sf-c-txt-oliv html.var[data-theme='auto'] .sf-c-olive\:90\:dark, html.var.auto .sf-c-olive\:90\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 10%) } html.var[data-theme='auto'] .sf-c-olive\:100\:dark, html.var.auto .sf-c-olive\:100\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive, html.auto .sf-c-txt-olive { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:0, html.auto .sf-c-txt-olive\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:10, html.auto .sf-c-txt-olive\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:20, html.auto .sf-c-txt-olive\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:30, html.auto .sf-c-txt-olive\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:40, html.auto .sf-c-txt-olive\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:50, html.auto .sf-c-txt-olive\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:60, html.auto .sf-c-txt-olive\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:70, html.auto .sf-c-txt-olive\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:80, html.auto .sf-c-txt-olive\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:90, html.auto .sf-c-txt-olive\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:100, html.auto .sf-c-txt-olive\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olive, html.var.auto .sf-c-txt-olive { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:0, html.var.auto .sf-c-txt-olive\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:10, html.var.auto .sf-c-txt-olive\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:20, html.var.auto .sf-c-txt-olive\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:30, html.var.auto .sf-c-txt-olive\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:40, html.var.auto .sf-c-txt-olive\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:50, html.var.auto .sf-c-txt-olive\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:60, html.var.auto .sf-c-txt-olive\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:70, html.var.auto .sf-c-txt-olive\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:80, html.var.auto .sf-c-txt-olive\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:90, html.var.auto .sf-c-txt-olive\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:100, html.var.auto .sf-c-txt-olive\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:dark, html.auto .sf-c-txt-olive\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark, html.auto .sf-c-txt-olive\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark, html.auto .sf-c-txt-olive\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark, html.auto .sf-c-txt-olive\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark, html.auto .sf-c-txt-olive\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark, html.auto .sf-c-txt-olive\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark, html.auto .sf-c-txt-olive\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark, html.auto .sf-c-txt-olive\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark, html.auto .sf-c-txt-olive\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark, html.auto .sf-c-txt-olive\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark, html.auto .sf-c-txt-olive\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark, html.auto .sf-c-txt-olive\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:dark, html.var.auto .sf-c-txt-olive\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark, html.var.auto .sf-c-txt-olive\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark, html.var.auto .sf-c-txt-olive\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark, html.var.auto .sf-c-txt-olive\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark, html.var.auto .sf-c-txt-olive\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark, html.var.auto .sf-c-txt-olive\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark, html.var.auto .sf-c-txt-olive\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark, html.var.auto .sf-c-txt-olive\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark, html.var.auto .sf-c-txt-olive\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark, html.var.auto .sf-c-txt-olive\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark, html.var.auto .sf-c-txt-olive\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark, html.var.auto .sf-c-txt-olive\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/olivedrab.css b/src/colors/10/olivedrab.css index d0d62aa..2ba9f77 100644 --- a/src/colors/10/olivedrab.css +++ b/src/colors/10/olivedrab.css @@ -1,4 +1,4 @@ -:root { +[class*='olivedrab'] { --sf-c-olivedrab: 80 60% 35%; --sf-c-olivedrab-0: 80 60% 0%; --sf-c-olivedrab-10: 80 60% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-olivedrab\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-olivedrab\:90\:dark, html.var.auto .sf-c-olivedrab\:90\:dark { color: hsl(80, 60%, 90%); background: hsl(80, 60%, 10%) } html.var[data-theme='auto'] .sf-c-olivedrab\:100\:dark, html.var.auto .sf-c-olivedrab\:100\:dark { color: hsl(80, 60%, 90%); background: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab, html.auto .sf-c-txt-olivedrab { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0, html.auto .sf-c-txt-olivedrab\:0 { color: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10, html.auto .sf-c-txt-olivedrab\:10 { color: hsl(80, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20, html.auto .sf-c-txt-olivedrab\:20 { color: hsl(80, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30, html.auto .sf-c-txt-olivedrab\:30 { color: hsl(80, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40, html.auto .sf-c-txt-olivedrab\:40 { color: hsl(80, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50, html.auto .sf-c-txt-olivedrab\:50 { color: hsl(80, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60, html.auto .sf-c-txt-olivedrab\:60 { color: hsl(80, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70, html.auto .sf-c-txt-olivedrab\:70 { color: hsl(80, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80, html.auto .sf-c-txt-olivedrab\:80 { color: hsl(80, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90, html.auto .sf-c-txt-olivedrab\:90 { color: hsl(80, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100, html.auto .sf-c-txt-olivedrab\:100 { color: hsl(80, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab, html.var.auto .sf-c-txt-olivedrab { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0, html.var.auto .sf-c-txt-olivedrab\:0 { color: hsl(80, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10, html.var.auto .sf-c-txt-olivedrab\:10 { color: hsl(80, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20, html.var.auto .sf-c-txt-olivedrab\:20 { color: hsl(80, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30, html.var.auto .sf-c-txt-olivedrab\:30 { color: hsl(80, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40, html.var.auto .sf-c-txt-olivedrab\:40 { color: hsl(80, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50, html.var.auto .sf-c-txt-olivedrab\:50 { color: hsl(80, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60, html.var.auto .sf-c-txt-olivedrab\:60 { color: hsl(80, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70, html.var.auto .sf-c-txt-olivedrab\:70 { color: hsl(80, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80, html.var.auto .sf-c-txt-olivedrab\:80 { color: hsl(80, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90, html.var.auto .sf-c-txt-olivedrab\:90 { color: hsl(80, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100, html.var.auto .sf-c-txt-olivedrab\:100 { color: hsl(80, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:dark, html.auto .sf-c-txt-olivedrab\:dark { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0\:dark, html.auto .sf-c-txt-olivedrab\:0\:dark { color: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10\:dark, html.auto .sf-c-txt-olivedrab\:10\:dark { color: hsl(80, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20\:dark, html.auto .sf-c-txt-olivedrab\:20\:dark { color: hsl(80, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30\:dark, html.auto .sf-c-txt-olivedrab\:30\:dark { color: hsl(80, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40\:dark, html.auto .sf-c-txt-olivedrab\:40\:dark { color: hsl(80, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50\:dark, html.auto .sf-c-txt-olivedrab\:50\:dark { color: hsl(80, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60\:dark, html.auto .sf-c-txt-olivedrab\:60\:dark { color: hsl(80, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70\:dark, html.auto .sf-c-txt-olivedrab\:70\:dark { color: hsl(80, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80\:dark, html.auto .sf-c-txt-olivedrab\:80\:dark { color: hsl(80, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90\:dark, html.auto .sf-c-txt-olivedrab\:90\:dark { color: hsl(80, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100\:dark, html.auto .sf-c-txt-olivedrab\:100\:dark { color: hsl(80, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:dark, html.var.auto .sf-c-txt-olivedrab\:dark { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0\:dark, html.var.auto .sf-c-txt-olivedrab\:0\:dark { color: hsl(80, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10\:dark, html.var.auto .sf-c-txt-olivedrab\:10\:dark { color: hsl(80, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20\:dark, html.var.auto .sf-c-txt-olivedrab\:20\:dark { color: hsl(80, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30\:dark, html.var.auto .sf-c-txt-olivedrab\:30\:dark { color: hsl(80, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40\:dark, html.var.auto .sf-c-txt-olivedrab\:40\:dark { color: hsl(80, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50\:dark, html.var.auto .sf-c-txt-olivedrab\:50\:dark { color: hsl(80, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60\:dark, html.var.auto .sf-c-txt-olivedrab\:60\:dark { color: hsl(80, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70\:dark, html.var.auto .sf-c-txt-olivedrab\:70\:dark { color: hsl(80, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80\:dark, html.var.auto .sf-c-txt-olivedrab\:80\:dark { color: hsl(80, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90\:dark, html.var.auto .sf-c-txt-olivedrab\:90\:dark { color: hsl(80, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100\:dark, html.var.auto .sf-c-txt-olivedrab\:100\:dark { color: hsl(80, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/orange.css b/src/colors/10/orange.css index ee6fa42..5930247 100644 --- a/src/colors/10/orange.css +++ b/src/colors/10/orange.css @@ -1,4 +1,4 @@ -:root { +[class*='orange'] { --sf-c-orange: 39 100% 50%; --sf-c-orange-0: 39 100% 0%; --sf-c-orange-10: 39 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-orange\:100\:dark, html.dark .sf-c-txt-ora html.var[data-theme='auto'] .sf-c-orange\:90\:dark, html.var.auto .sf-c-orange\:90\:dark { color: hsl(39, 100%, 90%); background: hsl(39, 100%, 10%) } html.var[data-theme='auto'] .sf-c-orange\:100\:dark, html.var.auto .sf-c-orange\:100\:dark { color: hsl(39, 100%, 90%); background: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange, html.auto .sf-c-txt-orange { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:0, html.auto .sf-c-txt-orange\:0 { color: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:10, html.auto .sf-c-txt-orange\:10 { color: hsl(39, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:20, html.auto .sf-c-txt-orange\:20 { color: hsl(39, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:30, html.auto .sf-c-txt-orange\:30 { color: hsl(39, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:40, html.auto .sf-c-txt-orange\:40 { color: hsl(39, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:50, html.auto .sf-c-txt-orange\:50 { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:60, html.auto .sf-c-txt-orange\:60 { color: hsl(39, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:70, html.auto .sf-c-txt-orange\:70 { color: hsl(39, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:80, html.auto .sf-c-txt-orange\:80 { color: hsl(39, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:90, html.auto .sf-c-txt-orange\:90 { color: hsl(39, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:100, html.auto .sf-c-txt-orange\:100 { color: hsl(39, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orange, html.var.auto .sf-c-txt-orange { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:0, html.var.auto .sf-c-txt-orange\:0 { color: hsl(39, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:10, html.var.auto .sf-c-txt-orange\:10 { color: hsl(39, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:20, html.var.auto .sf-c-txt-orange\:20 { color: hsl(39, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:30, html.var.auto .sf-c-txt-orange\:30 { color: hsl(39, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:40, html.var.auto .sf-c-txt-orange\:40 { color: hsl(39, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:50, html.var.auto .sf-c-txt-orange\:50 { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:60, html.var.auto .sf-c-txt-orange\:60 { color: hsl(39, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:70, html.var.auto .sf-c-txt-orange\:70 { color: hsl(39, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:80, html.var.auto .sf-c-txt-orange\:80 { color: hsl(39, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:90, html.var.auto .sf-c-txt-orange\:90 { color: hsl(39, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:100, html.var.auto .sf-c-txt-orange\:100 { color: hsl(39, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:dark, html.auto .sf-c-txt-orange\:dark { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark, html.auto .sf-c-txt-orange\:0\:dark { color: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark, html.auto .sf-c-txt-orange\:10\:dark { color: hsl(39, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark, html.auto .sf-c-txt-orange\:20\:dark { color: hsl(39, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark, html.auto .sf-c-txt-orange\:30\:dark { color: hsl(39, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark, html.auto .sf-c-txt-orange\:40\:dark { color: hsl(39, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark, html.auto .sf-c-txt-orange\:50\:dark { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark, html.auto .sf-c-txt-orange\:60\:dark { color: hsl(39, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark, html.auto .sf-c-txt-orange\:70\:dark { color: hsl(39, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark, html.auto .sf-c-txt-orange\:80\:dark { color: hsl(39, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark, html.auto .sf-c-txt-orange\:90\:dark { color: hsl(39, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark, html.auto .sf-c-txt-orange\:100\:dark { color: hsl(39, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:dark, html.var.auto .sf-c-txt-orange\:dark { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark, html.var.auto .sf-c-txt-orange\:0\:dark { color: hsl(39, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark, html.var.auto .sf-c-txt-orange\:10\:dark { color: hsl(39, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark, html.var.auto .sf-c-txt-orange\:20\:dark { color: hsl(39, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark, html.var.auto .sf-c-txt-orange\:30\:dark { color: hsl(39, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark, html.var.auto .sf-c-txt-orange\:40\:dark { color: hsl(39, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark, html.var.auto .sf-c-txt-orange\:50\:dark { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark, html.var.auto .sf-c-txt-orange\:60\:dark { color: hsl(39, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark, html.var.auto .sf-c-txt-orange\:70\:dark { color: hsl(39, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark, html.var.auto .sf-c-txt-orange\:80\:dark { color: hsl(39, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark, html.var.auto .sf-c-txt-orange\:90\:dark { color: hsl(39, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark, html.var.auto .sf-c-txt-orange\:100\:dark { color: hsl(39, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/orangered.css b/src/colors/10/orangered.css index bbf2538..957d3d2 100644 --- a/src/colors/10/orangered.css +++ b/src/colors/10/orangered.css @@ -1,4 +1,4 @@ -:root { +[class*='orangered'] { --sf-c-orangered: 16 100% 50%; --sf-c-orangered-0: 16 100% 0%; --sf-c-orangered-10: 16 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-orangered\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-orangered\:90\:dark, html.var.auto .sf-c-orangered\:90\:dark { color: hsl(16, 100%, 90%); background: hsl(16, 100%, 10%) } html.var[data-theme='auto'] .sf-c-orangered\:100\:dark, html.var.auto .sf-c-orangered\:100\:dark { color: hsl(16, 100%, 90%); background: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered, html.auto .sf-c-txt-orangered { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:0, html.auto .sf-c-txt-orangered\:0 { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:10, html.auto .sf-c-txt-orangered\:10 { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:20, html.auto .sf-c-txt-orangered\:20 { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:30, html.auto .sf-c-txt-orangered\:30 { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:40, html.auto .sf-c-txt-orangered\:40 { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:50, html.auto .sf-c-txt-orangered\:50 { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:60, html.auto .sf-c-txt-orangered\:60 { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:70, html.auto .sf-c-txt-orangered\:70 { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:80, html.auto .sf-c-txt-orangered\:80 { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:90, html.auto .sf-c-txt-orangered\:90 { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:100, html.auto .sf-c-txt-orangered\:100 { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orangered, html.var.auto .sf-c-txt-orangered { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:0, html.var.auto .sf-c-txt-orangered\:0 { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:10, html.var.auto .sf-c-txt-orangered\:10 { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:20, html.var.auto .sf-c-txt-orangered\:20 { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:30, html.var.auto .sf-c-txt-orangered\:30 { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:40, html.var.auto .sf-c-txt-orangered\:40 { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:50, html.var.auto .sf-c-txt-orangered\:50 { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:60, html.var.auto .sf-c-txt-orangered\:60 { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:70, html.var.auto .sf-c-txt-orangered\:70 { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:80, html.var.auto .sf-c-txt-orangered\:80 { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:90, html.var.auto .sf-c-txt-orangered\:90 { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:100, html.var.auto .sf-c-txt-orangered\:100 { color: hsl(16, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:dark, html.auto .sf-c-txt-orangered\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:0\:dark, html.auto .sf-c-txt-orangered\:0\:dark { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:10\:dark, html.auto .sf-c-txt-orangered\:10\:dark { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:20\:dark, html.auto .sf-c-txt-orangered\:20\:dark { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:30\:dark, html.auto .sf-c-txt-orangered\:30\:dark { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:40\:dark, html.auto .sf-c-txt-orangered\:40\:dark { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:50\:dark, html.auto .sf-c-txt-orangered\:50\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:60\:dark, html.auto .sf-c-txt-orangered\:60\:dark { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:70\:dark, html.auto .sf-c-txt-orangered\:70\:dark { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:80\:dark, html.auto .sf-c-txt-orangered\:80\:dark { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:90\:dark, html.auto .sf-c-txt-orangered\:90\:dark { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:100\:dark, html.auto .sf-c-txt-orangered\:100\:dark { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:dark, html.var.auto .sf-c-txt-orangered\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:0\:dark, html.var.auto .sf-c-txt-orangered\:0\:dark { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:10\:dark, html.var.auto .sf-c-txt-orangered\:10\:dark { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:20\:dark, html.var.auto .sf-c-txt-orangered\:20\:dark { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:30\:dark, html.var.auto .sf-c-txt-orangered\:30\:dark { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:40\:dark, html.var.auto .sf-c-txt-orangered\:40\:dark { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:50\:dark, html.var.auto .sf-c-txt-orangered\:50\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:60\:dark, html.var.auto .sf-c-txt-orangered\:60\:dark { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:70\:dark, html.var.auto .sf-c-txt-orangered\:70\:dark { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:80\:dark, html.var.auto .sf-c-txt-orangered\:80\:dark { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:90\:dark, html.var.auto .sf-c-txt-orangered\:90\:dark { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:100\:dark, html.var.auto .sf-c-txt-orangered\:100\:dark { color: hsl(16, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/orchid.css b/src/colors/10/orchid.css index 64d1380..b6cfcdf 100644 --- a/src/colors/10/orchid.css +++ b/src/colors/10/orchid.css @@ -1,4 +1,4 @@ -:root { +[class*='orchid'] { --sf-c-orchid: 302 59% 65%; --sf-c-orchid-0: 302 59% 0%; --sf-c-orchid-10: 302 59% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-orchid\:100\:dark, html.dark .sf-c-txt-orc html.var[data-theme='auto'] .sf-c-orchid\:90\:dark, html.var.auto .sf-c-orchid\:90\:dark { color: hsl(302, 59%, 90%); background: hsl(302, 59%, 10%) } html.var[data-theme='auto'] .sf-c-orchid\:100\:dark, html.var.auto .sf-c-orchid\:100\:dark { color: hsl(302, 59%, 90%); background: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid, html.auto .sf-c-txt-orchid { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:0, html.auto .sf-c-txt-orchid\:0 { color: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:10, html.auto .sf-c-txt-orchid\:10 { color: hsl(302, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:20, html.auto .sf-c-txt-orchid\:20 { color: hsl(302, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:30, html.auto .sf-c-txt-orchid\:30 { color: hsl(302, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:40, html.auto .sf-c-txt-orchid\:40 { color: hsl(302, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:50, html.auto .sf-c-txt-orchid\:50 { color: hsl(302, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:60, html.auto .sf-c-txt-orchid\:60 { color: hsl(302, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:70, html.auto .sf-c-txt-orchid\:70 { color: hsl(302, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:80, html.auto .sf-c-txt-orchid\:80 { color: hsl(302, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:90, html.auto .sf-c-txt-orchid\:90 { color: hsl(302, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:100, html.auto .sf-c-txt-orchid\:100 { color: hsl(302, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orchid, html.var.auto .sf-c-txt-orchid { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:0, html.var.auto .sf-c-txt-orchid\:0 { color: hsl(302, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:10, html.var.auto .sf-c-txt-orchid\:10 { color: hsl(302, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:20, html.var.auto .sf-c-txt-orchid\:20 { color: hsl(302, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:30, html.var.auto .sf-c-txt-orchid\:30 { color: hsl(302, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:40, html.var.auto .sf-c-txt-orchid\:40 { color: hsl(302, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:50, html.var.auto .sf-c-txt-orchid\:50 { color: hsl(302, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:60, html.var.auto .sf-c-txt-orchid\:60 { color: hsl(302, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:70, html.var.auto .sf-c-txt-orchid\:70 { color: hsl(302, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:80, html.var.auto .sf-c-txt-orchid\:80 { color: hsl(302, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:90, html.var.auto .sf-c-txt-orchid\:90 { color: hsl(302, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:100, html.var.auto .sf-c-txt-orchid\:100 { color: hsl(302, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:dark, html.auto .sf-c-txt-orchid\:dark { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:0\:dark, html.auto .sf-c-txt-orchid\:0\:dark { color: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:10\:dark, html.auto .sf-c-txt-orchid\:10\:dark { color: hsl(302, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:20\:dark, html.auto .sf-c-txt-orchid\:20\:dark { color: hsl(302, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:30\:dark, html.auto .sf-c-txt-orchid\:30\:dark { color: hsl(302, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:40\:dark, html.auto .sf-c-txt-orchid\:40\:dark { color: hsl(302, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:50\:dark, html.auto .sf-c-txt-orchid\:50\:dark { color: hsl(302, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:60\:dark, html.auto .sf-c-txt-orchid\:60\:dark { color: hsl(302, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:70\:dark, html.auto .sf-c-txt-orchid\:70\:dark { color: hsl(302, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:80\:dark, html.auto .sf-c-txt-orchid\:80\:dark { color: hsl(302, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:90\:dark, html.auto .sf-c-txt-orchid\:90\:dark { color: hsl(302, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:100\:dark, html.auto .sf-c-txt-orchid\:100\:dark { color: hsl(302, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:dark, html.var.auto .sf-c-txt-orchid\:dark { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:0\:dark, html.var.auto .sf-c-txt-orchid\:0\:dark { color: hsl(302, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:10\:dark, html.var.auto .sf-c-txt-orchid\:10\:dark { color: hsl(302, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:20\:dark, html.var.auto .sf-c-txt-orchid\:20\:dark { color: hsl(302, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:30\:dark, html.var.auto .sf-c-txt-orchid\:30\:dark { color: hsl(302, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:40\:dark, html.var.auto .sf-c-txt-orchid\:40\:dark { color: hsl(302, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:50\:dark, html.var.auto .sf-c-txt-orchid\:50\:dark { color: hsl(302, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:60\:dark, html.var.auto .sf-c-txt-orchid\:60\:dark { color: hsl(302, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:70\:dark, html.var.auto .sf-c-txt-orchid\:70\:dark { color: hsl(302, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:80\:dark, html.var.auto .sf-c-txt-orchid\:80\:dark { color: hsl(302, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:90\:dark, html.var.auto .sf-c-txt-orchid\:90\:dark { color: hsl(302, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:100\:dark, html.var.auto .sf-c-txt-orchid\:100\:dark { color: hsl(302, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/palegoldenrod.css b/src/colors/10/palegoldenrod.css index eaf54ee..209091e 100644 --- a/src/colors/10/palegoldenrod.css +++ b/src/colors/10/palegoldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='palegoldenrod'] { --sf-c-palegoldenrod: 55 67% 80%; --sf-c-palegoldenrod-0: 55 67% 0%; --sf-c-palegoldenrod-10: 55 67% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-palegoldenrod\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-palegoldenrod\:90\:dark, html.var.auto .sf-c-palegoldenrod\:90\:dark { color: hsl(55, 67%, 90%); background: hsl(55, 67%, 10%) } html.var[data-theme='auto'] .sf-c-palegoldenrod\:100\:dark, html.var.auto .sf-c-palegoldenrod\:100\:dark { color: hsl(55, 67%, 90%); background: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod, html.auto .sf-c-txt-palegoldenrod { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0, html.auto .sf-c-txt-palegoldenrod\:0 { color: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10, html.auto .sf-c-txt-palegoldenrod\:10 { color: hsl(55, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20, html.auto .sf-c-txt-palegoldenrod\:20 { color: hsl(55, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30, html.auto .sf-c-txt-palegoldenrod\:30 { color: hsl(55, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40, html.auto .sf-c-txt-palegoldenrod\:40 { color: hsl(55, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50, html.auto .sf-c-txt-palegoldenrod\:50 { color: hsl(55, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60, html.auto .sf-c-txt-palegoldenrod\:60 { color: hsl(55, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70, html.auto .sf-c-txt-palegoldenrod\:70 { color: hsl(55, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80, html.auto .sf-c-txt-palegoldenrod\:80 { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90, html.auto .sf-c-txt-palegoldenrod\:90 { color: hsl(55, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100, html.auto .sf-c-txt-palegoldenrod\:100 { color: hsl(55, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod, html.var.auto .sf-c-txt-palegoldenrod { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0, html.var.auto .sf-c-txt-palegoldenrod\:0 { color: hsl(55, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10, html.var.auto .sf-c-txt-palegoldenrod\:10 { color: hsl(55, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20, html.var.auto .sf-c-txt-palegoldenrod\:20 { color: hsl(55, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30, html.var.auto .sf-c-txt-palegoldenrod\:30 { color: hsl(55, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40, html.var.auto .sf-c-txt-palegoldenrod\:40 { color: hsl(55, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50, html.var.auto .sf-c-txt-palegoldenrod\:50 { color: hsl(55, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60, html.var.auto .sf-c-txt-palegoldenrod\:60 { color: hsl(55, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70, html.var.auto .sf-c-txt-palegoldenrod\:70 { color: hsl(55, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80, html.var.auto .sf-c-txt-palegoldenrod\:80 { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90, html.var.auto .sf-c-txt-palegoldenrod\:90 { color: hsl(55, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100, html.var.auto .sf-c-txt-palegoldenrod\:100 { color: hsl(55, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:dark, html.auto .sf-c-txt-palegoldenrod\:dark { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0\:dark, html.auto .sf-c-txt-palegoldenrod\:0\:dark { color: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10\:dark, html.auto .sf-c-txt-palegoldenrod\:10\:dark { color: hsl(55, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20\:dark, html.auto .sf-c-txt-palegoldenrod\:20\:dark { color: hsl(55, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30\:dark, html.auto .sf-c-txt-palegoldenrod\:30\:dark { color: hsl(55, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40\:dark, html.auto .sf-c-txt-palegoldenrod\:40\:dark { color: hsl(55, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50\:dark, html.auto .sf-c-txt-palegoldenrod\:50\:dark { color: hsl(55, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60\:dark, html.auto .sf-c-txt-palegoldenrod\:60\:dark { color: hsl(55, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70\:dark, html.auto .sf-c-txt-palegoldenrod\:70\:dark { color: hsl(55, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80\:dark, html.auto .sf-c-txt-palegoldenrod\:80\:dark { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90\:dark, html.auto .sf-c-txt-palegoldenrod\:90\:dark { color: hsl(55, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100\:dark, html.auto .sf-c-txt-palegoldenrod\:100\:dark { color: hsl(55, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:dark, html.var.auto .sf-c-txt-palegoldenrod\:dark { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0\:dark, html.var.auto .sf-c-txt-palegoldenrod\:0\:dark { color: hsl(55, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10\:dark, html.var.auto .sf-c-txt-palegoldenrod\:10\:dark { color: hsl(55, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20\:dark, html.var.auto .sf-c-txt-palegoldenrod\:20\:dark { color: hsl(55, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30\:dark, html.var.auto .sf-c-txt-palegoldenrod\:30\:dark { color: hsl(55, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40\:dark, html.var.auto .sf-c-txt-palegoldenrod\:40\:dark { color: hsl(55, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50\:dark, html.var.auto .sf-c-txt-palegoldenrod\:50\:dark { color: hsl(55, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60\:dark, html.var.auto .sf-c-txt-palegoldenrod\:60\:dark { color: hsl(55, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70\:dark, html.var.auto .sf-c-txt-palegoldenrod\:70\:dark { color: hsl(55, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80\:dark, html.var.auto .sf-c-txt-palegoldenrod\:80\:dark { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90\:dark, html.var.auto .sf-c-txt-palegoldenrod\:90\:dark { color: hsl(55, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100\:dark, html.var.auto .sf-c-txt-palegoldenrod\:100\:dark { color: hsl(55, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/palegreen.css b/src/colors/10/palegreen.css index 4d38181..1318ebf 100644 --- a/src/colors/10/palegreen.css +++ b/src/colors/10/palegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='palegreen'] { --sf-c-palegreen: 120 93% 79%; --sf-c-palegreen-0: 120 93% 0%; --sf-c-palegreen-10: 120 93% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-palegreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-palegreen\:90\:dark, html.var.auto .sf-c-palegreen\:90\:dark { color: hsl(120, 93%, 90%); background: hsl(120, 93%, 10%) } html.var[data-theme='auto'] .sf-c-palegreen\:100\:dark, html.var.auto .sf-c-palegreen\:100\:dark { color: hsl(120, 93%, 90%); background: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen, html.auto .sf-c-txt-palegreen { color: hsl(120, 93%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:0, html.auto .sf-c-txt-palegreen\:0 { color: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:10, html.auto .sf-c-txt-palegreen\:10 { color: hsl(120, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:20, html.auto .sf-c-txt-palegreen\:20 { color: hsl(120, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:30, html.auto .sf-c-txt-palegreen\:30 { color: hsl(120, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:40, html.auto .sf-c-txt-palegreen\:40 { color: hsl(120, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:50, html.auto .sf-c-txt-palegreen\:50 { color: hsl(120, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:60, html.auto .sf-c-txt-palegreen\:60 { color: hsl(120, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:70, html.auto .sf-c-txt-palegreen\:70 { color: hsl(120, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:80, html.auto .sf-c-txt-palegreen\:80 { color: hsl(120, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:90, html.auto .sf-c-txt-palegreen\:90 { color: hsl(120, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:100, html.auto .sf-c-txt-palegreen\:100 { color: hsl(120, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen, html.var.auto .sf-c-txt-palegreen { color: hsl(120, 93%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:0, html.var.auto .sf-c-txt-palegreen\:0 { color: hsl(120, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:10, html.var.auto .sf-c-txt-palegreen\:10 { color: hsl(120, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:20, html.var.auto .sf-c-txt-palegreen\:20 { color: hsl(120, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:30, html.var.auto .sf-c-txt-palegreen\:30 { color: hsl(120, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:40, html.var.auto .sf-c-txt-palegreen\:40 { color: hsl(120, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:50, html.var.auto .sf-c-txt-palegreen\:50 { color: hsl(120, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:60, html.var.auto .sf-c-txt-palegreen\:60 { color: hsl(120, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:70, html.var.auto .sf-c-txt-palegreen\:70 { color: hsl(120, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:80, html.var.auto .sf-c-txt-palegreen\:80 { color: hsl(120, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:90, html.var.auto .sf-c-txt-palegreen\:90 { color: hsl(120, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:100, html.var.auto .sf-c-txt-palegreen\:100 { color: hsl(120, 93%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:dark, html.auto .sf-c-txt-palegreen\:dark { color: hsl(120, 93%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:0\:dark, html.auto .sf-c-txt-palegreen\:0\:dark { color: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:10\:dark, html.auto .sf-c-txt-palegreen\:10\:dark { color: hsl(120, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:20\:dark, html.auto .sf-c-txt-palegreen\:20\:dark { color: hsl(120, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:30\:dark, html.auto .sf-c-txt-palegreen\:30\:dark { color: hsl(120, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:40\:dark, html.auto .sf-c-txt-palegreen\:40\:dark { color: hsl(120, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:50\:dark, html.auto .sf-c-txt-palegreen\:50\:dark { color: hsl(120, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:60\:dark, html.auto .sf-c-txt-palegreen\:60\:dark { color: hsl(120, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:70\:dark, html.auto .sf-c-txt-palegreen\:70\:dark { color: hsl(120, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:80\:dark, html.auto .sf-c-txt-palegreen\:80\:dark { color: hsl(120, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:90\:dark, html.auto .sf-c-txt-palegreen\:90\:dark { color: hsl(120, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:100\:dark, html.auto .sf-c-txt-palegreen\:100\:dark { color: hsl(120, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:dark, html.var.auto .sf-c-txt-palegreen\:dark { color: hsl(120, 93%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:0\:dark, html.var.auto .sf-c-txt-palegreen\:0\:dark { color: hsl(120, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:10\:dark, html.var.auto .sf-c-txt-palegreen\:10\:dark { color: hsl(120, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:20\:dark, html.var.auto .sf-c-txt-palegreen\:20\:dark { color: hsl(120, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:30\:dark, html.var.auto .sf-c-txt-palegreen\:30\:dark { color: hsl(120, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:40\:dark, html.var.auto .sf-c-txt-palegreen\:40\:dark { color: hsl(120, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:50\:dark, html.var.auto .sf-c-txt-palegreen\:50\:dark { color: hsl(120, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:60\:dark, html.var.auto .sf-c-txt-palegreen\:60\:dark { color: hsl(120, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:70\:dark, html.var.auto .sf-c-txt-palegreen\:70\:dark { color: hsl(120, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:80\:dark, html.var.auto .sf-c-txt-palegreen\:80\:dark { color: hsl(120, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:90\:dark, html.var.auto .sf-c-txt-palegreen\:90\:dark { color: hsl(120, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:100\:dark, html.var.auto .sf-c-txt-palegreen\:100\:dark { color: hsl(120, 93%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/paleturquoise.css b/src/colors/10/paleturquoise.css index 0c3e3a2..dffa0de 100644 --- a/src/colors/10/paleturquoise.css +++ b/src/colors/10/paleturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='paleturquoise'] { --sf-c-paleturquoise: 180 65% 81%; --sf-c-paleturquoise-0: 180 65% 0%; --sf-c-paleturquoise-10: 180 65% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-paleturquoise\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-paleturquoise\:90\:dark, html.var.auto .sf-c-paleturquoise\:90\:dark { color: hsl(180, 65%, 90%); background: hsl(180, 65%, 10%) } html.var[data-theme='auto'] .sf-c-paleturquoise\:100\:dark, html.var.auto .sf-c-paleturquoise\:100\:dark { color: hsl(180, 65%, 90%); background: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise, html.auto .sf-c-txt-paleturquoise { color: hsl(180, 65%, 81%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0, html.auto .sf-c-txt-paleturquoise\:0 { color: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10, html.auto .sf-c-txt-paleturquoise\:10 { color: hsl(180, 65%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20, html.auto .sf-c-txt-paleturquoise\:20 { color: hsl(180, 65%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30, html.auto .sf-c-txt-paleturquoise\:30 { color: hsl(180, 65%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40, html.auto .sf-c-txt-paleturquoise\:40 { color: hsl(180, 65%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50, html.auto .sf-c-txt-paleturquoise\:50 { color: hsl(180, 65%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60, html.auto .sf-c-txt-paleturquoise\:60 { color: hsl(180, 65%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70, html.auto .sf-c-txt-paleturquoise\:70 { color: hsl(180, 65%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80, html.auto .sf-c-txt-paleturquoise\:80 { color: hsl(180, 65%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90, html.auto .sf-c-txt-paleturquoise\:90 { color: hsl(180, 65%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100, html.auto .sf-c-txt-paleturquoise\:100 { color: hsl(180, 65%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise, html.var.auto .sf-c-txt-paleturquoise { color: hsl(180, 65%, 81%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0, html.var.auto .sf-c-txt-paleturquoise\:0 { color: hsl(180, 65%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10, html.var.auto .sf-c-txt-paleturquoise\:10 { color: hsl(180, 65%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20, html.var.auto .sf-c-txt-paleturquoise\:20 { color: hsl(180, 65%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30, html.var.auto .sf-c-txt-paleturquoise\:30 { color: hsl(180, 65%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40, html.var.auto .sf-c-txt-paleturquoise\:40 { color: hsl(180, 65%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50, html.var.auto .sf-c-txt-paleturquoise\:50 { color: hsl(180, 65%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60, html.var.auto .sf-c-txt-paleturquoise\:60 { color: hsl(180, 65%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70, html.var.auto .sf-c-txt-paleturquoise\:70 { color: hsl(180, 65%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80, html.var.auto .sf-c-txt-paleturquoise\:80 { color: hsl(180, 65%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90, html.var.auto .sf-c-txt-paleturquoise\:90 { color: hsl(180, 65%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100, html.var.auto .sf-c-txt-paleturquoise\:100 { color: hsl(180, 65%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:dark, html.auto .sf-c-txt-paleturquoise\:dark { color: hsl(180, 65%, 81%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0\:dark, html.auto .sf-c-txt-paleturquoise\:0\:dark { color: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10\:dark, html.auto .sf-c-txt-paleturquoise\:10\:dark { color: hsl(180, 65%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20\:dark, html.auto .sf-c-txt-paleturquoise\:20\:dark { color: hsl(180, 65%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30\:dark, html.auto .sf-c-txt-paleturquoise\:30\:dark { color: hsl(180, 65%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40\:dark, html.auto .sf-c-txt-paleturquoise\:40\:dark { color: hsl(180, 65%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50\:dark, html.auto .sf-c-txt-paleturquoise\:50\:dark { color: hsl(180, 65%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60\:dark, html.auto .sf-c-txt-paleturquoise\:60\:dark { color: hsl(180, 65%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70\:dark, html.auto .sf-c-txt-paleturquoise\:70\:dark { color: hsl(180, 65%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80\:dark, html.auto .sf-c-txt-paleturquoise\:80\:dark { color: hsl(180, 65%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90\:dark, html.auto .sf-c-txt-paleturquoise\:90\:dark { color: hsl(180, 65%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100\:dark, html.auto .sf-c-txt-paleturquoise\:100\:dark { color: hsl(180, 65%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:dark, html.var.auto .sf-c-txt-paleturquoise\:dark { color: hsl(180, 65%, 81%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0\:dark, html.var.auto .sf-c-txt-paleturquoise\:0\:dark { color: hsl(180, 65%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10\:dark, html.var.auto .sf-c-txt-paleturquoise\:10\:dark { color: hsl(180, 65%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20\:dark, html.var.auto .sf-c-txt-paleturquoise\:20\:dark { color: hsl(180, 65%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30\:dark, html.var.auto .sf-c-txt-paleturquoise\:30\:dark { color: hsl(180, 65%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40\:dark, html.var.auto .sf-c-txt-paleturquoise\:40\:dark { color: hsl(180, 65%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50\:dark, html.var.auto .sf-c-txt-paleturquoise\:50\:dark { color: hsl(180, 65%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60\:dark, html.var.auto .sf-c-txt-paleturquoise\:60\:dark { color: hsl(180, 65%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70\:dark, html.var.auto .sf-c-txt-paleturquoise\:70\:dark { color: hsl(180, 65%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80\:dark, html.var.auto .sf-c-txt-paleturquoise\:80\:dark { color: hsl(180, 65%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90\:dark, html.var.auto .sf-c-txt-paleturquoise\:90\:dark { color: hsl(180, 65%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100\:dark, html.var.auto .sf-c-txt-paleturquoise\:100\:dark { color: hsl(180, 65%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/palevioletred.css b/src/colors/10/palevioletred.css index f616db6..e847780 100644 --- a/src/colors/10/palevioletred.css +++ b/src/colors/10/palevioletred.css @@ -1,4 +1,4 @@ -:root { +[class*='palevioletred'] { --sf-c-palevioletred: 340 60% 65%; --sf-c-palevioletred-0: 340 60% 0%; --sf-c-palevioletred-10: 340 60% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-palevioletred\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-palevioletred\:90\:dark, html.var.auto .sf-c-palevioletred\:90\:dark { color: hsl(340, 60%, 90%); background: hsl(340, 60%, 10%) } html.var[data-theme='auto'] .sf-c-palevioletred\:100\:dark, html.var.auto .sf-c-palevioletred\:100\:dark { color: hsl(340, 60%, 90%); background: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred, html.auto .sf-c-txt-palevioletred { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0, html.auto .sf-c-txt-palevioletred\:0 { color: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10, html.auto .sf-c-txt-palevioletred\:10 { color: hsl(340, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20, html.auto .sf-c-txt-palevioletred\:20 { color: hsl(340, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30, html.auto .sf-c-txt-palevioletred\:30 { color: hsl(340, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40, html.auto .sf-c-txt-palevioletred\:40 { color: hsl(340, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50, html.auto .sf-c-txt-palevioletred\:50 { color: hsl(340, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60, html.auto .sf-c-txt-palevioletred\:60 { color: hsl(340, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70, html.auto .sf-c-txt-palevioletred\:70 { color: hsl(340, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80, html.auto .sf-c-txt-palevioletred\:80 { color: hsl(340, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90, html.auto .sf-c-txt-palevioletred\:90 { color: hsl(340, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100, html.auto .sf-c-txt-palevioletred\:100 { color: hsl(340, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred, html.var.auto .sf-c-txt-palevioletred { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0, html.var.auto .sf-c-txt-palevioletred\:0 { color: hsl(340, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10, html.var.auto .sf-c-txt-palevioletred\:10 { color: hsl(340, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20, html.var.auto .sf-c-txt-palevioletred\:20 { color: hsl(340, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30, html.var.auto .sf-c-txt-palevioletred\:30 { color: hsl(340, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40, html.var.auto .sf-c-txt-palevioletred\:40 { color: hsl(340, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50, html.var.auto .sf-c-txt-palevioletred\:50 { color: hsl(340, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60, html.var.auto .sf-c-txt-palevioletred\:60 { color: hsl(340, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70, html.var.auto .sf-c-txt-palevioletred\:70 { color: hsl(340, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80, html.var.auto .sf-c-txt-palevioletred\:80 { color: hsl(340, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90, html.var.auto .sf-c-txt-palevioletred\:90 { color: hsl(340, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100, html.var.auto .sf-c-txt-palevioletred\:100 { color: hsl(340, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:dark, html.auto .sf-c-txt-palevioletred\:dark { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0\:dark, html.auto .sf-c-txt-palevioletred\:0\:dark { color: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10\:dark, html.auto .sf-c-txt-palevioletred\:10\:dark { color: hsl(340, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20\:dark, html.auto .sf-c-txt-palevioletred\:20\:dark { color: hsl(340, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30\:dark, html.auto .sf-c-txt-palevioletred\:30\:dark { color: hsl(340, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40\:dark, html.auto .sf-c-txt-palevioletred\:40\:dark { color: hsl(340, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50\:dark, html.auto .sf-c-txt-palevioletred\:50\:dark { color: hsl(340, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60\:dark, html.auto .sf-c-txt-palevioletred\:60\:dark { color: hsl(340, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70\:dark, html.auto .sf-c-txt-palevioletred\:70\:dark { color: hsl(340, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80\:dark, html.auto .sf-c-txt-palevioletred\:80\:dark { color: hsl(340, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90\:dark, html.auto .sf-c-txt-palevioletred\:90\:dark { color: hsl(340, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100\:dark, html.auto .sf-c-txt-palevioletred\:100\:dark { color: hsl(340, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:dark, html.var.auto .sf-c-txt-palevioletred\:dark { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0\:dark, html.var.auto .sf-c-txt-palevioletred\:0\:dark { color: hsl(340, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10\:dark, html.var.auto .sf-c-txt-palevioletred\:10\:dark { color: hsl(340, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20\:dark, html.var.auto .sf-c-txt-palevioletred\:20\:dark { color: hsl(340, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30\:dark, html.var.auto .sf-c-txt-palevioletred\:30\:dark { color: hsl(340, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40\:dark, html.var.auto .sf-c-txt-palevioletred\:40\:dark { color: hsl(340, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50\:dark, html.var.auto .sf-c-txt-palevioletred\:50\:dark { color: hsl(340, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60\:dark, html.var.auto .sf-c-txt-palevioletred\:60\:dark { color: hsl(340, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70\:dark, html.var.auto .sf-c-txt-palevioletred\:70\:dark { color: hsl(340, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80\:dark, html.var.auto .sf-c-txt-palevioletred\:80\:dark { color: hsl(340, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90\:dark, html.var.auto .sf-c-txt-palevioletred\:90\:dark { color: hsl(340, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100\:dark, html.var.auto .sf-c-txt-palevioletred\:100\:dark { color: hsl(340, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/papayawhip.css b/src/colors/10/papayawhip.css index c6c2e6f..3c0819a 100644 --- a/src/colors/10/papayawhip.css +++ b/src/colors/10/papayawhip.css @@ -1,4 +1,4 @@ -:root { +[class*='papayawhip'] { --sf-c-papayawhip: 37 100% 92%; --sf-c-papayawhip-0: 37 100% 0%; --sf-c-papayawhip-10: 37 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-papayawhip\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-papayawhip\:90\:dark, html.var.auto .sf-c-papayawhip\:90\:dark { color: hsl(37, 100%, 90%); background: hsl(37, 100%, 10%) } html.var[data-theme='auto'] .sf-c-papayawhip\:100\:dark, html.var.auto .sf-c-papayawhip\:100\:dark { color: hsl(37, 100%, 90%); background: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip, html.auto .sf-c-txt-papayawhip { color: hsl(37, 100%, 92%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0, html.auto .sf-c-txt-papayawhip\:0 { color: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10, html.auto .sf-c-txt-papayawhip\:10 { color: hsl(37, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20, html.auto .sf-c-txt-papayawhip\:20 { color: hsl(37, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30, html.auto .sf-c-txt-papayawhip\:30 { color: hsl(37, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40, html.auto .sf-c-txt-papayawhip\:40 { color: hsl(37, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50, html.auto .sf-c-txt-papayawhip\:50 { color: hsl(37, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60, html.auto .sf-c-txt-papayawhip\:60 { color: hsl(37, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70, html.auto .sf-c-txt-papayawhip\:70 { color: hsl(37, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80, html.auto .sf-c-txt-papayawhip\:80 { color: hsl(37, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90, html.auto .sf-c-txt-papayawhip\:90 { color: hsl(37, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100, html.auto .sf-c-txt-papayawhip\:100 { color: hsl(37, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip, html.var.auto .sf-c-txt-papayawhip { color: hsl(37, 100%, 92%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0, html.var.auto .sf-c-txt-papayawhip\:0 { color: hsl(37, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10, html.var.auto .sf-c-txt-papayawhip\:10 { color: hsl(37, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20, html.var.auto .sf-c-txt-papayawhip\:20 { color: hsl(37, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30, html.var.auto .sf-c-txt-papayawhip\:30 { color: hsl(37, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40, html.var.auto .sf-c-txt-papayawhip\:40 { color: hsl(37, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50, html.var.auto .sf-c-txt-papayawhip\:50 { color: hsl(37, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60, html.var.auto .sf-c-txt-papayawhip\:60 { color: hsl(37, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70, html.var.auto .sf-c-txt-papayawhip\:70 { color: hsl(37, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80, html.var.auto .sf-c-txt-papayawhip\:80 { color: hsl(37, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90, html.var.auto .sf-c-txt-papayawhip\:90 { color: hsl(37, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100, html.var.auto .sf-c-txt-papayawhip\:100 { color: hsl(37, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:dark, html.auto .sf-c-txt-papayawhip\:dark { color: hsl(37, 100%, 92%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0\:dark, html.auto .sf-c-txt-papayawhip\:0\:dark { color: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10\:dark, html.auto .sf-c-txt-papayawhip\:10\:dark { color: hsl(37, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20\:dark, html.auto .sf-c-txt-papayawhip\:20\:dark { color: hsl(37, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30\:dark, html.auto .sf-c-txt-papayawhip\:30\:dark { color: hsl(37, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40\:dark, html.auto .sf-c-txt-papayawhip\:40\:dark { color: hsl(37, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50\:dark, html.auto .sf-c-txt-papayawhip\:50\:dark { color: hsl(37, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60\:dark, html.auto .sf-c-txt-papayawhip\:60\:dark { color: hsl(37, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70\:dark, html.auto .sf-c-txt-papayawhip\:70\:dark { color: hsl(37, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80\:dark, html.auto .sf-c-txt-papayawhip\:80\:dark { color: hsl(37, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90\:dark, html.auto .sf-c-txt-papayawhip\:90\:dark { color: hsl(37, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100\:dark, html.auto .sf-c-txt-papayawhip\:100\:dark { color: hsl(37, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:dark, html.var.auto .sf-c-txt-papayawhip\:dark { color: hsl(37, 100%, 92%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0\:dark, html.var.auto .sf-c-txt-papayawhip\:0\:dark { color: hsl(37, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10\:dark, html.var.auto .sf-c-txt-papayawhip\:10\:dark { color: hsl(37, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20\:dark, html.var.auto .sf-c-txt-papayawhip\:20\:dark { color: hsl(37, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30\:dark, html.var.auto .sf-c-txt-papayawhip\:30\:dark { color: hsl(37, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40\:dark, html.var.auto .sf-c-txt-papayawhip\:40\:dark { color: hsl(37, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50\:dark, html.var.auto .sf-c-txt-papayawhip\:50\:dark { color: hsl(37, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60\:dark, html.var.auto .sf-c-txt-papayawhip\:60\:dark { color: hsl(37, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70\:dark, html.var.auto .sf-c-txt-papayawhip\:70\:dark { color: hsl(37, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80\:dark, html.var.auto .sf-c-txt-papayawhip\:80\:dark { color: hsl(37, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90\:dark, html.var.auto .sf-c-txt-papayawhip\:90\:dark { color: hsl(37, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100\:dark, html.var.auto .sf-c-txt-papayawhip\:100\:dark { color: hsl(37, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/peachpuff.css b/src/colors/10/peachpuff.css index 33c6957..2a54187 100644 --- a/src/colors/10/peachpuff.css +++ b/src/colors/10/peachpuff.css @@ -1,4 +1,4 @@ -:root { +[class*='peachpuff'] { --sf-c-peachpuff: 28 100% 86%; --sf-c-peachpuff-0: 28 100% 0%; --sf-c-peachpuff-10: 28 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-peachpuff\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-peachpuff\:90\:dark, html.var.auto .sf-c-peachpuff\:90\:dark { color: hsl(28, 100%, 90%); background: hsl(28, 100%, 10%) } html.var[data-theme='auto'] .sf-c-peachpuff\:100\:dark, html.var.auto .sf-c-peachpuff\:100\:dark { color: hsl(28, 100%, 90%); background: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff, html.auto .sf-c-txt-peachpuff { color: hsl(28, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0, html.auto .sf-c-txt-peachpuff\:0 { color: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10, html.auto .sf-c-txt-peachpuff\:10 { color: hsl(28, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20, html.auto .sf-c-txt-peachpuff\:20 { color: hsl(28, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30, html.auto .sf-c-txt-peachpuff\:30 { color: hsl(28, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40, html.auto .sf-c-txt-peachpuff\:40 { color: hsl(28, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50, html.auto .sf-c-txt-peachpuff\:50 { color: hsl(28, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60, html.auto .sf-c-txt-peachpuff\:60 { color: hsl(28, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70, html.auto .sf-c-txt-peachpuff\:70 { color: hsl(28, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80, html.auto .sf-c-txt-peachpuff\:80 { color: hsl(28, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90, html.auto .sf-c-txt-peachpuff\:90 { color: hsl(28, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100, html.auto .sf-c-txt-peachpuff\:100 { color: hsl(28, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff, html.var.auto .sf-c-txt-peachpuff { color: hsl(28, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0, html.var.auto .sf-c-txt-peachpuff\:0 { color: hsl(28, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10, html.var.auto .sf-c-txt-peachpuff\:10 { color: hsl(28, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20, html.var.auto .sf-c-txt-peachpuff\:20 { color: hsl(28, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30, html.var.auto .sf-c-txt-peachpuff\:30 { color: hsl(28, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40, html.var.auto .sf-c-txt-peachpuff\:40 { color: hsl(28, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50, html.var.auto .sf-c-txt-peachpuff\:50 { color: hsl(28, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60, html.var.auto .sf-c-txt-peachpuff\:60 { color: hsl(28, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70, html.var.auto .sf-c-txt-peachpuff\:70 { color: hsl(28, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80, html.var.auto .sf-c-txt-peachpuff\:80 { color: hsl(28, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90, html.var.auto .sf-c-txt-peachpuff\:90 { color: hsl(28, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100, html.var.auto .sf-c-txt-peachpuff\:100 { color: hsl(28, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:dark, html.auto .sf-c-txt-peachpuff\:dark { color: hsl(28, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0\:dark, html.auto .sf-c-txt-peachpuff\:0\:dark { color: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10\:dark, html.auto .sf-c-txt-peachpuff\:10\:dark { color: hsl(28, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20\:dark, html.auto .sf-c-txt-peachpuff\:20\:dark { color: hsl(28, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30\:dark, html.auto .sf-c-txt-peachpuff\:30\:dark { color: hsl(28, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40\:dark, html.auto .sf-c-txt-peachpuff\:40\:dark { color: hsl(28, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50\:dark, html.auto .sf-c-txt-peachpuff\:50\:dark { color: hsl(28, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60\:dark, html.auto .sf-c-txt-peachpuff\:60\:dark { color: hsl(28, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70\:dark, html.auto .sf-c-txt-peachpuff\:70\:dark { color: hsl(28, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80\:dark, html.auto .sf-c-txt-peachpuff\:80\:dark { color: hsl(28, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90\:dark, html.auto .sf-c-txt-peachpuff\:90\:dark { color: hsl(28, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100\:dark, html.auto .sf-c-txt-peachpuff\:100\:dark { color: hsl(28, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:dark, html.var.auto .sf-c-txt-peachpuff\:dark { color: hsl(28, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0\:dark, html.var.auto .sf-c-txt-peachpuff\:0\:dark { color: hsl(28, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10\:dark, html.var.auto .sf-c-txt-peachpuff\:10\:dark { color: hsl(28, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20\:dark, html.var.auto .sf-c-txt-peachpuff\:20\:dark { color: hsl(28, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30\:dark, html.var.auto .sf-c-txt-peachpuff\:30\:dark { color: hsl(28, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40\:dark, html.var.auto .sf-c-txt-peachpuff\:40\:dark { color: hsl(28, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50\:dark, html.var.auto .sf-c-txt-peachpuff\:50\:dark { color: hsl(28, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60\:dark, html.var.auto .sf-c-txt-peachpuff\:60\:dark { color: hsl(28, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70\:dark, html.var.auto .sf-c-txt-peachpuff\:70\:dark { color: hsl(28, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80\:dark, html.var.auto .sf-c-txt-peachpuff\:80\:dark { color: hsl(28, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90\:dark, html.var.auto .sf-c-txt-peachpuff\:90\:dark { color: hsl(28, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100\:dark, html.var.auto .sf-c-txt-peachpuff\:100\:dark { color: hsl(28, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/peru.css b/src/colors/10/peru.css index 6661121..d3586d7 100644 --- a/src/colors/10/peru.css +++ b/src/colors/10/peru.css @@ -1,4 +1,4 @@ -:root { +[class*='peru'] { --sf-c-peru: 30 59% 53%; --sf-c-peru-0: 30 59% 0%; --sf-c-peru-10: 30 59% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-peru\:100\:dark, html.dark .sf-c-txt-peru\ html.var[data-theme='auto'] .sf-c-peru\:90\:dark, html.var.auto .sf-c-peru\:90\:dark { color: hsl(30, 59%, 90%); background: hsl(30, 59%, 10%) } html.var[data-theme='auto'] .sf-c-peru\:100\:dark, html.var.auto .sf-c-peru\:100\:dark { color: hsl(30, 59%, 90%); background: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru, html.auto .sf-c-txt-peru { color: hsl(30, 59%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:0, html.auto .sf-c-txt-peru\:0 { color: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:10, html.auto .sf-c-txt-peru\:10 { color: hsl(30, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:20, html.auto .sf-c-txt-peru\:20 { color: hsl(30, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:30, html.auto .sf-c-txt-peru\:30 { color: hsl(30, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:40, html.auto .sf-c-txt-peru\:40 { color: hsl(30, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:50, html.auto .sf-c-txt-peru\:50 { color: hsl(30, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:60, html.auto .sf-c-txt-peru\:60 { color: hsl(30, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:70, html.auto .sf-c-txt-peru\:70 { color: hsl(30, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:80, html.auto .sf-c-txt-peru\:80 { color: hsl(30, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:90, html.auto .sf-c-txt-peru\:90 { color: hsl(30, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:100, html.auto .sf-c-txt-peru\:100 { color: hsl(30, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peru, html.var.auto .sf-c-txt-peru { color: hsl(30, 59%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:0, html.var.auto .sf-c-txt-peru\:0 { color: hsl(30, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:10, html.var.auto .sf-c-txt-peru\:10 { color: hsl(30, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:20, html.var.auto .sf-c-txt-peru\:20 { color: hsl(30, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:30, html.var.auto .sf-c-txt-peru\:30 { color: hsl(30, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:40, html.var.auto .sf-c-txt-peru\:40 { color: hsl(30, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:50, html.var.auto .sf-c-txt-peru\:50 { color: hsl(30, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:60, html.var.auto .sf-c-txt-peru\:60 { color: hsl(30, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:70, html.var.auto .sf-c-txt-peru\:70 { color: hsl(30, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:80, html.var.auto .sf-c-txt-peru\:80 { color: hsl(30, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:90, html.var.auto .sf-c-txt-peru\:90 { color: hsl(30, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:100, html.var.auto .sf-c-txt-peru\:100 { color: hsl(30, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:dark, html.auto .sf-c-txt-peru\:dark { color: hsl(30, 59%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:0\:dark, html.auto .sf-c-txt-peru\:0\:dark { color: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:10\:dark, html.auto .sf-c-txt-peru\:10\:dark { color: hsl(30, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:20\:dark, html.auto .sf-c-txt-peru\:20\:dark { color: hsl(30, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:30\:dark, html.auto .sf-c-txt-peru\:30\:dark { color: hsl(30, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:40\:dark, html.auto .sf-c-txt-peru\:40\:dark { color: hsl(30, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:50\:dark, html.auto .sf-c-txt-peru\:50\:dark { color: hsl(30, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:60\:dark, html.auto .sf-c-txt-peru\:60\:dark { color: hsl(30, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:70\:dark, html.auto .sf-c-txt-peru\:70\:dark { color: hsl(30, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:80\:dark, html.auto .sf-c-txt-peru\:80\:dark { color: hsl(30, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:90\:dark, html.auto .sf-c-txt-peru\:90\:dark { color: hsl(30, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:100\:dark, html.auto .sf-c-txt-peru\:100\:dark { color: hsl(30, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:dark, html.var.auto .sf-c-txt-peru\:dark { color: hsl(30, 59%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:0\:dark, html.var.auto .sf-c-txt-peru\:0\:dark { color: hsl(30, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:10\:dark, html.var.auto .sf-c-txt-peru\:10\:dark { color: hsl(30, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:20\:dark, html.var.auto .sf-c-txt-peru\:20\:dark { color: hsl(30, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:30\:dark, html.var.auto .sf-c-txt-peru\:30\:dark { color: hsl(30, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:40\:dark, html.var.auto .sf-c-txt-peru\:40\:dark { color: hsl(30, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:50\:dark, html.var.auto .sf-c-txt-peru\:50\:dark { color: hsl(30, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:60\:dark, html.var.auto .sf-c-txt-peru\:60\:dark { color: hsl(30, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:70\:dark, html.var.auto .sf-c-txt-peru\:70\:dark { color: hsl(30, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:80\:dark, html.var.auto .sf-c-txt-peru\:80\:dark { color: hsl(30, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:90\:dark, html.var.auto .sf-c-txt-peru\:90\:dark { color: hsl(30, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:100\:dark, html.var.auto .sf-c-txt-peru\:100\:dark { color: hsl(30, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/pink.css b/src/colors/10/pink.css index 82736bd..f780c46 100644 --- a/src/colors/10/pink.css +++ b/src/colors/10/pink.css @@ -1,4 +1,4 @@ -:root { +[class*='pink'] { --sf-c-pink: 350 100% 88%; --sf-c-pink-0: 350 100% 0%; --sf-c-pink-10: 350 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-pink\:100\:dark, html.dark .sf-c-txt-pink\ html.var[data-theme='auto'] .sf-c-pink\:90\:dark, html.var.auto .sf-c-pink\:90\:dark { color: hsl(350, 100%, 90%); background: hsl(350, 100%, 10%) } html.var[data-theme='auto'] .sf-c-pink\:100\:dark, html.var.auto .sf-c-pink\:100\:dark { color: hsl(350, 100%, 90%); background: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink, html.auto .sf-c-txt-pink { color: hsl(350, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:0, html.auto .sf-c-txt-pink\:0 { color: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:10, html.auto .sf-c-txt-pink\:10 { color: hsl(350, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:20, html.auto .sf-c-txt-pink\:20 { color: hsl(350, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:30, html.auto .sf-c-txt-pink\:30 { color: hsl(350, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:40, html.auto .sf-c-txt-pink\:40 { color: hsl(350, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:50, html.auto .sf-c-txt-pink\:50 { color: hsl(350, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:60, html.auto .sf-c-txt-pink\:60 { color: hsl(350, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:70, html.auto .sf-c-txt-pink\:70 { color: hsl(350, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:80, html.auto .sf-c-txt-pink\:80 { color: hsl(350, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:90, html.auto .sf-c-txt-pink\:90 { color: hsl(350, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:100, html.auto .sf-c-txt-pink\:100 { color: hsl(350, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-pink, html.var.auto .sf-c-txt-pink { color: hsl(350, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:0, html.var.auto .sf-c-txt-pink\:0 { color: hsl(350, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:10, html.var.auto .sf-c-txt-pink\:10 { color: hsl(350, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:20, html.var.auto .sf-c-txt-pink\:20 { color: hsl(350, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:30, html.var.auto .sf-c-txt-pink\:30 { color: hsl(350, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:40, html.var.auto .sf-c-txt-pink\:40 { color: hsl(350, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:50, html.var.auto .sf-c-txt-pink\:50 { color: hsl(350, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:60, html.var.auto .sf-c-txt-pink\:60 { color: hsl(350, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:70, html.var.auto .sf-c-txt-pink\:70 { color: hsl(350, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:80, html.var.auto .sf-c-txt-pink\:80 { color: hsl(350, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:90, html.var.auto .sf-c-txt-pink\:90 { color: hsl(350, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:100, html.var.auto .sf-c-txt-pink\:100 { color: hsl(350, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:dark, html.auto .sf-c-txt-pink\:dark { color: hsl(350, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:0\:dark, html.auto .sf-c-txt-pink\:0\:dark { color: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:10\:dark, html.auto .sf-c-txt-pink\:10\:dark { color: hsl(350, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:20\:dark, html.auto .sf-c-txt-pink\:20\:dark { color: hsl(350, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:30\:dark, html.auto .sf-c-txt-pink\:30\:dark { color: hsl(350, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:40\:dark, html.auto .sf-c-txt-pink\:40\:dark { color: hsl(350, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:50\:dark, html.auto .sf-c-txt-pink\:50\:dark { color: hsl(350, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:60\:dark, html.auto .sf-c-txt-pink\:60\:dark { color: hsl(350, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:70\:dark, html.auto .sf-c-txt-pink\:70\:dark { color: hsl(350, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:80\:dark, html.auto .sf-c-txt-pink\:80\:dark { color: hsl(350, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:90\:dark, html.auto .sf-c-txt-pink\:90\:dark { color: hsl(350, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:100\:dark, html.auto .sf-c-txt-pink\:100\:dark { color: hsl(350, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:dark, html.var.auto .sf-c-txt-pink\:dark { color: hsl(350, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:0\:dark, html.var.auto .sf-c-txt-pink\:0\:dark { color: hsl(350, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:10\:dark, html.var.auto .sf-c-txt-pink\:10\:dark { color: hsl(350, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:20\:dark, html.var.auto .sf-c-txt-pink\:20\:dark { color: hsl(350, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:30\:dark, html.var.auto .sf-c-txt-pink\:30\:dark { color: hsl(350, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:40\:dark, html.var.auto .sf-c-txt-pink\:40\:dark { color: hsl(350, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:50\:dark, html.var.auto .sf-c-txt-pink\:50\:dark { color: hsl(350, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:60\:dark, html.var.auto .sf-c-txt-pink\:60\:dark { color: hsl(350, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:70\:dark, html.var.auto .sf-c-txt-pink\:70\:dark { color: hsl(350, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:80\:dark, html.var.auto .sf-c-txt-pink\:80\:dark { color: hsl(350, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:90\:dark, html.var.auto .sf-c-txt-pink\:90\:dark { color: hsl(350, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:100\:dark, html.var.auto .sf-c-txt-pink\:100\:dark { color: hsl(350, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/plum.css b/src/colors/10/plum.css index c88a1ea..51aa3e1 100644 --- a/src/colors/10/plum.css +++ b/src/colors/10/plum.css @@ -1,4 +1,4 @@ -:root { +[class*='plum'] { --sf-c-plum: 300 47% 75%; --sf-c-plum-0: 300 47% 0%; --sf-c-plum-10: 300 47% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-plum\:100\:dark, html.dark .sf-c-txt-plum\ html.var[data-theme='auto'] .sf-c-plum\:90\:dark, html.var.auto .sf-c-plum\:90\:dark { color: hsl(300, 47%, 90%); background: hsl(300, 47%, 10%) } html.var[data-theme='auto'] .sf-c-plum\:100\:dark, html.var.auto .sf-c-plum\:100\:dark { color: hsl(300, 47%, 90%); background: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum, html.auto .sf-c-txt-plum { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:0, html.auto .sf-c-txt-plum\:0 { color: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:10, html.auto .sf-c-txt-plum\:10 { color: hsl(300, 47%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:20, html.auto .sf-c-txt-plum\:20 { color: hsl(300, 47%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:30, html.auto .sf-c-txt-plum\:30 { color: hsl(300, 47%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:40, html.auto .sf-c-txt-plum\:40 { color: hsl(300, 47%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:50, html.auto .sf-c-txt-plum\:50 { color: hsl(300, 47%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:60, html.auto .sf-c-txt-plum\:60 { color: hsl(300, 47%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:70, html.auto .sf-c-txt-plum\:70 { color: hsl(300, 47%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:80, html.auto .sf-c-txt-plum\:80 { color: hsl(300, 47%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:90, html.auto .sf-c-txt-plum\:90 { color: hsl(300, 47%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:100, html.auto .sf-c-txt-plum\:100 { color: hsl(300, 47%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-plum, html.var.auto .sf-c-txt-plum { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:0, html.var.auto .sf-c-txt-plum\:0 { color: hsl(300, 47%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:10, html.var.auto .sf-c-txt-plum\:10 { color: hsl(300, 47%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:20, html.var.auto .sf-c-txt-plum\:20 { color: hsl(300, 47%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:30, html.var.auto .sf-c-txt-plum\:30 { color: hsl(300, 47%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:40, html.var.auto .sf-c-txt-plum\:40 { color: hsl(300, 47%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:50, html.var.auto .sf-c-txt-plum\:50 { color: hsl(300, 47%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:60, html.var.auto .sf-c-txt-plum\:60 { color: hsl(300, 47%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:70, html.var.auto .sf-c-txt-plum\:70 { color: hsl(300, 47%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:80, html.var.auto .sf-c-txt-plum\:80 { color: hsl(300, 47%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:90, html.var.auto .sf-c-txt-plum\:90 { color: hsl(300, 47%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:100, html.var.auto .sf-c-txt-plum\:100 { color: hsl(300, 47%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:dark, html.auto .sf-c-txt-plum\:dark { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:0\:dark, html.auto .sf-c-txt-plum\:0\:dark { color: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:10\:dark, html.auto .sf-c-txt-plum\:10\:dark { color: hsl(300, 47%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:20\:dark, html.auto .sf-c-txt-plum\:20\:dark { color: hsl(300, 47%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:30\:dark, html.auto .sf-c-txt-plum\:30\:dark { color: hsl(300, 47%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:40\:dark, html.auto .sf-c-txt-plum\:40\:dark { color: hsl(300, 47%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:50\:dark, html.auto .sf-c-txt-plum\:50\:dark { color: hsl(300, 47%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:60\:dark, html.auto .sf-c-txt-plum\:60\:dark { color: hsl(300, 47%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:70\:dark, html.auto .sf-c-txt-plum\:70\:dark { color: hsl(300, 47%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:80\:dark, html.auto .sf-c-txt-plum\:80\:dark { color: hsl(300, 47%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:90\:dark, html.auto .sf-c-txt-plum\:90\:dark { color: hsl(300, 47%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:100\:dark, html.auto .sf-c-txt-plum\:100\:dark { color: hsl(300, 47%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:dark, html.var.auto .sf-c-txt-plum\:dark { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:0\:dark, html.var.auto .sf-c-txt-plum\:0\:dark { color: hsl(300, 47%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:10\:dark, html.var.auto .sf-c-txt-plum\:10\:dark { color: hsl(300, 47%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:20\:dark, html.var.auto .sf-c-txt-plum\:20\:dark { color: hsl(300, 47%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:30\:dark, html.var.auto .sf-c-txt-plum\:30\:dark { color: hsl(300, 47%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:40\:dark, html.var.auto .sf-c-txt-plum\:40\:dark { color: hsl(300, 47%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:50\:dark, html.var.auto .sf-c-txt-plum\:50\:dark { color: hsl(300, 47%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:60\:dark, html.var.auto .sf-c-txt-plum\:60\:dark { color: hsl(300, 47%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:70\:dark, html.var.auto .sf-c-txt-plum\:70\:dark { color: hsl(300, 47%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:80\:dark, html.var.auto .sf-c-txt-plum\:80\:dark { color: hsl(300, 47%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:90\:dark, html.var.auto .sf-c-txt-plum\:90\:dark { color: hsl(300, 47%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:100\:dark, html.var.auto .sf-c-txt-plum\:100\:dark { color: hsl(300, 47%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/powderblue.css b/src/colors/10/powderblue.css index d134a55..69959cf 100644 --- a/src/colors/10/powderblue.css +++ b/src/colors/10/powderblue.css @@ -1,4 +1,4 @@ -:root { +[class*='powderblue'] { --sf-c-powderblue: 187 52% 80%; --sf-c-powderblue-0: 187 52% 0%; --sf-c-powderblue-10: 187 52% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-powderblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-powderblue\:90\:dark, html.var.auto .sf-c-powderblue\:90\:dark { color: hsl(187, 52%, 90%); background: hsl(187, 52%, 10%) } html.var[data-theme='auto'] .sf-c-powderblue\:100\:dark, html.var.auto .sf-c-powderblue\:100\:dark { color: hsl(187, 52%, 90%); background: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue, html.auto .sf-c-txt-powderblue { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:0, html.auto .sf-c-txt-powderblue\:0 { color: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:10, html.auto .sf-c-txt-powderblue\:10 { color: hsl(187, 52%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:20, html.auto .sf-c-txt-powderblue\:20 { color: hsl(187, 52%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:30, html.auto .sf-c-txt-powderblue\:30 { color: hsl(187, 52%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:40, html.auto .sf-c-txt-powderblue\:40 { color: hsl(187, 52%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:50, html.auto .sf-c-txt-powderblue\:50 { color: hsl(187, 52%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:60, html.auto .sf-c-txt-powderblue\:60 { color: hsl(187, 52%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:70, html.auto .sf-c-txt-powderblue\:70 { color: hsl(187, 52%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:80, html.auto .sf-c-txt-powderblue\:80 { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:90, html.auto .sf-c-txt-powderblue\:90 { color: hsl(187, 52%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:100, html.auto .sf-c-txt-powderblue\:100 { color: hsl(187, 52%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue, html.var.auto .sf-c-txt-powderblue { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:0, html.var.auto .sf-c-txt-powderblue\:0 { color: hsl(187, 52%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:10, html.var.auto .sf-c-txt-powderblue\:10 { color: hsl(187, 52%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:20, html.var.auto .sf-c-txt-powderblue\:20 { color: hsl(187, 52%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:30, html.var.auto .sf-c-txt-powderblue\:30 { color: hsl(187, 52%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:40, html.var.auto .sf-c-txt-powderblue\:40 { color: hsl(187, 52%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:50, html.var.auto .sf-c-txt-powderblue\:50 { color: hsl(187, 52%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:60, html.var.auto .sf-c-txt-powderblue\:60 { color: hsl(187, 52%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:70, html.var.auto .sf-c-txt-powderblue\:70 { color: hsl(187, 52%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:80, html.var.auto .sf-c-txt-powderblue\:80 { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:90, html.var.auto .sf-c-txt-powderblue\:90 { color: hsl(187, 52%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:100, html.var.auto .sf-c-txt-powderblue\:100 { color: hsl(187, 52%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:dark, html.auto .sf-c-txt-powderblue\:dark { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:0\:dark, html.auto .sf-c-txt-powderblue\:0\:dark { color: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:10\:dark, html.auto .sf-c-txt-powderblue\:10\:dark { color: hsl(187, 52%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:20\:dark, html.auto .sf-c-txt-powderblue\:20\:dark { color: hsl(187, 52%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:30\:dark, html.auto .sf-c-txt-powderblue\:30\:dark { color: hsl(187, 52%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:40\:dark, html.auto .sf-c-txt-powderblue\:40\:dark { color: hsl(187, 52%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:50\:dark, html.auto .sf-c-txt-powderblue\:50\:dark { color: hsl(187, 52%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:60\:dark, html.auto .sf-c-txt-powderblue\:60\:dark { color: hsl(187, 52%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:70\:dark, html.auto .sf-c-txt-powderblue\:70\:dark { color: hsl(187, 52%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:80\:dark, html.auto .sf-c-txt-powderblue\:80\:dark { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:90\:dark, html.auto .sf-c-txt-powderblue\:90\:dark { color: hsl(187, 52%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:100\:dark, html.auto .sf-c-txt-powderblue\:100\:dark { color: hsl(187, 52%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:dark, html.var.auto .sf-c-txt-powderblue\:dark { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:0\:dark, html.var.auto .sf-c-txt-powderblue\:0\:dark { color: hsl(187, 52%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:10\:dark, html.var.auto .sf-c-txt-powderblue\:10\:dark { color: hsl(187, 52%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:20\:dark, html.var.auto .sf-c-txt-powderblue\:20\:dark { color: hsl(187, 52%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:30\:dark, html.var.auto .sf-c-txt-powderblue\:30\:dark { color: hsl(187, 52%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:40\:dark, html.var.auto .sf-c-txt-powderblue\:40\:dark { color: hsl(187, 52%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:50\:dark, html.var.auto .sf-c-txt-powderblue\:50\:dark { color: hsl(187, 52%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:60\:dark, html.var.auto .sf-c-txt-powderblue\:60\:dark { color: hsl(187, 52%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:70\:dark, html.var.auto .sf-c-txt-powderblue\:70\:dark { color: hsl(187, 52%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:80\:dark, html.var.auto .sf-c-txt-powderblue\:80\:dark { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:90\:dark, html.var.auto .sf-c-txt-powderblue\:90\:dark { color: hsl(187, 52%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:100\:dark, html.var.auto .sf-c-txt-powderblue\:100\:dark { color: hsl(187, 52%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/purple.css b/src/colors/10/purple.css index c1f1081..d365425 100644 --- a/src/colors/10/purple.css +++ b/src/colors/10/purple.css @@ -1,4 +1,4 @@ -:root { +[class*='purple'] { --sf-c-purple: 300 100% 25%; --sf-c-purple-0: 300 100% 0%; --sf-c-purple-10: 300 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-purple\:100\:dark, html.dark .sf-c-txt-pur html.var[data-theme='auto'] .sf-c-purple\:90\:dark, html.var.auto .sf-c-purple\:90\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 10%) } html.var[data-theme='auto'] .sf-c-purple\:100\:dark, html.var.auto .sf-c-purple\:100\:dark { color: hsl(300, 100%, 90%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple, html.auto .sf-c-txt-purple { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:0, html.auto .sf-c-txt-purple\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:10, html.auto .sf-c-txt-purple\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:20, html.auto .sf-c-txt-purple\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:30, html.auto .sf-c-txt-purple\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:40, html.auto .sf-c-txt-purple\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:50, html.auto .sf-c-txt-purple\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:60, html.auto .sf-c-txt-purple\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:70, html.auto .sf-c-txt-purple\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:80, html.auto .sf-c-txt-purple\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:90, html.auto .sf-c-txt-purple\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:100, html.auto .sf-c-txt-purple\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-purple, html.var.auto .sf-c-txt-purple { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:0, html.var.auto .sf-c-txt-purple\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:10, html.var.auto .sf-c-txt-purple\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:20, html.var.auto .sf-c-txt-purple\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:30, html.var.auto .sf-c-txt-purple\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:40, html.var.auto .sf-c-txt-purple\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:50, html.var.auto .sf-c-txt-purple\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:60, html.var.auto .sf-c-txt-purple\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:70, html.var.auto .sf-c-txt-purple\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:80, html.var.auto .sf-c-txt-purple\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:90, html.var.auto .sf-c-txt-purple\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:100, html.var.auto .sf-c-txt-purple\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:dark, html.auto .sf-c-txt-purple\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark, html.auto .sf-c-txt-purple\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark, html.auto .sf-c-txt-purple\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark, html.auto .sf-c-txt-purple\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark, html.auto .sf-c-txt-purple\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark, html.auto .sf-c-txt-purple\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark, html.auto .sf-c-txt-purple\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark, html.auto .sf-c-txt-purple\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark, html.auto .sf-c-txt-purple\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark, html.auto .sf-c-txt-purple\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark, html.auto .sf-c-txt-purple\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark, html.auto .sf-c-txt-purple\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:dark, html.var.auto .sf-c-txt-purple\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark, html.var.auto .sf-c-txt-purple\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark, html.var.auto .sf-c-txt-purple\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark, html.var.auto .sf-c-txt-purple\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark, html.var.auto .sf-c-txt-purple\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark, html.var.auto .sf-c-txt-purple\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark, html.var.auto .sf-c-txt-purple\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark, html.var.auto .sf-c-txt-purple\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark, html.var.auto .sf-c-txt-purple\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark, html.var.auto .sf-c-txt-purple\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark, html.var.auto .sf-c-txt-purple\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark, html.var.auto .sf-c-txt-purple\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/rebeccapurple.css b/src/colors/10/rebeccapurple.css index df92f9f..c228f00 100644 --- a/src/colors/10/rebeccapurple.css +++ b/src/colors/10/rebeccapurple.css @@ -1,4 +1,4 @@ -:root { +[class*='rebeccapurple'] { --sf-c-rebeccapurple: 270 50% 40%; --sf-c-rebeccapurple-0: 270 50% 0%; --sf-c-rebeccapurple-10: 270 50% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-rebeccapurple\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-rebeccapurple\:90\:dark, html.var.auto .sf-c-rebeccapurple\:90\:dark { color: hsl(270, 50%, 90%); background: hsl(270, 50%, 10%) } html.var[data-theme='auto'] .sf-c-rebeccapurple\:100\:dark, html.var.auto .sf-c-rebeccapurple\:100\:dark { color: hsl(270, 50%, 90%); background: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple, html.auto .sf-c-txt-rebeccapurple { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0, html.auto .sf-c-txt-rebeccapurple\:0 { color: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10, html.auto .sf-c-txt-rebeccapurple\:10 { color: hsl(270, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20, html.auto .sf-c-txt-rebeccapurple\:20 { color: hsl(270, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30, html.auto .sf-c-txt-rebeccapurple\:30 { color: hsl(270, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40, html.auto .sf-c-txt-rebeccapurple\:40 { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50, html.auto .sf-c-txt-rebeccapurple\:50 { color: hsl(270, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60, html.auto .sf-c-txt-rebeccapurple\:60 { color: hsl(270, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70, html.auto .sf-c-txt-rebeccapurple\:70 { color: hsl(270, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80, html.auto .sf-c-txt-rebeccapurple\:80 { color: hsl(270, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90, html.auto .sf-c-txt-rebeccapurple\:90 { color: hsl(270, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100, html.auto .sf-c-txt-rebeccapurple\:100 { color: hsl(270, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple, html.var.auto .sf-c-txt-rebeccapurple { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0, html.var.auto .sf-c-txt-rebeccapurple\:0 { color: hsl(270, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10, html.var.auto .sf-c-txt-rebeccapurple\:10 { color: hsl(270, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20, html.var.auto .sf-c-txt-rebeccapurple\:20 { color: hsl(270, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30, html.var.auto .sf-c-txt-rebeccapurple\:30 { color: hsl(270, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40, html.var.auto .sf-c-txt-rebeccapurple\:40 { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50, html.var.auto .sf-c-txt-rebeccapurple\:50 { color: hsl(270, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60, html.var.auto .sf-c-txt-rebeccapurple\:60 { color: hsl(270, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70, html.var.auto .sf-c-txt-rebeccapurple\:70 { color: hsl(270, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80, html.var.auto .sf-c-txt-rebeccapurple\:80 { color: hsl(270, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90, html.var.auto .sf-c-txt-rebeccapurple\:90 { color: hsl(270, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100, html.var.auto .sf-c-txt-rebeccapurple\:100 { color: hsl(270, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:dark, html.auto .sf-c-txt-rebeccapurple\:dark { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0\:dark, html.auto .sf-c-txt-rebeccapurple\:0\:dark { color: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10\:dark, html.auto .sf-c-txt-rebeccapurple\:10\:dark { color: hsl(270, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20\:dark, html.auto .sf-c-txt-rebeccapurple\:20\:dark { color: hsl(270, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30\:dark, html.auto .sf-c-txt-rebeccapurple\:30\:dark { color: hsl(270, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40\:dark, html.auto .sf-c-txt-rebeccapurple\:40\:dark { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50\:dark, html.auto .sf-c-txt-rebeccapurple\:50\:dark { color: hsl(270, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60\:dark, html.auto .sf-c-txt-rebeccapurple\:60\:dark { color: hsl(270, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70\:dark, html.auto .sf-c-txt-rebeccapurple\:70\:dark { color: hsl(270, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80\:dark, html.auto .sf-c-txt-rebeccapurple\:80\:dark { color: hsl(270, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90\:dark, html.auto .sf-c-txt-rebeccapurple\:90\:dark { color: hsl(270, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100\:dark, html.auto .sf-c-txt-rebeccapurple\:100\:dark { color: hsl(270, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:dark, html.var.auto .sf-c-txt-rebeccapurple\:dark { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0\:dark, html.var.auto .sf-c-txt-rebeccapurple\:0\:dark { color: hsl(270, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10\:dark, html.var.auto .sf-c-txt-rebeccapurple\:10\:dark { color: hsl(270, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20\:dark, html.var.auto .sf-c-txt-rebeccapurple\:20\:dark { color: hsl(270, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30\:dark, html.var.auto .sf-c-txt-rebeccapurple\:30\:dark { color: hsl(270, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40\:dark, html.var.auto .sf-c-txt-rebeccapurple\:40\:dark { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50\:dark, html.var.auto .sf-c-txt-rebeccapurple\:50\:dark { color: hsl(270, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60\:dark, html.var.auto .sf-c-txt-rebeccapurple\:60\:dark { color: hsl(270, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70\:dark, html.var.auto .sf-c-txt-rebeccapurple\:70\:dark { color: hsl(270, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80\:dark, html.var.auto .sf-c-txt-rebeccapurple\:80\:dark { color: hsl(270, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90\:dark, html.var.auto .sf-c-txt-rebeccapurple\:90\:dark { color: hsl(270, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100\:dark, html.var.auto .sf-c-txt-rebeccapurple\:100\:dark { color: hsl(270, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/red.css b/src/colors/10/red.css index ecb330b..3834f69 100644 --- a/src/colors/10/red.css +++ b/src/colors/10/red.css @@ -1,4 +1,4 @@ -:root { +[class*='red'] { --sf-c-red: 0 100% 50%; --sf-c-red-0: 0 100% 0%; --sf-c-red-10: 0 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark, html.dark .sf-c-txt-red\:1 html.var[data-theme='auto'] .sf-c-red\:90\:dark, html.var.auto .sf-c-red\:90\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 10%) } html.var[data-theme='auto'] .sf-c-red\:100\:dark, html.var.auto .sf-c-red\:100\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red, html.auto .sf-c-txt-red { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:0, html.auto .sf-c-txt-red\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red\:10, html.auto .sf-c-txt-red\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-red\:20, html.auto .sf-c-txt-red\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-red\:30, html.auto .sf-c-txt-red\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-red\:40, html.auto .sf-c-txt-red\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-red\:50, html.auto .sf-c-txt-red\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:60, html.auto .sf-c-txt-red\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-red\:70, html.auto .sf-c-txt-red\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-red\:80, html.auto .sf-c-txt-red\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-red\:90, html.auto .sf-c-txt-red\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-red\:100, html.auto .sf-c-txt-red\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-red, html.var.auto .sf-c-txt-red { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:0, html.var.auto .sf-c-txt-red\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-red\:10, html.var.auto .sf-c-txt-red\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-red\:20, html.var.auto .sf-c-txt-red\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-red\:30, html.var.auto .sf-c-txt-red\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-red\:40, html.var.auto .sf-c-txt-red\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-red\:50, html.var.auto .sf-c-txt-red\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:60, html.var.auto .sf-c-txt-red\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-red\:70, html.var.auto .sf-c-txt-red\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-red\:80, html.var.auto .sf-c-txt-red\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-red\:90, html.var.auto .sf-c-txt-red\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-red\:100, html.var.auto .sf-c-txt-red\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-red\:dark, html.auto .sf-c-txt-red\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark, html.auto .sf-c-txt-red\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark, html.auto .sf-c-txt-red\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark, html.auto .sf-c-txt-red\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark, html.auto .sf-c-txt-red\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark, html.auto .sf-c-txt-red\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark, html.auto .sf-c-txt-red\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark, html.auto .sf-c-txt-red\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark, html.auto .sf-c-txt-red\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark, html.auto .sf-c-txt-red\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark, html.auto .sf-c-txt-red\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark, html.auto .sf-c-txt-red\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-red\:dark, html.var.auto .sf-c-txt-red\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark, html.var.auto .sf-c-txt-red\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark, html.var.auto .sf-c-txt-red\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark, html.var.auto .sf-c-txt-red\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark, html.var.auto .sf-c-txt-red\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark, html.var.auto .sf-c-txt-red\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark, html.var.auto .sf-c-txt-red\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark, html.var.auto .sf-c-txt-red\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark, html.var.auto .sf-c-txt-red\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark, html.var.auto .sf-c-txt-red\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark, html.var.auto .sf-c-txt-red\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark, html.var.auto .sf-c-txt-red\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/rosybrown.css b/src/colors/10/rosybrown.css index a8496ce..35b0d53 100644 --- a/src/colors/10/rosybrown.css +++ b/src/colors/10/rosybrown.css @@ -1,4 +1,4 @@ -:root { +[class*='rosybrown'] { --sf-c-rosybrown: 0 25% 65%; --sf-c-rosybrown-0: 0 25% 0%; --sf-c-rosybrown-10: 0 25% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-rosybrown\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-rosybrown\:90\:dark, html.var.auto .sf-c-rosybrown\:90\:dark { color: hsl(0, 25%, 90%); background: hsl(0, 25%, 10%) } html.var[data-theme='auto'] .sf-c-rosybrown\:100\:dark, html.var.auto .sf-c-rosybrown\:100\:dark { color: hsl(0, 25%, 90%); background: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown, html.auto .sf-c-txt-rosybrown { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0, html.auto .sf-c-txt-rosybrown\:0 { color: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10, html.auto .sf-c-txt-rosybrown\:10 { color: hsl(0, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20, html.auto .sf-c-txt-rosybrown\:20 { color: hsl(0, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30, html.auto .sf-c-txt-rosybrown\:30 { color: hsl(0, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40, html.auto .sf-c-txt-rosybrown\:40 { color: hsl(0, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50, html.auto .sf-c-txt-rosybrown\:50 { color: hsl(0, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60, html.auto .sf-c-txt-rosybrown\:60 { color: hsl(0, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70, html.auto .sf-c-txt-rosybrown\:70 { color: hsl(0, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80, html.auto .sf-c-txt-rosybrown\:80 { color: hsl(0, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90, html.auto .sf-c-txt-rosybrown\:90 { color: hsl(0, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100, html.auto .sf-c-txt-rosybrown\:100 { color: hsl(0, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown, html.var.auto .sf-c-txt-rosybrown { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0, html.var.auto .sf-c-txt-rosybrown\:0 { color: hsl(0, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10, html.var.auto .sf-c-txt-rosybrown\:10 { color: hsl(0, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20, html.var.auto .sf-c-txt-rosybrown\:20 { color: hsl(0, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30, html.var.auto .sf-c-txt-rosybrown\:30 { color: hsl(0, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40, html.var.auto .sf-c-txt-rosybrown\:40 { color: hsl(0, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50, html.var.auto .sf-c-txt-rosybrown\:50 { color: hsl(0, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60, html.var.auto .sf-c-txt-rosybrown\:60 { color: hsl(0, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70, html.var.auto .sf-c-txt-rosybrown\:70 { color: hsl(0, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80, html.var.auto .sf-c-txt-rosybrown\:80 { color: hsl(0, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90, html.var.auto .sf-c-txt-rosybrown\:90 { color: hsl(0, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100, html.var.auto .sf-c-txt-rosybrown\:100 { color: hsl(0, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:dark, html.auto .sf-c-txt-rosybrown\:dark { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0\:dark, html.auto .sf-c-txt-rosybrown\:0\:dark { color: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10\:dark, html.auto .sf-c-txt-rosybrown\:10\:dark { color: hsl(0, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20\:dark, html.auto .sf-c-txt-rosybrown\:20\:dark { color: hsl(0, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30\:dark, html.auto .sf-c-txt-rosybrown\:30\:dark { color: hsl(0, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40\:dark, html.auto .sf-c-txt-rosybrown\:40\:dark { color: hsl(0, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50\:dark, html.auto .sf-c-txt-rosybrown\:50\:dark { color: hsl(0, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60\:dark, html.auto .sf-c-txt-rosybrown\:60\:dark { color: hsl(0, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70\:dark, html.auto .sf-c-txt-rosybrown\:70\:dark { color: hsl(0, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80\:dark, html.auto .sf-c-txt-rosybrown\:80\:dark { color: hsl(0, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90\:dark, html.auto .sf-c-txt-rosybrown\:90\:dark { color: hsl(0, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100\:dark, html.auto .sf-c-txt-rosybrown\:100\:dark { color: hsl(0, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:dark, html.var.auto .sf-c-txt-rosybrown\:dark { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0\:dark, html.var.auto .sf-c-txt-rosybrown\:0\:dark { color: hsl(0, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10\:dark, html.var.auto .sf-c-txt-rosybrown\:10\:dark { color: hsl(0, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20\:dark, html.var.auto .sf-c-txt-rosybrown\:20\:dark { color: hsl(0, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30\:dark, html.var.auto .sf-c-txt-rosybrown\:30\:dark { color: hsl(0, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40\:dark, html.var.auto .sf-c-txt-rosybrown\:40\:dark { color: hsl(0, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50\:dark, html.var.auto .sf-c-txt-rosybrown\:50\:dark { color: hsl(0, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60\:dark, html.var.auto .sf-c-txt-rosybrown\:60\:dark { color: hsl(0, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70\:dark, html.var.auto .sf-c-txt-rosybrown\:70\:dark { color: hsl(0, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80\:dark, html.var.auto .sf-c-txt-rosybrown\:80\:dark { color: hsl(0, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90\:dark, html.var.auto .sf-c-txt-rosybrown\:90\:dark { color: hsl(0, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100\:dark, html.var.auto .sf-c-txt-rosybrown\:100\:dark { color: hsl(0, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/royalblue.css b/src/colors/10/royalblue.css index abbad09..6c76942 100644 --- a/src/colors/10/royalblue.css +++ b/src/colors/10/royalblue.css @@ -1,4 +1,4 @@ -:root { +[class*='royalblue'] { --sf-c-royalblue: 225 73% 57%; --sf-c-royalblue-0: 225 73% 0%; --sf-c-royalblue-10: 225 73% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-royalblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-royalblue\:90\:dark, html.var.auto .sf-c-royalblue\:90\:dark { color: hsl(225, 73%, 90%); background: hsl(225, 73%, 10%) } html.var[data-theme='auto'] .sf-c-royalblue\:100\:dark, html.var.auto .sf-c-royalblue\:100\:dark { color: hsl(225, 73%, 90%); background: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue, html.auto .sf-c-txt-royalblue { color: hsl(225, 73%, 57%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:0, html.auto .sf-c-txt-royalblue\:0 { color: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:10, html.auto .sf-c-txt-royalblue\:10 { color: hsl(225, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:20, html.auto .sf-c-txt-royalblue\:20 { color: hsl(225, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:30, html.auto .sf-c-txt-royalblue\:30 { color: hsl(225, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:40, html.auto .sf-c-txt-royalblue\:40 { color: hsl(225, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:50, html.auto .sf-c-txt-royalblue\:50 { color: hsl(225, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:60, html.auto .sf-c-txt-royalblue\:60 { color: hsl(225, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:70, html.auto .sf-c-txt-royalblue\:70 { color: hsl(225, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:80, html.auto .sf-c-txt-royalblue\:80 { color: hsl(225, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:90, html.auto .sf-c-txt-royalblue\:90 { color: hsl(225, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:100, html.auto .sf-c-txt-royalblue\:100 { color: hsl(225, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue, html.var.auto .sf-c-txt-royalblue { color: hsl(225, 73%, 57%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:0, html.var.auto .sf-c-txt-royalblue\:0 { color: hsl(225, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:10, html.var.auto .sf-c-txt-royalblue\:10 { color: hsl(225, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:20, html.var.auto .sf-c-txt-royalblue\:20 { color: hsl(225, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:30, html.var.auto .sf-c-txt-royalblue\:30 { color: hsl(225, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:40, html.var.auto .sf-c-txt-royalblue\:40 { color: hsl(225, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:50, html.var.auto .sf-c-txt-royalblue\:50 { color: hsl(225, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:60, html.var.auto .sf-c-txt-royalblue\:60 { color: hsl(225, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:70, html.var.auto .sf-c-txt-royalblue\:70 { color: hsl(225, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:80, html.var.auto .sf-c-txt-royalblue\:80 { color: hsl(225, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:90, html.var.auto .sf-c-txt-royalblue\:90 { color: hsl(225, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:100, html.var.auto .sf-c-txt-royalblue\:100 { color: hsl(225, 73%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:dark, html.auto .sf-c-txt-royalblue\:dark { color: hsl(225, 73%, 57%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:0\:dark, html.auto .sf-c-txt-royalblue\:0\:dark { color: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:10\:dark, html.auto .sf-c-txt-royalblue\:10\:dark { color: hsl(225, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:20\:dark, html.auto .sf-c-txt-royalblue\:20\:dark { color: hsl(225, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:30\:dark, html.auto .sf-c-txt-royalblue\:30\:dark { color: hsl(225, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:40\:dark, html.auto .sf-c-txt-royalblue\:40\:dark { color: hsl(225, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:50\:dark, html.auto .sf-c-txt-royalblue\:50\:dark { color: hsl(225, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:60\:dark, html.auto .sf-c-txt-royalblue\:60\:dark { color: hsl(225, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:70\:dark, html.auto .sf-c-txt-royalblue\:70\:dark { color: hsl(225, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:80\:dark, html.auto .sf-c-txt-royalblue\:80\:dark { color: hsl(225, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:90\:dark, html.auto .sf-c-txt-royalblue\:90\:dark { color: hsl(225, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:100\:dark, html.auto .sf-c-txt-royalblue\:100\:dark { color: hsl(225, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:dark, html.var.auto .sf-c-txt-royalblue\:dark { color: hsl(225, 73%, 57%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:0\:dark, html.var.auto .sf-c-txt-royalblue\:0\:dark { color: hsl(225, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:10\:dark, html.var.auto .sf-c-txt-royalblue\:10\:dark { color: hsl(225, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:20\:dark, html.var.auto .sf-c-txt-royalblue\:20\:dark { color: hsl(225, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:30\:dark, html.var.auto .sf-c-txt-royalblue\:30\:dark { color: hsl(225, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:40\:dark, html.var.auto .sf-c-txt-royalblue\:40\:dark { color: hsl(225, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:50\:dark, html.var.auto .sf-c-txt-royalblue\:50\:dark { color: hsl(225, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:60\:dark, html.var.auto .sf-c-txt-royalblue\:60\:dark { color: hsl(225, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:70\:dark, html.var.auto .sf-c-txt-royalblue\:70\:dark { color: hsl(225, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:80\:dark, html.var.auto .sf-c-txt-royalblue\:80\:dark { color: hsl(225, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:90\:dark, html.var.auto .sf-c-txt-royalblue\:90\:dark { color: hsl(225, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:100\:dark, html.var.auto .sf-c-txt-royalblue\:100\:dark { color: hsl(225, 73%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/saddlebrown.css b/src/colors/10/saddlebrown.css index 9781fe8..918d16d 100644 --- a/src/colors/10/saddlebrown.css +++ b/src/colors/10/saddlebrown.css @@ -1,4 +1,4 @@ -:root { +[class*='saddlebrown'] { --sf-c-saddlebrown: 25 76% 31%; --sf-c-saddlebrown-0: 25 76% 0%; --sf-c-saddlebrown-10: 25 76% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-saddlebrown\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-saddlebrown\:90\:dark, html.var.auto .sf-c-saddlebrown\:90\:dark { color: hsl(25, 76%, 90%); background: hsl(25, 76%, 10%) } html.var[data-theme='auto'] .sf-c-saddlebrown\:100\:dark, html.var.auto .sf-c-saddlebrown\:100\:dark { color: hsl(25, 76%, 90%); background: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown, html.auto .sf-c-txt-saddlebrown { color: hsl(25, 76%, 31%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0, html.auto .sf-c-txt-saddlebrown\:0 { color: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10, html.auto .sf-c-txt-saddlebrown\:10 { color: hsl(25, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20, html.auto .sf-c-txt-saddlebrown\:20 { color: hsl(25, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30, html.auto .sf-c-txt-saddlebrown\:30 { color: hsl(25, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40, html.auto .sf-c-txt-saddlebrown\:40 { color: hsl(25, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50, html.auto .sf-c-txt-saddlebrown\:50 { color: hsl(25, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60, html.auto .sf-c-txt-saddlebrown\:60 { color: hsl(25, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70, html.auto .sf-c-txt-saddlebrown\:70 { color: hsl(25, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80, html.auto .sf-c-txt-saddlebrown\:80 { color: hsl(25, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90, html.auto .sf-c-txt-saddlebrown\:90 { color: hsl(25, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100, html.auto .sf-c-txt-saddlebrown\:100 { color: hsl(25, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown, html.var.auto .sf-c-txt-saddlebrown { color: hsl(25, 76%, 31%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0, html.var.auto .sf-c-txt-saddlebrown\:0 { color: hsl(25, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10, html.var.auto .sf-c-txt-saddlebrown\:10 { color: hsl(25, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20, html.var.auto .sf-c-txt-saddlebrown\:20 { color: hsl(25, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30, html.var.auto .sf-c-txt-saddlebrown\:30 { color: hsl(25, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40, html.var.auto .sf-c-txt-saddlebrown\:40 { color: hsl(25, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50, html.var.auto .sf-c-txt-saddlebrown\:50 { color: hsl(25, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60, html.var.auto .sf-c-txt-saddlebrown\:60 { color: hsl(25, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70, html.var.auto .sf-c-txt-saddlebrown\:70 { color: hsl(25, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80, html.var.auto .sf-c-txt-saddlebrown\:80 { color: hsl(25, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90, html.var.auto .sf-c-txt-saddlebrown\:90 { color: hsl(25, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100, html.var.auto .sf-c-txt-saddlebrown\:100 { color: hsl(25, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:dark, html.auto .sf-c-txt-saddlebrown\:dark { color: hsl(25, 76%, 31%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0\:dark, html.auto .sf-c-txt-saddlebrown\:0\:dark { color: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10\:dark, html.auto .sf-c-txt-saddlebrown\:10\:dark { color: hsl(25, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20\:dark, html.auto .sf-c-txt-saddlebrown\:20\:dark { color: hsl(25, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30\:dark, html.auto .sf-c-txt-saddlebrown\:30\:dark { color: hsl(25, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40\:dark, html.auto .sf-c-txt-saddlebrown\:40\:dark { color: hsl(25, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50\:dark, html.auto .sf-c-txt-saddlebrown\:50\:dark { color: hsl(25, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60\:dark, html.auto .sf-c-txt-saddlebrown\:60\:dark { color: hsl(25, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70\:dark, html.auto .sf-c-txt-saddlebrown\:70\:dark { color: hsl(25, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80\:dark, html.auto .sf-c-txt-saddlebrown\:80\:dark { color: hsl(25, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90\:dark, html.auto .sf-c-txt-saddlebrown\:90\:dark { color: hsl(25, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100\:dark, html.auto .sf-c-txt-saddlebrown\:100\:dark { color: hsl(25, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:dark, html.var.auto .sf-c-txt-saddlebrown\:dark { color: hsl(25, 76%, 31%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0\:dark, html.var.auto .sf-c-txt-saddlebrown\:0\:dark { color: hsl(25, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10\:dark, html.var.auto .sf-c-txt-saddlebrown\:10\:dark { color: hsl(25, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20\:dark, html.var.auto .sf-c-txt-saddlebrown\:20\:dark { color: hsl(25, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30\:dark, html.var.auto .sf-c-txt-saddlebrown\:30\:dark { color: hsl(25, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40\:dark, html.var.auto .sf-c-txt-saddlebrown\:40\:dark { color: hsl(25, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50\:dark, html.var.auto .sf-c-txt-saddlebrown\:50\:dark { color: hsl(25, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60\:dark, html.var.auto .sf-c-txt-saddlebrown\:60\:dark { color: hsl(25, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70\:dark, html.var.auto .sf-c-txt-saddlebrown\:70\:dark { color: hsl(25, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80\:dark, html.var.auto .sf-c-txt-saddlebrown\:80\:dark { color: hsl(25, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90\:dark, html.var.auto .sf-c-txt-saddlebrown\:90\:dark { color: hsl(25, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100\:dark, html.var.auto .sf-c-txt-saddlebrown\:100\:dark { color: hsl(25, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/salmon.css b/src/colors/10/salmon.css index 2b5d6f0..3939792 100644 --- a/src/colors/10/salmon.css +++ b/src/colors/10/salmon.css @@ -1,4 +1,4 @@ -:root { +[class*='salmon'] { --sf-c-salmon: 6 93% 71%; --sf-c-salmon-0: 6 93% 0%; --sf-c-salmon-10: 6 93% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-salmon\:100\:dark, html.dark .sf-c-txt-sal html.var[data-theme='auto'] .sf-c-salmon\:90\:dark, html.var.auto .sf-c-salmon\:90\:dark { color: hsl(6, 93%, 90%); background: hsl(6, 93%, 10%) } html.var[data-theme='auto'] .sf-c-salmon\:100\:dark, html.var.auto .sf-c-salmon\:100\:dark { color: hsl(6, 93%, 90%); background: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon, html.auto .sf-c-txt-salmon { color: hsl(6, 93%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:0, html.auto .sf-c-txt-salmon\:0 { color: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:10, html.auto .sf-c-txt-salmon\:10 { color: hsl(6, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:20, html.auto .sf-c-txt-salmon\:20 { color: hsl(6, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:30, html.auto .sf-c-txt-salmon\:30 { color: hsl(6, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:40, html.auto .sf-c-txt-salmon\:40 { color: hsl(6, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:50, html.auto .sf-c-txt-salmon\:50 { color: hsl(6, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:60, html.auto .sf-c-txt-salmon\:60 { color: hsl(6, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:70, html.auto .sf-c-txt-salmon\:70 { color: hsl(6, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:80, html.auto .sf-c-txt-salmon\:80 { color: hsl(6, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:90, html.auto .sf-c-txt-salmon\:90 { color: hsl(6, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:100, html.auto .sf-c-txt-salmon\:100 { color: hsl(6, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-salmon, html.var.auto .sf-c-txt-salmon { color: hsl(6, 93%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:0, html.var.auto .sf-c-txt-salmon\:0 { color: hsl(6, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:10, html.var.auto .sf-c-txt-salmon\:10 { color: hsl(6, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:20, html.var.auto .sf-c-txt-salmon\:20 { color: hsl(6, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:30, html.var.auto .sf-c-txt-salmon\:30 { color: hsl(6, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:40, html.var.auto .sf-c-txt-salmon\:40 { color: hsl(6, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:50, html.var.auto .sf-c-txt-salmon\:50 { color: hsl(6, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:60, html.var.auto .sf-c-txt-salmon\:60 { color: hsl(6, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:70, html.var.auto .sf-c-txt-salmon\:70 { color: hsl(6, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:80, html.var.auto .sf-c-txt-salmon\:80 { color: hsl(6, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:90, html.var.auto .sf-c-txt-salmon\:90 { color: hsl(6, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:100, html.var.auto .sf-c-txt-salmon\:100 { color: hsl(6, 93%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:dark, html.auto .sf-c-txt-salmon\:dark { color: hsl(6, 93%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:0\:dark, html.auto .sf-c-txt-salmon\:0\:dark { color: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:10\:dark, html.auto .sf-c-txt-salmon\:10\:dark { color: hsl(6, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:20\:dark, html.auto .sf-c-txt-salmon\:20\:dark { color: hsl(6, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:30\:dark, html.auto .sf-c-txt-salmon\:30\:dark { color: hsl(6, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:40\:dark, html.auto .sf-c-txt-salmon\:40\:dark { color: hsl(6, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:50\:dark, html.auto .sf-c-txt-salmon\:50\:dark { color: hsl(6, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:60\:dark, html.auto .sf-c-txt-salmon\:60\:dark { color: hsl(6, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:70\:dark, html.auto .sf-c-txt-salmon\:70\:dark { color: hsl(6, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:80\:dark, html.auto .sf-c-txt-salmon\:80\:dark { color: hsl(6, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:90\:dark, html.auto .sf-c-txt-salmon\:90\:dark { color: hsl(6, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:100\:dark, html.auto .sf-c-txt-salmon\:100\:dark { color: hsl(6, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:dark, html.var.auto .sf-c-txt-salmon\:dark { color: hsl(6, 93%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:0\:dark, html.var.auto .sf-c-txt-salmon\:0\:dark { color: hsl(6, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:10\:dark, html.var.auto .sf-c-txt-salmon\:10\:dark { color: hsl(6, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:20\:dark, html.var.auto .sf-c-txt-salmon\:20\:dark { color: hsl(6, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:30\:dark, html.var.auto .sf-c-txt-salmon\:30\:dark { color: hsl(6, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:40\:dark, html.var.auto .sf-c-txt-salmon\:40\:dark { color: hsl(6, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:50\:dark, html.var.auto .sf-c-txt-salmon\:50\:dark { color: hsl(6, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:60\:dark, html.var.auto .sf-c-txt-salmon\:60\:dark { color: hsl(6, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:70\:dark, html.var.auto .sf-c-txt-salmon\:70\:dark { color: hsl(6, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:80\:dark, html.var.auto .sf-c-txt-salmon\:80\:dark { color: hsl(6, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:90\:dark, html.var.auto .sf-c-txt-salmon\:90\:dark { color: hsl(6, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:100\:dark, html.var.auto .sf-c-txt-salmon\:100\:dark { color: hsl(6, 93%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/sandybrown.css b/src/colors/10/sandybrown.css index 7df6088..2df6e65 100644 --- a/src/colors/10/sandybrown.css +++ b/src/colors/10/sandybrown.css @@ -1,4 +1,4 @@ -:root { +[class*='sandybrown'] { --sf-c-sandybrown: 28 87% 67%; --sf-c-sandybrown-0: 28 87% 0%; --sf-c-sandybrown-10: 28 87% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-sandybrown\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-sandybrown\:90\:dark, html.var.auto .sf-c-sandybrown\:90\:dark { color: hsl(28, 87%, 90%); background: hsl(28, 87%, 10%) } html.var[data-theme='auto'] .sf-c-sandybrown\:100\:dark, html.var.auto .sf-c-sandybrown\:100\:dark { color: hsl(28, 87%, 90%); background: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown, html.auto .sf-c-txt-sandybrown { color: hsl(28, 87%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0, html.auto .sf-c-txt-sandybrown\:0 { color: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10, html.auto .sf-c-txt-sandybrown\:10 { color: hsl(28, 87%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20, html.auto .sf-c-txt-sandybrown\:20 { color: hsl(28, 87%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30, html.auto .sf-c-txt-sandybrown\:30 { color: hsl(28, 87%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40, html.auto .sf-c-txt-sandybrown\:40 { color: hsl(28, 87%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50, html.auto .sf-c-txt-sandybrown\:50 { color: hsl(28, 87%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60, html.auto .sf-c-txt-sandybrown\:60 { color: hsl(28, 87%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70, html.auto .sf-c-txt-sandybrown\:70 { color: hsl(28, 87%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80, html.auto .sf-c-txt-sandybrown\:80 { color: hsl(28, 87%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90, html.auto .sf-c-txt-sandybrown\:90 { color: hsl(28, 87%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100, html.auto .sf-c-txt-sandybrown\:100 { color: hsl(28, 87%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown, html.var.auto .sf-c-txt-sandybrown { color: hsl(28, 87%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0, html.var.auto .sf-c-txt-sandybrown\:0 { color: hsl(28, 87%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10, html.var.auto .sf-c-txt-sandybrown\:10 { color: hsl(28, 87%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20, html.var.auto .sf-c-txt-sandybrown\:20 { color: hsl(28, 87%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30, html.var.auto .sf-c-txt-sandybrown\:30 { color: hsl(28, 87%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40, html.var.auto .sf-c-txt-sandybrown\:40 { color: hsl(28, 87%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50, html.var.auto .sf-c-txt-sandybrown\:50 { color: hsl(28, 87%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60, html.var.auto .sf-c-txt-sandybrown\:60 { color: hsl(28, 87%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70, html.var.auto .sf-c-txt-sandybrown\:70 { color: hsl(28, 87%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80, html.var.auto .sf-c-txt-sandybrown\:80 { color: hsl(28, 87%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90, html.var.auto .sf-c-txt-sandybrown\:90 { color: hsl(28, 87%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100, html.var.auto .sf-c-txt-sandybrown\:100 { color: hsl(28, 87%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:dark, html.auto .sf-c-txt-sandybrown\:dark { color: hsl(28, 87%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0\:dark, html.auto .sf-c-txt-sandybrown\:0\:dark { color: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10\:dark, html.auto .sf-c-txt-sandybrown\:10\:dark { color: hsl(28, 87%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20\:dark, html.auto .sf-c-txt-sandybrown\:20\:dark { color: hsl(28, 87%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30\:dark, html.auto .sf-c-txt-sandybrown\:30\:dark { color: hsl(28, 87%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40\:dark, html.auto .sf-c-txt-sandybrown\:40\:dark { color: hsl(28, 87%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50\:dark, html.auto .sf-c-txt-sandybrown\:50\:dark { color: hsl(28, 87%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60\:dark, html.auto .sf-c-txt-sandybrown\:60\:dark { color: hsl(28, 87%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70\:dark, html.auto .sf-c-txt-sandybrown\:70\:dark { color: hsl(28, 87%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80\:dark, html.auto .sf-c-txt-sandybrown\:80\:dark { color: hsl(28, 87%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90\:dark, html.auto .sf-c-txt-sandybrown\:90\:dark { color: hsl(28, 87%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100\:dark, html.auto .sf-c-txt-sandybrown\:100\:dark { color: hsl(28, 87%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:dark, html.var.auto .sf-c-txt-sandybrown\:dark { color: hsl(28, 87%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0\:dark, html.var.auto .sf-c-txt-sandybrown\:0\:dark { color: hsl(28, 87%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10\:dark, html.var.auto .sf-c-txt-sandybrown\:10\:dark { color: hsl(28, 87%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20\:dark, html.var.auto .sf-c-txt-sandybrown\:20\:dark { color: hsl(28, 87%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30\:dark, html.var.auto .sf-c-txt-sandybrown\:30\:dark { color: hsl(28, 87%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40\:dark, html.var.auto .sf-c-txt-sandybrown\:40\:dark { color: hsl(28, 87%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50\:dark, html.var.auto .sf-c-txt-sandybrown\:50\:dark { color: hsl(28, 87%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60\:dark, html.var.auto .sf-c-txt-sandybrown\:60\:dark { color: hsl(28, 87%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70\:dark, html.var.auto .sf-c-txt-sandybrown\:70\:dark { color: hsl(28, 87%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80\:dark, html.var.auto .sf-c-txt-sandybrown\:80\:dark { color: hsl(28, 87%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90\:dark, html.var.auto .sf-c-txt-sandybrown\:90\:dark { color: hsl(28, 87%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100\:dark, html.var.auto .sf-c-txt-sandybrown\:100\:dark { color: hsl(28, 87%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/seagreen.css b/src/colors/10/seagreen.css index 221c2ba..f6f71fc 100644 --- a/src/colors/10/seagreen.css +++ b/src/colors/10/seagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='seagreen'] { --sf-c-seagreen: 146 50% 36%; --sf-c-seagreen-0: 146 50% 0%; --sf-c-seagreen-10: 146 50% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-seagreen\:100\:dark, html.dark .sf-c-txt-s html.var[data-theme='auto'] .sf-c-seagreen\:90\:dark, html.var.auto .sf-c-seagreen\:90\:dark { color: hsl(146, 50%, 90%); background: hsl(146, 50%, 10%) } html.var[data-theme='auto'] .sf-c-seagreen\:100\:dark, html.var.auto .sf-c-seagreen\:100\:dark { color: hsl(146, 50%, 90%); background: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen, html.auto .sf-c-txt-seagreen { color: hsl(146, 50%, 36%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:0, html.auto .sf-c-txt-seagreen\:0 { color: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:10, html.auto .sf-c-txt-seagreen\:10 { color: hsl(146, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:20, html.auto .sf-c-txt-seagreen\:20 { color: hsl(146, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:30, html.auto .sf-c-txt-seagreen\:30 { color: hsl(146, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:40, html.auto .sf-c-txt-seagreen\:40 { color: hsl(146, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:50, html.auto .sf-c-txt-seagreen\:50 { color: hsl(146, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:60, html.auto .sf-c-txt-seagreen\:60 { color: hsl(146, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:70, html.auto .sf-c-txt-seagreen\:70 { color: hsl(146, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:80, html.auto .sf-c-txt-seagreen\:80 { color: hsl(146, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:90, html.auto .sf-c-txt-seagreen\:90 { color: hsl(146, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:100, html.auto .sf-c-txt-seagreen\:100 { color: hsl(146, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen, html.var.auto .sf-c-txt-seagreen { color: hsl(146, 50%, 36%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:0, html.var.auto .sf-c-txt-seagreen\:0 { color: hsl(146, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:10, html.var.auto .sf-c-txt-seagreen\:10 { color: hsl(146, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:20, html.var.auto .sf-c-txt-seagreen\:20 { color: hsl(146, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:30, html.var.auto .sf-c-txt-seagreen\:30 { color: hsl(146, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:40, html.var.auto .sf-c-txt-seagreen\:40 { color: hsl(146, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:50, html.var.auto .sf-c-txt-seagreen\:50 { color: hsl(146, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:60, html.var.auto .sf-c-txt-seagreen\:60 { color: hsl(146, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:70, html.var.auto .sf-c-txt-seagreen\:70 { color: hsl(146, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:80, html.var.auto .sf-c-txt-seagreen\:80 { color: hsl(146, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:90, html.var.auto .sf-c-txt-seagreen\:90 { color: hsl(146, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:100, html.var.auto .sf-c-txt-seagreen\:100 { color: hsl(146, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:dark, html.auto .sf-c-txt-seagreen\:dark { color: hsl(146, 50%, 36%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:0\:dark, html.auto .sf-c-txt-seagreen\:0\:dark { color: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:10\:dark, html.auto .sf-c-txt-seagreen\:10\:dark { color: hsl(146, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:20\:dark, html.auto .sf-c-txt-seagreen\:20\:dark { color: hsl(146, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:30\:dark, html.auto .sf-c-txt-seagreen\:30\:dark { color: hsl(146, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:40\:dark, html.auto .sf-c-txt-seagreen\:40\:dark { color: hsl(146, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:50\:dark, html.auto .sf-c-txt-seagreen\:50\:dark { color: hsl(146, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:60\:dark, html.auto .sf-c-txt-seagreen\:60\:dark { color: hsl(146, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:70\:dark, html.auto .sf-c-txt-seagreen\:70\:dark { color: hsl(146, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:80\:dark, html.auto .sf-c-txt-seagreen\:80\:dark { color: hsl(146, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:90\:dark, html.auto .sf-c-txt-seagreen\:90\:dark { color: hsl(146, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:100\:dark, html.auto .sf-c-txt-seagreen\:100\:dark { color: hsl(146, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:dark, html.var.auto .sf-c-txt-seagreen\:dark { color: hsl(146, 50%, 36%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:0\:dark, html.var.auto .sf-c-txt-seagreen\:0\:dark { color: hsl(146, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:10\:dark, html.var.auto .sf-c-txt-seagreen\:10\:dark { color: hsl(146, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:20\:dark, html.var.auto .sf-c-txt-seagreen\:20\:dark { color: hsl(146, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:30\:dark, html.var.auto .sf-c-txt-seagreen\:30\:dark { color: hsl(146, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:40\:dark, html.var.auto .sf-c-txt-seagreen\:40\:dark { color: hsl(146, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:50\:dark, html.var.auto .sf-c-txt-seagreen\:50\:dark { color: hsl(146, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:60\:dark, html.var.auto .sf-c-txt-seagreen\:60\:dark { color: hsl(146, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:70\:dark, html.var.auto .sf-c-txt-seagreen\:70\:dark { color: hsl(146, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:80\:dark, html.var.auto .sf-c-txt-seagreen\:80\:dark { color: hsl(146, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:90\:dark, html.var.auto .sf-c-txt-seagreen\:90\:dark { color: hsl(146, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:100\:dark, html.var.auto .sf-c-txt-seagreen\:100\:dark { color: hsl(146, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/seashell.css b/src/colors/10/seashell.css index 22fb182..00d3857 100644 --- a/src/colors/10/seashell.css +++ b/src/colors/10/seashell.css @@ -1,4 +1,4 @@ -:root { +[class*='seashell'] { --sf-c-seashell: 25 100% 97%; --sf-c-seashell-0: 25 100% 0%; --sf-c-seashell-10: 25 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-seashell\:100\:dark, html.dark .sf-c-txt-s html.var[data-theme='auto'] .sf-c-seashell\:90\:dark, html.var.auto .sf-c-seashell\:90\:dark { color: hsl(25, 100%, 90%); background: hsl(25, 100%, 10%) } html.var[data-theme='auto'] .sf-c-seashell\:100\:dark, html.var.auto .sf-c-seashell\:100\:dark { color: hsl(25, 100%, 90%); background: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell, html.auto .sf-c-txt-seashell { color: hsl(25, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:0, html.auto .sf-c-txt-seashell\:0 { color: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:10, html.auto .sf-c-txt-seashell\:10 { color: hsl(25, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:20, html.auto .sf-c-txt-seashell\:20 { color: hsl(25, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:30, html.auto .sf-c-txt-seashell\:30 { color: hsl(25, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:40, html.auto .sf-c-txt-seashell\:40 { color: hsl(25, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:50, html.auto .sf-c-txt-seashell\:50 { color: hsl(25, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:60, html.auto .sf-c-txt-seashell\:60 { color: hsl(25, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:70, html.auto .sf-c-txt-seashell\:70 { color: hsl(25, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:80, html.auto .sf-c-txt-seashell\:80 { color: hsl(25, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:90, html.auto .sf-c-txt-seashell\:90 { color: hsl(25, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:100, html.auto .sf-c-txt-seashell\:100 { color: hsl(25, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seashell, html.var.auto .sf-c-txt-seashell { color: hsl(25, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:0, html.var.auto .sf-c-txt-seashell\:0 { color: hsl(25, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:10, html.var.auto .sf-c-txt-seashell\:10 { color: hsl(25, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:20, html.var.auto .sf-c-txt-seashell\:20 { color: hsl(25, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:30, html.var.auto .sf-c-txt-seashell\:30 { color: hsl(25, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:40, html.var.auto .sf-c-txt-seashell\:40 { color: hsl(25, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:50, html.var.auto .sf-c-txt-seashell\:50 { color: hsl(25, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:60, html.var.auto .sf-c-txt-seashell\:60 { color: hsl(25, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:70, html.var.auto .sf-c-txt-seashell\:70 { color: hsl(25, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:80, html.var.auto .sf-c-txt-seashell\:80 { color: hsl(25, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:90, html.var.auto .sf-c-txt-seashell\:90 { color: hsl(25, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:100, html.var.auto .sf-c-txt-seashell\:100 { color: hsl(25, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:dark, html.auto .sf-c-txt-seashell\:dark { color: hsl(25, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:0\:dark, html.auto .sf-c-txt-seashell\:0\:dark { color: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:10\:dark, html.auto .sf-c-txt-seashell\:10\:dark { color: hsl(25, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:20\:dark, html.auto .sf-c-txt-seashell\:20\:dark { color: hsl(25, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:30\:dark, html.auto .sf-c-txt-seashell\:30\:dark { color: hsl(25, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:40\:dark, html.auto .sf-c-txt-seashell\:40\:dark { color: hsl(25, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:50\:dark, html.auto .sf-c-txt-seashell\:50\:dark { color: hsl(25, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:60\:dark, html.auto .sf-c-txt-seashell\:60\:dark { color: hsl(25, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:70\:dark, html.auto .sf-c-txt-seashell\:70\:dark { color: hsl(25, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:80\:dark, html.auto .sf-c-txt-seashell\:80\:dark { color: hsl(25, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:90\:dark, html.auto .sf-c-txt-seashell\:90\:dark { color: hsl(25, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:100\:dark, html.auto .sf-c-txt-seashell\:100\:dark { color: hsl(25, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:dark, html.var.auto .sf-c-txt-seashell\:dark { color: hsl(25, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:0\:dark, html.var.auto .sf-c-txt-seashell\:0\:dark { color: hsl(25, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:10\:dark, html.var.auto .sf-c-txt-seashell\:10\:dark { color: hsl(25, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:20\:dark, html.var.auto .sf-c-txt-seashell\:20\:dark { color: hsl(25, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:30\:dark, html.var.auto .sf-c-txt-seashell\:30\:dark { color: hsl(25, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:40\:dark, html.var.auto .sf-c-txt-seashell\:40\:dark { color: hsl(25, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:50\:dark, html.var.auto .sf-c-txt-seashell\:50\:dark { color: hsl(25, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:60\:dark, html.var.auto .sf-c-txt-seashell\:60\:dark { color: hsl(25, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:70\:dark, html.var.auto .sf-c-txt-seashell\:70\:dark { color: hsl(25, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:80\:dark, html.var.auto .sf-c-txt-seashell\:80\:dark { color: hsl(25, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:90\:dark, html.var.auto .sf-c-txt-seashell\:90\:dark { color: hsl(25, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:100\:dark, html.var.auto .sf-c-txt-seashell\:100\:dark { color: hsl(25, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/sienna.css b/src/colors/10/sienna.css index c307820..b49ad3b 100644 --- a/src/colors/10/sienna.css +++ b/src/colors/10/sienna.css @@ -1,4 +1,4 @@ -:root { +[class*='sienna'] { --sf-c-sienna: 19 56% 40%; --sf-c-sienna-0: 19 56% 0%; --sf-c-sienna-10: 19 56% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-sienna\:100\:dark, html.dark .sf-c-txt-sie html.var[data-theme='auto'] .sf-c-sienna\:90\:dark, html.var.auto .sf-c-sienna\:90\:dark { color: hsl(19, 56%, 90%); background: hsl(19, 56%, 10%) } html.var[data-theme='auto'] .sf-c-sienna\:100\:dark, html.var.auto .sf-c-sienna\:100\:dark { color: hsl(19, 56%, 90%); background: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna, html.auto .sf-c-txt-sienna { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:0, html.auto .sf-c-txt-sienna\:0 { color: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:10, html.auto .sf-c-txt-sienna\:10 { color: hsl(19, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:20, html.auto .sf-c-txt-sienna\:20 { color: hsl(19, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:30, html.auto .sf-c-txt-sienna\:30 { color: hsl(19, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:40, html.auto .sf-c-txt-sienna\:40 { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:50, html.auto .sf-c-txt-sienna\:50 { color: hsl(19, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:60, html.auto .sf-c-txt-sienna\:60 { color: hsl(19, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:70, html.auto .sf-c-txt-sienna\:70 { color: hsl(19, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:80, html.auto .sf-c-txt-sienna\:80 { color: hsl(19, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:90, html.auto .sf-c-txt-sienna\:90 { color: hsl(19, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:100, html.auto .sf-c-txt-sienna\:100 { color: hsl(19, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sienna, html.var.auto .sf-c-txt-sienna { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:0, html.var.auto .sf-c-txt-sienna\:0 { color: hsl(19, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:10, html.var.auto .sf-c-txt-sienna\:10 { color: hsl(19, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:20, html.var.auto .sf-c-txt-sienna\:20 { color: hsl(19, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:30, html.var.auto .sf-c-txt-sienna\:30 { color: hsl(19, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:40, html.var.auto .sf-c-txt-sienna\:40 { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:50, html.var.auto .sf-c-txt-sienna\:50 { color: hsl(19, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:60, html.var.auto .sf-c-txt-sienna\:60 { color: hsl(19, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:70, html.var.auto .sf-c-txt-sienna\:70 { color: hsl(19, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:80, html.var.auto .sf-c-txt-sienna\:80 { color: hsl(19, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:90, html.var.auto .sf-c-txt-sienna\:90 { color: hsl(19, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:100, html.var.auto .sf-c-txt-sienna\:100 { color: hsl(19, 56%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:dark, html.auto .sf-c-txt-sienna\:dark { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:0\:dark, html.auto .sf-c-txt-sienna\:0\:dark { color: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:10\:dark, html.auto .sf-c-txt-sienna\:10\:dark { color: hsl(19, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:20\:dark, html.auto .sf-c-txt-sienna\:20\:dark { color: hsl(19, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:30\:dark, html.auto .sf-c-txt-sienna\:30\:dark { color: hsl(19, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:40\:dark, html.auto .sf-c-txt-sienna\:40\:dark { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:50\:dark, html.auto .sf-c-txt-sienna\:50\:dark { color: hsl(19, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:60\:dark, html.auto .sf-c-txt-sienna\:60\:dark { color: hsl(19, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:70\:dark, html.auto .sf-c-txt-sienna\:70\:dark { color: hsl(19, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:80\:dark, html.auto .sf-c-txt-sienna\:80\:dark { color: hsl(19, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:90\:dark, html.auto .sf-c-txt-sienna\:90\:dark { color: hsl(19, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:100\:dark, html.auto .sf-c-txt-sienna\:100\:dark { color: hsl(19, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:dark, html.var.auto .sf-c-txt-sienna\:dark { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:0\:dark, html.var.auto .sf-c-txt-sienna\:0\:dark { color: hsl(19, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:10\:dark, html.var.auto .sf-c-txt-sienna\:10\:dark { color: hsl(19, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:20\:dark, html.var.auto .sf-c-txt-sienna\:20\:dark { color: hsl(19, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:30\:dark, html.var.auto .sf-c-txt-sienna\:30\:dark { color: hsl(19, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:40\:dark, html.var.auto .sf-c-txt-sienna\:40\:dark { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:50\:dark, html.var.auto .sf-c-txt-sienna\:50\:dark { color: hsl(19, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:60\:dark, html.var.auto .sf-c-txt-sienna\:60\:dark { color: hsl(19, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:70\:dark, html.var.auto .sf-c-txt-sienna\:70\:dark { color: hsl(19, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:80\:dark, html.var.auto .sf-c-txt-sienna\:80\:dark { color: hsl(19, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:90\:dark, html.var.auto .sf-c-txt-sienna\:90\:dark { color: hsl(19, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:100\:dark, html.var.auto .sf-c-txt-sienna\:100\:dark { color: hsl(19, 56%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/silver.css b/src/colors/10/silver.css index 3cad68e..1490c2e 100644 --- a/src/colors/10/silver.css +++ b/src/colors/10/silver.css @@ -1,4 +1,4 @@ -:root { +[class*='silver'] { --sf-c-silver: 0 0% 75%; --sf-c-silver-0: 0 0% 0%; --sf-c-silver-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-silver\:100\:dark, html.dark .sf-c-txt-sil html.var[data-theme='auto'] .sf-c-silver\:90\:dark, html.var.auto .sf-c-silver\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-silver\:100\:dark, html.var.auto .sf-c-silver\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver, html.auto .sf-c-txt-silver { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:0, html.auto .sf-c-txt-silver\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:10, html.auto .sf-c-txt-silver\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:20, html.auto .sf-c-txt-silver\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:30, html.auto .sf-c-txt-silver\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:40, html.auto .sf-c-txt-silver\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:50, html.auto .sf-c-txt-silver\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:60, html.auto .sf-c-txt-silver\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:70, html.auto .sf-c-txt-silver\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:80, html.auto .sf-c-txt-silver\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:90, html.auto .sf-c-txt-silver\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:100, html.auto .sf-c-txt-silver\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-silver, html.var.auto .sf-c-txt-silver { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:0, html.var.auto .sf-c-txt-silver\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:10, html.var.auto .sf-c-txt-silver\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:20, html.var.auto .sf-c-txt-silver\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:30, html.var.auto .sf-c-txt-silver\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:40, html.var.auto .sf-c-txt-silver\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:50, html.var.auto .sf-c-txt-silver\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:60, html.var.auto .sf-c-txt-silver\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:70, html.var.auto .sf-c-txt-silver\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:80, html.var.auto .sf-c-txt-silver\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:90, html.var.auto .sf-c-txt-silver\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:100, html.var.auto .sf-c-txt-silver\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:dark, html.auto .sf-c-txt-silver\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark, html.auto .sf-c-txt-silver\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark, html.auto .sf-c-txt-silver\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark, html.auto .sf-c-txt-silver\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark, html.auto .sf-c-txt-silver\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark, html.auto .sf-c-txt-silver\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark, html.auto .sf-c-txt-silver\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark, html.auto .sf-c-txt-silver\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark, html.auto .sf-c-txt-silver\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark, html.auto .sf-c-txt-silver\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark, html.auto .sf-c-txt-silver\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark, html.auto .sf-c-txt-silver\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:dark, html.var.auto .sf-c-txt-silver\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark, html.var.auto .sf-c-txt-silver\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark, html.var.auto .sf-c-txt-silver\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark, html.var.auto .sf-c-txt-silver\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark, html.var.auto .sf-c-txt-silver\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark, html.var.auto .sf-c-txt-silver\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark, html.var.auto .sf-c-txt-silver\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark, html.var.auto .sf-c-txt-silver\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark, html.var.auto .sf-c-txt-silver\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark, html.var.auto .sf-c-txt-silver\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark, html.var.auto .sf-c-txt-silver\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark, html.var.auto .sf-c-txt-silver\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/skyblue.css b/src/colors/10/skyblue.css index e6367a2..7234e85 100644 --- a/src/colors/10/skyblue.css +++ b/src/colors/10/skyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='skyblue'] { --sf-c-skyblue: 197 71% 73%; --sf-c-skyblue-0: 197 71% 0%; --sf-c-skyblue-10: 197 71% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark, html.dark .sf-c-txt-sk html.var[data-theme='auto'] .sf-c-skyblue\:90\:dark, html.var.auto .sf-c-skyblue\:90\:dark { color: hsl(197, 71%, 90%); background: hsl(197, 71%, 10%) } html.var[data-theme='auto'] .sf-c-skyblue\:100\:dark, html.var.auto .sf-c-skyblue\:100\:dark { color: hsl(197, 71%, 90%); background: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue, html.auto .sf-c-txt-skyblue { color: hsl(197, 71%, 73%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:0, html.auto .sf-c-txt-skyblue\:0 { color: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:10, html.auto .sf-c-txt-skyblue\:10 { color: hsl(197, 71%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:20, html.auto .sf-c-txt-skyblue\:20 { color: hsl(197, 71%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:30, html.auto .sf-c-txt-skyblue\:30 { color: hsl(197, 71%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:40, html.auto .sf-c-txt-skyblue\:40 { color: hsl(197, 71%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:50, html.auto .sf-c-txt-skyblue\:50 { color: hsl(197, 71%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:60, html.auto .sf-c-txt-skyblue\:60 { color: hsl(197, 71%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:70, html.auto .sf-c-txt-skyblue\:70 { color: hsl(197, 71%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:80, html.auto .sf-c-txt-skyblue\:80 { color: hsl(197, 71%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:90, html.auto .sf-c-txt-skyblue\:90 { color: hsl(197, 71%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:100, html.auto .sf-c-txt-skyblue\:100 { color: hsl(197, 71%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue, html.var.auto .sf-c-txt-skyblue { color: hsl(197, 71%, 73%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:0, html.var.auto .sf-c-txt-skyblue\:0 { color: hsl(197, 71%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:10, html.var.auto .sf-c-txt-skyblue\:10 { color: hsl(197, 71%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:20, html.var.auto .sf-c-txt-skyblue\:20 { color: hsl(197, 71%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:30, html.var.auto .sf-c-txt-skyblue\:30 { color: hsl(197, 71%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:40, html.var.auto .sf-c-txt-skyblue\:40 { color: hsl(197, 71%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:50, html.var.auto .sf-c-txt-skyblue\:50 { color: hsl(197, 71%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:60, html.var.auto .sf-c-txt-skyblue\:60 { color: hsl(197, 71%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:70, html.var.auto .sf-c-txt-skyblue\:70 { color: hsl(197, 71%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:80, html.var.auto .sf-c-txt-skyblue\:80 { color: hsl(197, 71%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:90, html.var.auto .sf-c-txt-skyblue\:90 { color: hsl(197, 71%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:100, html.var.auto .sf-c-txt-skyblue\:100 { color: hsl(197, 71%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark, html.auto .sf-c-txt-skyblue\:dark { color: hsl(197, 71%, 73%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark, html.auto .sf-c-txt-skyblue\:0\:dark { color: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark, html.auto .sf-c-txt-skyblue\:10\:dark { color: hsl(197, 71%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark, html.auto .sf-c-txt-skyblue\:20\:dark { color: hsl(197, 71%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark, html.auto .sf-c-txt-skyblue\:30\:dark { color: hsl(197, 71%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark, html.auto .sf-c-txt-skyblue\:40\:dark { color: hsl(197, 71%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark, html.auto .sf-c-txt-skyblue\:50\:dark { color: hsl(197, 71%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark, html.auto .sf-c-txt-skyblue\:60\:dark { color: hsl(197, 71%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark, html.auto .sf-c-txt-skyblue\:70\:dark { color: hsl(197, 71%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark, html.auto .sf-c-txt-skyblue\:80\:dark { color: hsl(197, 71%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark, html.auto .sf-c-txt-skyblue\:90\:dark { color: hsl(197, 71%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark, html.auto .sf-c-txt-skyblue\:100\:dark { color: hsl(197, 71%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark, html.var.auto .sf-c-txt-skyblue\:dark { color: hsl(197, 71%, 73%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark, html.var.auto .sf-c-txt-skyblue\:0\:dark { color: hsl(197, 71%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark, html.var.auto .sf-c-txt-skyblue\:10\:dark { color: hsl(197, 71%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark, html.var.auto .sf-c-txt-skyblue\:20\:dark { color: hsl(197, 71%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark, html.var.auto .sf-c-txt-skyblue\:30\:dark { color: hsl(197, 71%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark, html.var.auto .sf-c-txt-skyblue\:40\:dark { color: hsl(197, 71%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark, html.var.auto .sf-c-txt-skyblue\:50\:dark { color: hsl(197, 71%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark, html.var.auto .sf-c-txt-skyblue\:60\:dark { color: hsl(197, 71%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark, html.var.auto .sf-c-txt-skyblue\:70\:dark { color: hsl(197, 71%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark, html.var.auto .sf-c-txt-skyblue\:80\:dark { color: hsl(197, 71%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark, html.var.auto .sf-c-txt-skyblue\:90\:dark { color: hsl(197, 71%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark, html.var.auto .sf-c-txt-skyblue\:100\:dark { color: hsl(197, 71%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/slateblue.css b/src/colors/10/slateblue.css index baf504a..5c016ae 100644 --- a/src/colors/10/slateblue.css +++ b/src/colors/10/slateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='slateblue'] { --sf-c-slateblue: 248 53% 58%; --sf-c-slateblue-0: 248 53% 0%; --sf-c-slateblue-10: 248 53% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-slateblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slateblue\:90\:dark, html.var.auto .sf-c-slateblue\:90\:dark { color: hsl(248, 53%, 90%); background: hsl(248, 53%, 10%) } html.var[data-theme='auto'] .sf-c-slateblue\:100\:dark, html.var.auto .sf-c-slateblue\:100\:dark { color: hsl(248, 53%, 90%); background: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue, html.auto .sf-c-txt-slateblue { color: hsl(248, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:0, html.auto .sf-c-txt-slateblue\:0 { color: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:10, html.auto .sf-c-txt-slateblue\:10 { color: hsl(248, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:20, html.auto .sf-c-txt-slateblue\:20 { color: hsl(248, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:30, html.auto .sf-c-txt-slateblue\:30 { color: hsl(248, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:40, html.auto .sf-c-txt-slateblue\:40 { color: hsl(248, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:50, html.auto .sf-c-txt-slateblue\:50 { color: hsl(248, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:60, html.auto .sf-c-txt-slateblue\:60 { color: hsl(248, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:70, html.auto .sf-c-txt-slateblue\:70 { color: hsl(248, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:80, html.auto .sf-c-txt-slateblue\:80 { color: hsl(248, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:90, html.auto .sf-c-txt-slateblue\:90 { color: hsl(248, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:100, html.auto .sf-c-txt-slateblue\:100 { color: hsl(248, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue, html.var.auto .sf-c-txt-slateblue { color: hsl(248, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:0, html.var.auto .sf-c-txt-slateblue\:0 { color: hsl(248, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:10, html.var.auto .sf-c-txt-slateblue\:10 { color: hsl(248, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:20, html.var.auto .sf-c-txt-slateblue\:20 { color: hsl(248, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:30, html.var.auto .sf-c-txt-slateblue\:30 { color: hsl(248, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:40, html.var.auto .sf-c-txt-slateblue\:40 { color: hsl(248, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:50, html.var.auto .sf-c-txt-slateblue\:50 { color: hsl(248, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:60, html.var.auto .sf-c-txt-slateblue\:60 { color: hsl(248, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:70, html.var.auto .sf-c-txt-slateblue\:70 { color: hsl(248, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:80, html.var.auto .sf-c-txt-slateblue\:80 { color: hsl(248, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:90, html.var.auto .sf-c-txt-slateblue\:90 { color: hsl(248, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:100, html.var.auto .sf-c-txt-slateblue\:100 { color: hsl(248, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:dark, html.auto .sf-c-txt-slateblue\:dark { color: hsl(248, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:0\:dark, html.auto .sf-c-txt-slateblue\:0\:dark { color: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:10\:dark, html.auto .sf-c-txt-slateblue\:10\:dark { color: hsl(248, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:20\:dark, html.auto .sf-c-txt-slateblue\:20\:dark { color: hsl(248, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:30\:dark, html.auto .sf-c-txt-slateblue\:30\:dark { color: hsl(248, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:40\:dark, html.auto .sf-c-txt-slateblue\:40\:dark { color: hsl(248, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:50\:dark, html.auto .sf-c-txt-slateblue\:50\:dark { color: hsl(248, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:60\:dark, html.auto .sf-c-txt-slateblue\:60\:dark { color: hsl(248, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:70\:dark, html.auto .sf-c-txt-slateblue\:70\:dark { color: hsl(248, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:80\:dark, html.auto .sf-c-txt-slateblue\:80\:dark { color: hsl(248, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:90\:dark, html.auto .sf-c-txt-slateblue\:90\:dark { color: hsl(248, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:100\:dark, html.auto .sf-c-txt-slateblue\:100\:dark { color: hsl(248, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:dark, html.var.auto .sf-c-txt-slateblue\:dark { color: hsl(248, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:0\:dark, html.var.auto .sf-c-txt-slateblue\:0\:dark { color: hsl(248, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:10\:dark, html.var.auto .sf-c-txt-slateblue\:10\:dark { color: hsl(248, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:20\:dark, html.var.auto .sf-c-txt-slateblue\:20\:dark { color: hsl(248, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:30\:dark, html.var.auto .sf-c-txt-slateblue\:30\:dark { color: hsl(248, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:40\:dark, html.var.auto .sf-c-txt-slateblue\:40\:dark { color: hsl(248, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:50\:dark, html.var.auto .sf-c-txt-slateblue\:50\:dark { color: hsl(248, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:60\:dark, html.var.auto .sf-c-txt-slateblue\:60\:dark { color: hsl(248, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:70\:dark, html.var.auto .sf-c-txt-slateblue\:70\:dark { color: hsl(248, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:80\:dark, html.var.auto .sf-c-txt-slateblue\:80\:dark { color: hsl(248, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:90\:dark, html.var.auto .sf-c-txt-slateblue\:90\:dark { color: hsl(248, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:100\:dark, html.var.auto .sf-c-txt-slateblue\:100\:dark { color: hsl(248, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/slategray.css b/src/colors/10/slategray.css index 52d83cd..27eee9e 100644 --- a/src/colors/10/slategray.css +++ b/src/colors/10/slategray.css @@ -1,4 +1,4 @@ -:root { +[class*='slategray'] { --sf-c-slategray: 210 13% 50%; --sf-c-slategray-0: 210 13% 0%; --sf-c-slategray-10: 210 13% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-slategray\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slategray\:90\:dark, html.var.auto .sf-c-slategray\:90\:dark { color: hsl(210, 13%, 90%); background: hsl(210, 13%, 10%) } html.var[data-theme='auto'] .sf-c-slategray\:100\:dark, html.var.auto .sf-c-slategray\:100\:dark { color: hsl(210, 13%, 90%); background: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray, html.auto .sf-c-txt-slategray { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:0, html.auto .sf-c-txt-slategray\:0 { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:10, html.auto .sf-c-txt-slategray\:10 { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:20, html.auto .sf-c-txt-slategray\:20 { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:30, html.auto .sf-c-txt-slategray\:30 { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:40, html.auto .sf-c-txt-slategray\:40 { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:50, html.auto .sf-c-txt-slategray\:50 { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:60, html.auto .sf-c-txt-slategray\:60 { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:70, html.auto .sf-c-txt-slategray\:70 { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:80, html.auto .sf-c-txt-slategray\:80 { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:90, html.auto .sf-c-txt-slategray\:90 { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:100, html.auto .sf-c-txt-slategray\:100 { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategray, html.var.auto .sf-c-txt-slategray { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:0, html.var.auto .sf-c-txt-slategray\:0 { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:10, html.var.auto .sf-c-txt-slategray\:10 { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:20, html.var.auto .sf-c-txt-slategray\:20 { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:30, html.var.auto .sf-c-txt-slategray\:30 { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:40, html.var.auto .sf-c-txt-slategray\:40 { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:50, html.var.auto .sf-c-txt-slategray\:50 { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:60, html.var.auto .sf-c-txt-slategray\:60 { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:70, html.var.auto .sf-c-txt-slategray\:70 { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:80, html.var.auto .sf-c-txt-slategray\:80 { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:90, html.var.auto .sf-c-txt-slategray\:90 { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:100, html.var.auto .sf-c-txt-slategray\:100 { color: hsl(210, 13%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:dark, html.auto .sf-c-txt-slategray\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:0\:dark, html.auto .sf-c-txt-slategray\:0\:dark { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:10\:dark, html.auto .sf-c-txt-slategray\:10\:dark { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:20\:dark, html.auto .sf-c-txt-slategray\:20\:dark { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:30\:dark, html.auto .sf-c-txt-slategray\:30\:dark { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:40\:dark, html.auto .sf-c-txt-slategray\:40\:dark { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:50\:dark, html.auto .sf-c-txt-slategray\:50\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:60\:dark, html.auto .sf-c-txt-slategray\:60\:dark { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:70\:dark, html.auto .sf-c-txt-slategray\:70\:dark { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:80\:dark, html.auto .sf-c-txt-slategray\:80\:dark { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:90\:dark, html.auto .sf-c-txt-slategray\:90\:dark { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:100\:dark, html.auto .sf-c-txt-slategray\:100\:dark { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:dark, html.var.auto .sf-c-txt-slategray\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:0\:dark, html.var.auto .sf-c-txt-slategray\:0\:dark { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:10\:dark, html.var.auto .sf-c-txt-slategray\:10\:dark { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:20\:dark, html.var.auto .sf-c-txt-slategray\:20\:dark { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:30\:dark, html.var.auto .sf-c-txt-slategray\:30\:dark { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:40\:dark, html.var.auto .sf-c-txt-slategray\:40\:dark { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:50\:dark, html.var.auto .sf-c-txt-slategray\:50\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:60\:dark, html.var.auto .sf-c-txt-slategray\:60\:dark { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:70\:dark, html.var.auto .sf-c-txt-slategray\:70\:dark { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:80\:dark, html.var.auto .sf-c-txt-slategray\:80\:dark { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:90\:dark, html.var.auto .sf-c-txt-slategray\:90\:dark { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:100\:dark, html.var.auto .sf-c-txt-slategray\:100\:dark { color: hsl(210, 13%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/slategrey.css b/src/colors/10/slategrey.css index fed6e8d..2893b3e 100644 --- a/src/colors/10/slategrey.css +++ b/src/colors/10/slategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='slategrey'] { --sf-c-slategrey: 210 13% 50%; --sf-c-slategrey-0: 210 13% 0%; --sf-c-slategrey-10: 210 13% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-slategrey\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slategrey\:90\:dark, html.var.auto .sf-c-slategrey\:90\:dark { color: hsl(210, 13%, 90%); background: hsl(210, 13%, 10%) } html.var[data-theme='auto'] .sf-c-slategrey\:100\:dark, html.var.auto .sf-c-slategrey\:100\:dark { color: hsl(210, 13%, 90%); background: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey, html.auto .sf-c-txt-slategrey { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:0, html.auto .sf-c-txt-slategrey\:0 { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:10, html.auto .sf-c-txt-slategrey\:10 { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:20, html.auto .sf-c-txt-slategrey\:20 { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:30, html.auto .sf-c-txt-slategrey\:30 { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:40, html.auto .sf-c-txt-slategrey\:40 { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:50, html.auto .sf-c-txt-slategrey\:50 { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:60, html.auto .sf-c-txt-slategrey\:60 { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:70, html.auto .sf-c-txt-slategrey\:70 { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:80, html.auto .sf-c-txt-slategrey\:80 { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:90, html.auto .sf-c-txt-slategrey\:90 { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:100, html.auto .sf-c-txt-slategrey\:100 { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey, html.var.auto .sf-c-txt-slategrey { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:0, html.var.auto .sf-c-txt-slategrey\:0 { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:10, html.var.auto .sf-c-txt-slategrey\:10 { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:20, html.var.auto .sf-c-txt-slategrey\:20 { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:30, html.var.auto .sf-c-txt-slategrey\:30 { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:40, html.var.auto .sf-c-txt-slategrey\:40 { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:50, html.var.auto .sf-c-txt-slategrey\:50 { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:60, html.var.auto .sf-c-txt-slategrey\:60 { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:70, html.var.auto .sf-c-txt-slategrey\:70 { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:80, html.var.auto .sf-c-txt-slategrey\:80 { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:90, html.var.auto .sf-c-txt-slategrey\:90 { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:100, html.var.auto .sf-c-txt-slategrey\:100 { color: hsl(210, 13%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:dark, html.auto .sf-c-txt-slategrey\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:0\:dark, html.auto .sf-c-txt-slategrey\:0\:dark { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:10\:dark, html.auto .sf-c-txt-slategrey\:10\:dark { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:20\:dark, html.auto .sf-c-txt-slategrey\:20\:dark { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:30\:dark, html.auto .sf-c-txt-slategrey\:30\:dark { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:40\:dark, html.auto .sf-c-txt-slategrey\:40\:dark { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:50\:dark, html.auto .sf-c-txt-slategrey\:50\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:60\:dark, html.auto .sf-c-txt-slategrey\:60\:dark { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:70\:dark, html.auto .sf-c-txt-slategrey\:70\:dark { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:80\:dark, html.auto .sf-c-txt-slategrey\:80\:dark { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:90\:dark, html.auto .sf-c-txt-slategrey\:90\:dark { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:100\:dark, html.auto .sf-c-txt-slategrey\:100\:dark { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:dark, html.var.auto .sf-c-txt-slategrey\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:0\:dark, html.var.auto .sf-c-txt-slategrey\:0\:dark { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:10\:dark, html.var.auto .sf-c-txt-slategrey\:10\:dark { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:20\:dark, html.var.auto .sf-c-txt-slategrey\:20\:dark { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:30\:dark, html.var.auto .sf-c-txt-slategrey\:30\:dark { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:40\:dark, html.var.auto .sf-c-txt-slategrey\:40\:dark { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:50\:dark, html.var.auto .sf-c-txt-slategrey\:50\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:60\:dark, html.var.auto .sf-c-txt-slategrey\:60\:dark { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:70\:dark, html.var.auto .sf-c-txt-slategrey\:70\:dark { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:80\:dark, html.var.auto .sf-c-txt-slategrey\:80\:dark { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:90\:dark, html.var.auto .sf-c-txt-slategrey\:90\:dark { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:100\:dark, html.var.auto .sf-c-txt-slategrey\:100\:dark { color: hsl(210, 13%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/snow.css b/src/colors/10/snow.css index 3a01c70..5eb788b 100644 --- a/src/colors/10/snow.css +++ b/src/colors/10/snow.css @@ -1,4 +1,4 @@ -:root { +[class*='snow'] { --sf-c-snow: 0 100% 99%; --sf-c-snow-0: 0 100% 0%; --sf-c-snow-10: 0 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-snow\:100\:dark, html.dark .sf-c-txt-snow\ html.var[data-theme='auto'] .sf-c-snow\:90\:dark, html.var.auto .sf-c-snow\:90\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 10%) } html.var[data-theme='auto'] .sf-c-snow\:100\:dark, html.var.auto .sf-c-snow\:100\:dark { color: hsl(0, 100%, 90%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow, html.auto .sf-c-txt-snow { color: hsl(0, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:0, html.auto .sf-c-txt-snow\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:10, html.auto .sf-c-txt-snow\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:20, html.auto .sf-c-txt-snow\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:30, html.auto .sf-c-txt-snow\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:40, html.auto .sf-c-txt-snow\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:50, html.auto .sf-c-txt-snow\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:60, html.auto .sf-c-txt-snow\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:70, html.auto .sf-c-txt-snow\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:80, html.auto .sf-c-txt-snow\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:90, html.auto .sf-c-txt-snow\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:100, html.auto .sf-c-txt-snow\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-snow, html.var.auto .sf-c-txt-snow { color: hsl(0, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:0, html.var.auto .sf-c-txt-snow\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:10, html.var.auto .sf-c-txt-snow\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:20, html.var.auto .sf-c-txt-snow\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:30, html.var.auto .sf-c-txt-snow\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:40, html.var.auto .sf-c-txt-snow\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:50, html.var.auto .sf-c-txt-snow\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:60, html.var.auto .sf-c-txt-snow\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:70, html.var.auto .sf-c-txt-snow\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:80, html.var.auto .sf-c-txt-snow\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:90, html.var.auto .sf-c-txt-snow\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:100, html.var.auto .sf-c-txt-snow\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:dark, html.auto .sf-c-txt-snow\:dark { color: hsl(0, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:0\:dark, html.auto .sf-c-txt-snow\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:10\:dark, html.auto .sf-c-txt-snow\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:20\:dark, html.auto .sf-c-txt-snow\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:30\:dark, html.auto .sf-c-txt-snow\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:40\:dark, html.auto .sf-c-txt-snow\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:50\:dark, html.auto .sf-c-txt-snow\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:60\:dark, html.auto .sf-c-txt-snow\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:70\:dark, html.auto .sf-c-txt-snow\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:80\:dark, html.auto .sf-c-txt-snow\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:90\:dark, html.auto .sf-c-txt-snow\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:100\:dark, html.auto .sf-c-txt-snow\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:dark, html.var.auto .sf-c-txt-snow\:dark { color: hsl(0, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:0\:dark, html.var.auto .sf-c-txt-snow\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:10\:dark, html.var.auto .sf-c-txt-snow\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:20\:dark, html.var.auto .sf-c-txt-snow\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:30\:dark, html.var.auto .sf-c-txt-snow\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:40\:dark, html.var.auto .sf-c-txt-snow\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:50\:dark, html.var.auto .sf-c-txt-snow\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:60\:dark, html.var.auto .sf-c-txt-snow\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:70\:dark, html.var.auto .sf-c-txt-snow\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:80\:dark, html.var.auto .sf-c-txt-snow\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:90\:dark, html.var.auto .sf-c-txt-snow\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:100\:dark, html.var.auto .sf-c-txt-snow\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/springgreen.css b/src/colors/10/springgreen.css index 2b08d97..0fbe46a 100644 --- a/src/colors/10/springgreen.css +++ b/src/colors/10/springgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='springgreen'] { --sf-c-springgreen: 150 100% 50%; --sf-c-springgreen-0: 150 100% 0%; --sf-c-springgreen-10: 150 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-springgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-springgreen\:90\:dark, html.var.auto .sf-c-springgreen\:90\:dark { color: hsl(150, 100%, 90%); background: hsl(150, 100%, 10%) } html.var[data-theme='auto'] .sf-c-springgreen\:100\:dark, html.var.auto .sf-c-springgreen\:100\:dark { color: hsl(150, 100%, 90%); background: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen, html.auto .sf-c-txt-springgreen { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:0, html.auto .sf-c-txt-springgreen\:0 { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:10, html.auto .sf-c-txt-springgreen\:10 { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:20, html.auto .sf-c-txt-springgreen\:20 { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:30, html.auto .sf-c-txt-springgreen\:30 { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:40, html.auto .sf-c-txt-springgreen\:40 { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:50, html.auto .sf-c-txt-springgreen\:50 { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:60, html.auto .sf-c-txt-springgreen\:60 { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:70, html.auto .sf-c-txt-springgreen\:70 { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:80, html.auto .sf-c-txt-springgreen\:80 { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:90, html.auto .sf-c-txt-springgreen\:90 { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:100, html.auto .sf-c-txt-springgreen\:100 { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen, html.var.auto .sf-c-txt-springgreen { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:0, html.var.auto .sf-c-txt-springgreen\:0 { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:10, html.var.auto .sf-c-txt-springgreen\:10 { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:20, html.var.auto .sf-c-txt-springgreen\:20 { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:30, html.var.auto .sf-c-txt-springgreen\:30 { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:40, html.var.auto .sf-c-txt-springgreen\:40 { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:50, html.var.auto .sf-c-txt-springgreen\:50 { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:60, html.var.auto .sf-c-txt-springgreen\:60 { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:70, html.var.auto .sf-c-txt-springgreen\:70 { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:80, html.var.auto .sf-c-txt-springgreen\:80 { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:90, html.var.auto .sf-c-txt-springgreen\:90 { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:100, html.var.auto .sf-c-txt-springgreen\:100 { color: hsl(150, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:dark, html.auto .sf-c-txt-springgreen\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:0\:dark, html.auto .sf-c-txt-springgreen\:0\:dark { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:10\:dark, html.auto .sf-c-txt-springgreen\:10\:dark { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:20\:dark, html.auto .sf-c-txt-springgreen\:20\:dark { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:30\:dark, html.auto .sf-c-txt-springgreen\:30\:dark { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:40\:dark, html.auto .sf-c-txt-springgreen\:40\:dark { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:50\:dark, html.auto .sf-c-txt-springgreen\:50\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:60\:dark, html.auto .sf-c-txt-springgreen\:60\:dark { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:70\:dark, html.auto .sf-c-txt-springgreen\:70\:dark { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:80\:dark, html.auto .sf-c-txt-springgreen\:80\:dark { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:90\:dark, html.auto .sf-c-txt-springgreen\:90\:dark { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:100\:dark, html.auto .sf-c-txt-springgreen\:100\:dark { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:dark, html.var.auto .sf-c-txt-springgreen\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:0\:dark, html.var.auto .sf-c-txt-springgreen\:0\:dark { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:10\:dark, html.var.auto .sf-c-txt-springgreen\:10\:dark { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:20\:dark, html.var.auto .sf-c-txt-springgreen\:20\:dark { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:30\:dark, html.var.auto .sf-c-txt-springgreen\:30\:dark { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:40\:dark, html.var.auto .sf-c-txt-springgreen\:40\:dark { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:50\:dark, html.var.auto .sf-c-txt-springgreen\:50\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:60\:dark, html.var.auto .sf-c-txt-springgreen\:60\:dark { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:70\:dark, html.var.auto .sf-c-txt-springgreen\:70\:dark { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:80\:dark, html.var.auto .sf-c-txt-springgreen\:80\:dark { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:90\:dark, html.var.auto .sf-c-txt-springgreen\:90\:dark { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:100\:dark, html.var.auto .sf-c-txt-springgreen\:100\:dark { color: hsl(150, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/steelblue.css b/src/colors/10/steelblue.css index 4a18df9..b592b8d 100644 --- a/src/colors/10/steelblue.css +++ b/src/colors/10/steelblue.css @@ -1,4 +1,4 @@ -:root { +[class*='steelblue'] { --sf-c-steelblue: 207 44% 49%; --sf-c-steelblue-0: 207 44% 0%; --sf-c-steelblue-10: 207 44% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-steelblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-steelblue\:90\:dark, html.var.auto .sf-c-steelblue\:90\:dark { color: hsl(207, 44%, 90%); background: hsl(207, 44%, 10%) } html.var[data-theme='auto'] .sf-c-steelblue\:100\:dark, html.var.auto .sf-c-steelblue\:100\:dark { color: hsl(207, 44%, 90%); background: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue, html.auto .sf-c-txt-steelblue { color: hsl(207, 44%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:0, html.auto .sf-c-txt-steelblue\:0 { color: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:10, html.auto .sf-c-txt-steelblue\:10 { color: hsl(207, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:20, html.auto .sf-c-txt-steelblue\:20 { color: hsl(207, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:30, html.auto .sf-c-txt-steelblue\:30 { color: hsl(207, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:40, html.auto .sf-c-txt-steelblue\:40 { color: hsl(207, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:50, html.auto .sf-c-txt-steelblue\:50 { color: hsl(207, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:60, html.auto .sf-c-txt-steelblue\:60 { color: hsl(207, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:70, html.auto .sf-c-txt-steelblue\:70 { color: hsl(207, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:80, html.auto .sf-c-txt-steelblue\:80 { color: hsl(207, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:90, html.auto .sf-c-txt-steelblue\:90 { color: hsl(207, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:100, html.auto .sf-c-txt-steelblue\:100 { color: hsl(207, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue, html.var.auto .sf-c-txt-steelblue { color: hsl(207, 44%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:0, html.var.auto .sf-c-txt-steelblue\:0 { color: hsl(207, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:10, html.var.auto .sf-c-txt-steelblue\:10 { color: hsl(207, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:20, html.var.auto .sf-c-txt-steelblue\:20 { color: hsl(207, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:30, html.var.auto .sf-c-txt-steelblue\:30 { color: hsl(207, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:40, html.var.auto .sf-c-txt-steelblue\:40 { color: hsl(207, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:50, html.var.auto .sf-c-txt-steelblue\:50 { color: hsl(207, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:60, html.var.auto .sf-c-txt-steelblue\:60 { color: hsl(207, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:70, html.var.auto .sf-c-txt-steelblue\:70 { color: hsl(207, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:80, html.var.auto .sf-c-txt-steelblue\:80 { color: hsl(207, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:90, html.var.auto .sf-c-txt-steelblue\:90 { color: hsl(207, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:100, html.var.auto .sf-c-txt-steelblue\:100 { color: hsl(207, 44%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:dark, html.auto .sf-c-txt-steelblue\:dark { color: hsl(207, 44%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:0\:dark, html.auto .sf-c-txt-steelblue\:0\:dark { color: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:10\:dark, html.auto .sf-c-txt-steelblue\:10\:dark { color: hsl(207, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:20\:dark, html.auto .sf-c-txt-steelblue\:20\:dark { color: hsl(207, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:30\:dark, html.auto .sf-c-txt-steelblue\:30\:dark { color: hsl(207, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:40\:dark, html.auto .sf-c-txt-steelblue\:40\:dark { color: hsl(207, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:50\:dark, html.auto .sf-c-txt-steelblue\:50\:dark { color: hsl(207, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:60\:dark, html.auto .sf-c-txt-steelblue\:60\:dark { color: hsl(207, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:70\:dark, html.auto .sf-c-txt-steelblue\:70\:dark { color: hsl(207, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:80\:dark, html.auto .sf-c-txt-steelblue\:80\:dark { color: hsl(207, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:90\:dark, html.auto .sf-c-txt-steelblue\:90\:dark { color: hsl(207, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:100\:dark, html.auto .sf-c-txt-steelblue\:100\:dark { color: hsl(207, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:dark, html.var.auto .sf-c-txt-steelblue\:dark { color: hsl(207, 44%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:0\:dark, html.var.auto .sf-c-txt-steelblue\:0\:dark { color: hsl(207, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:10\:dark, html.var.auto .sf-c-txt-steelblue\:10\:dark { color: hsl(207, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:20\:dark, html.var.auto .sf-c-txt-steelblue\:20\:dark { color: hsl(207, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:30\:dark, html.var.auto .sf-c-txt-steelblue\:30\:dark { color: hsl(207, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:40\:dark, html.var.auto .sf-c-txt-steelblue\:40\:dark { color: hsl(207, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:50\:dark, html.var.auto .sf-c-txt-steelblue\:50\:dark { color: hsl(207, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:60\:dark, html.var.auto .sf-c-txt-steelblue\:60\:dark { color: hsl(207, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:70\:dark, html.var.auto .sf-c-txt-steelblue\:70\:dark { color: hsl(207, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:80\:dark, html.var.auto .sf-c-txt-steelblue\:80\:dark { color: hsl(207, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:90\:dark, html.var.auto .sf-c-txt-steelblue\:90\:dark { color: hsl(207, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:100\:dark, html.var.auto .sf-c-txt-steelblue\:100\:dark { color: hsl(207, 44%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/tan.css b/src/colors/10/tan.css index b876787..6c87a2b 100644 --- a/src/colors/10/tan.css +++ b/src/colors/10/tan.css @@ -1,4 +1,4 @@ -:root { +[class*='tan'] { --sf-c-tan: 34 44% 69%; --sf-c-tan-0: 34 44% 0%; --sf-c-tan-10: 34 44% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-tan\:100\:dark, html.dark .sf-c-txt-tan\:1 html.var[data-theme='auto'] .sf-c-tan\:90\:dark, html.var.auto .sf-c-tan\:90\:dark { color: hsl(34, 44%, 90%); background: hsl(34, 44%, 10%) } html.var[data-theme='auto'] .sf-c-tan\:100\:dark, html.var.auto .sf-c-tan\:100\:dark { color: hsl(34, 44%, 90%); background: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan, html.auto .sf-c-txt-tan { color: hsl(34, 44%, 69%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:0, html.auto .sf-c-txt-tan\:0 { color: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:10, html.auto .sf-c-txt-tan\:10 { color: hsl(34, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:20, html.auto .sf-c-txt-tan\:20 { color: hsl(34, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:30, html.auto .sf-c-txt-tan\:30 { color: hsl(34, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:40, html.auto .sf-c-txt-tan\:40 { color: hsl(34, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:50, html.auto .sf-c-txt-tan\:50 { color: hsl(34, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:60, html.auto .sf-c-txt-tan\:60 { color: hsl(34, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:70, html.auto .sf-c-txt-tan\:70 { color: hsl(34, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:80, html.auto .sf-c-txt-tan\:80 { color: hsl(34, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:90, html.auto .sf-c-txt-tan\:90 { color: hsl(34, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:100, html.auto .sf-c-txt-tan\:100 { color: hsl(34, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tan, html.var.auto .sf-c-txt-tan { color: hsl(34, 44%, 69%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:0, html.var.auto .sf-c-txt-tan\:0 { color: hsl(34, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:10, html.var.auto .sf-c-txt-tan\:10 { color: hsl(34, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:20, html.var.auto .sf-c-txt-tan\:20 { color: hsl(34, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:30, html.var.auto .sf-c-txt-tan\:30 { color: hsl(34, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:40, html.var.auto .sf-c-txt-tan\:40 { color: hsl(34, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:50, html.var.auto .sf-c-txt-tan\:50 { color: hsl(34, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:60, html.var.auto .sf-c-txt-tan\:60 { color: hsl(34, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:70, html.var.auto .sf-c-txt-tan\:70 { color: hsl(34, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:80, html.var.auto .sf-c-txt-tan\:80 { color: hsl(34, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:90, html.var.auto .sf-c-txt-tan\:90 { color: hsl(34, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:100, html.var.auto .sf-c-txt-tan\:100 { color: hsl(34, 44%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:dark, html.auto .sf-c-txt-tan\:dark { color: hsl(34, 44%, 69%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:0\:dark, html.auto .sf-c-txt-tan\:0\:dark { color: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:10\:dark, html.auto .sf-c-txt-tan\:10\:dark { color: hsl(34, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:20\:dark, html.auto .sf-c-txt-tan\:20\:dark { color: hsl(34, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:30\:dark, html.auto .sf-c-txt-tan\:30\:dark { color: hsl(34, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:40\:dark, html.auto .sf-c-txt-tan\:40\:dark { color: hsl(34, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:50\:dark, html.auto .sf-c-txt-tan\:50\:dark { color: hsl(34, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:60\:dark, html.auto .sf-c-txt-tan\:60\:dark { color: hsl(34, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:70\:dark, html.auto .sf-c-txt-tan\:70\:dark { color: hsl(34, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:80\:dark, html.auto .sf-c-txt-tan\:80\:dark { color: hsl(34, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:90\:dark, html.auto .sf-c-txt-tan\:90\:dark { color: hsl(34, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:100\:dark, html.auto .sf-c-txt-tan\:100\:dark { color: hsl(34, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:dark, html.var.auto .sf-c-txt-tan\:dark { color: hsl(34, 44%, 69%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:0\:dark, html.var.auto .sf-c-txt-tan\:0\:dark { color: hsl(34, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:10\:dark, html.var.auto .sf-c-txt-tan\:10\:dark { color: hsl(34, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:20\:dark, html.var.auto .sf-c-txt-tan\:20\:dark { color: hsl(34, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:30\:dark, html.var.auto .sf-c-txt-tan\:30\:dark { color: hsl(34, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:40\:dark, html.var.auto .sf-c-txt-tan\:40\:dark { color: hsl(34, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:50\:dark, html.var.auto .sf-c-txt-tan\:50\:dark { color: hsl(34, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:60\:dark, html.var.auto .sf-c-txt-tan\:60\:dark { color: hsl(34, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:70\:dark, html.var.auto .sf-c-txt-tan\:70\:dark { color: hsl(34, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:80\:dark, html.var.auto .sf-c-txt-tan\:80\:dark { color: hsl(34, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:90\:dark, html.var.auto .sf-c-txt-tan\:90\:dark { color: hsl(34, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:100\:dark, html.var.auto .sf-c-txt-tan\:100\:dark { color: hsl(34, 44%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/teal.css b/src/colors/10/teal.css index 4bcc9ae..f9decab 100644 --- a/src/colors/10/teal.css +++ b/src/colors/10/teal.css @@ -1,4 +1,4 @@ -:root { +[class*='teal'] { --sf-c-teal: 180 100% 25%; --sf-c-teal-0: 180 100% 0%; --sf-c-teal-10: 180 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-teal\:100\:dark, html.dark .sf-c-txt-teal\ html.var[data-theme='auto'] .sf-c-teal\:90\:dark, html.var.auto .sf-c-teal\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) } html.var[data-theme='auto'] .sf-c-teal\:100\:dark, html.var.auto .sf-c-teal\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal, html.auto .sf-c-txt-teal { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:0, html.auto .sf-c-txt-teal\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:10, html.auto .sf-c-txt-teal\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:20, html.auto .sf-c-txt-teal\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:30, html.auto .sf-c-txt-teal\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:40, html.auto .sf-c-txt-teal\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:50, html.auto .sf-c-txt-teal\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:60, html.auto .sf-c-txt-teal\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:70, html.auto .sf-c-txt-teal\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:80, html.auto .sf-c-txt-teal\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:90, html.auto .sf-c-txt-teal\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:100, html.auto .sf-c-txt-teal\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-teal, html.var.auto .sf-c-txt-teal { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:0, html.var.auto .sf-c-txt-teal\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:10, html.var.auto .sf-c-txt-teal\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:20, html.var.auto .sf-c-txt-teal\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:30, html.var.auto .sf-c-txt-teal\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:40, html.var.auto .sf-c-txt-teal\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:50, html.var.auto .sf-c-txt-teal\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:60, html.var.auto .sf-c-txt-teal\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:70, html.var.auto .sf-c-txt-teal\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:80, html.var.auto .sf-c-txt-teal\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:90, html.var.auto .sf-c-txt-teal\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:100, html.var.auto .sf-c-txt-teal\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:dark, html.auto .sf-c-txt-teal\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark, html.auto .sf-c-txt-teal\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark, html.auto .sf-c-txt-teal\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark, html.auto .sf-c-txt-teal\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark, html.auto .sf-c-txt-teal\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark, html.auto .sf-c-txt-teal\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark, html.auto .sf-c-txt-teal\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark, html.auto .sf-c-txt-teal\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark, html.auto .sf-c-txt-teal\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark, html.auto .sf-c-txt-teal\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark, html.auto .sf-c-txt-teal\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark, html.auto .sf-c-txt-teal\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:dark, html.var.auto .sf-c-txt-teal\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark, html.var.auto .sf-c-txt-teal\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark, html.var.auto .sf-c-txt-teal\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark, html.var.auto .sf-c-txt-teal\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark, html.var.auto .sf-c-txt-teal\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark, html.var.auto .sf-c-txt-teal\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark, html.var.auto .sf-c-txt-teal\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark, html.var.auto .sf-c-txt-teal\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark, html.var.auto .sf-c-txt-teal\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark, html.var.auto .sf-c-txt-teal\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark, html.var.auto .sf-c-txt-teal\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark, html.var.auto .sf-c-txt-teal\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/thistle.css b/src/colors/10/thistle.css index 5cf092b..79aa078 100644 --- a/src/colors/10/thistle.css +++ b/src/colors/10/thistle.css @@ -1,4 +1,4 @@ -:root { +[class*='thistle'] { --sf-c-thistle: 300 24% 80%; --sf-c-thistle-0: 300 24% 0%; --sf-c-thistle-10: 300 24% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-thistle\:100\:dark, html.dark .sf-c-txt-th html.var[data-theme='auto'] .sf-c-thistle\:90\:dark, html.var.auto .sf-c-thistle\:90\:dark { color: hsl(300, 24%, 90%); background: hsl(300, 24%, 10%) } html.var[data-theme='auto'] .sf-c-thistle\:100\:dark, html.var.auto .sf-c-thistle\:100\:dark { color: hsl(300, 24%, 90%); background: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle, html.auto .sf-c-txt-thistle { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:0, html.auto .sf-c-txt-thistle\:0 { color: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:10, html.auto .sf-c-txt-thistle\:10 { color: hsl(300, 24%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:20, html.auto .sf-c-txt-thistle\:20 { color: hsl(300, 24%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:30, html.auto .sf-c-txt-thistle\:30 { color: hsl(300, 24%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:40, html.auto .sf-c-txt-thistle\:40 { color: hsl(300, 24%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:50, html.auto .sf-c-txt-thistle\:50 { color: hsl(300, 24%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:60, html.auto .sf-c-txt-thistle\:60 { color: hsl(300, 24%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:70, html.auto .sf-c-txt-thistle\:70 { color: hsl(300, 24%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:80, html.auto .sf-c-txt-thistle\:80 { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:90, html.auto .sf-c-txt-thistle\:90 { color: hsl(300, 24%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:100, html.auto .sf-c-txt-thistle\:100 { color: hsl(300, 24%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-thistle, html.var.auto .sf-c-txt-thistle { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:0, html.var.auto .sf-c-txt-thistle\:0 { color: hsl(300, 24%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:10, html.var.auto .sf-c-txt-thistle\:10 { color: hsl(300, 24%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:20, html.var.auto .sf-c-txt-thistle\:20 { color: hsl(300, 24%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:30, html.var.auto .sf-c-txt-thistle\:30 { color: hsl(300, 24%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:40, html.var.auto .sf-c-txt-thistle\:40 { color: hsl(300, 24%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:50, html.var.auto .sf-c-txt-thistle\:50 { color: hsl(300, 24%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:60, html.var.auto .sf-c-txt-thistle\:60 { color: hsl(300, 24%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:70, html.var.auto .sf-c-txt-thistle\:70 { color: hsl(300, 24%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:80, html.var.auto .sf-c-txt-thistle\:80 { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:90, html.var.auto .sf-c-txt-thistle\:90 { color: hsl(300, 24%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:100, html.var.auto .sf-c-txt-thistle\:100 { color: hsl(300, 24%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:dark, html.auto .sf-c-txt-thistle\:dark { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:0\:dark, html.auto .sf-c-txt-thistle\:0\:dark { color: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:10\:dark, html.auto .sf-c-txt-thistle\:10\:dark { color: hsl(300, 24%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:20\:dark, html.auto .sf-c-txt-thistle\:20\:dark { color: hsl(300, 24%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:30\:dark, html.auto .sf-c-txt-thistle\:30\:dark { color: hsl(300, 24%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:40\:dark, html.auto .sf-c-txt-thistle\:40\:dark { color: hsl(300, 24%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:50\:dark, html.auto .sf-c-txt-thistle\:50\:dark { color: hsl(300, 24%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:60\:dark, html.auto .sf-c-txt-thistle\:60\:dark { color: hsl(300, 24%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:70\:dark, html.auto .sf-c-txt-thistle\:70\:dark { color: hsl(300, 24%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:80\:dark, html.auto .sf-c-txt-thistle\:80\:dark { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:90\:dark, html.auto .sf-c-txt-thistle\:90\:dark { color: hsl(300, 24%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:100\:dark, html.auto .sf-c-txt-thistle\:100\:dark { color: hsl(300, 24%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:dark, html.var.auto .sf-c-txt-thistle\:dark { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:0\:dark, html.var.auto .sf-c-txt-thistle\:0\:dark { color: hsl(300, 24%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:10\:dark, html.var.auto .sf-c-txt-thistle\:10\:dark { color: hsl(300, 24%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:20\:dark, html.var.auto .sf-c-txt-thistle\:20\:dark { color: hsl(300, 24%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:30\:dark, html.var.auto .sf-c-txt-thistle\:30\:dark { color: hsl(300, 24%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:40\:dark, html.var.auto .sf-c-txt-thistle\:40\:dark { color: hsl(300, 24%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:50\:dark, html.var.auto .sf-c-txt-thistle\:50\:dark { color: hsl(300, 24%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:60\:dark, html.var.auto .sf-c-txt-thistle\:60\:dark { color: hsl(300, 24%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:70\:dark, html.var.auto .sf-c-txt-thistle\:70\:dark { color: hsl(300, 24%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:80\:dark, html.var.auto .sf-c-txt-thistle\:80\:dark { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:90\:dark, html.var.auto .sf-c-txt-thistle\:90\:dark { color: hsl(300, 24%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:100\:dark, html.var.auto .sf-c-txt-thistle\:100\:dark { color: hsl(300, 24%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/tomato.css b/src/colors/10/tomato.css index c6ace49..c720420 100644 --- a/src/colors/10/tomato.css +++ b/src/colors/10/tomato.css @@ -1,4 +1,4 @@ -:root { +[class*='tomato'] { --sf-c-tomato: 9 100% 64%; --sf-c-tomato-0: 9 100% 0%; --sf-c-tomato-10: 9 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-tomato\:100\:dark, html.dark .sf-c-txt-tom html.var[data-theme='auto'] .sf-c-tomato\:90\:dark, html.var.auto .sf-c-tomato\:90\:dark { color: hsl(9, 100%, 90%); background: hsl(9, 100%, 10%) } html.var[data-theme='auto'] .sf-c-tomato\:100\:dark, html.var.auto .sf-c-tomato\:100\:dark { color: hsl(9, 100%, 90%); background: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato, html.auto .sf-c-txt-tomato { color: hsl(9, 100%, 64%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:0, html.auto .sf-c-txt-tomato\:0 { color: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:10, html.auto .sf-c-txt-tomato\:10 { color: hsl(9, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:20, html.auto .sf-c-txt-tomato\:20 { color: hsl(9, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:30, html.auto .sf-c-txt-tomato\:30 { color: hsl(9, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:40, html.auto .sf-c-txt-tomato\:40 { color: hsl(9, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:50, html.auto .sf-c-txt-tomato\:50 { color: hsl(9, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:60, html.auto .sf-c-txt-tomato\:60 { color: hsl(9, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:70, html.auto .sf-c-txt-tomato\:70 { color: hsl(9, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:80, html.auto .sf-c-txt-tomato\:80 { color: hsl(9, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:90, html.auto .sf-c-txt-tomato\:90 { color: hsl(9, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:100, html.auto .sf-c-txt-tomato\:100 { color: hsl(9, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tomato, html.var.auto .sf-c-txt-tomato { color: hsl(9, 100%, 64%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:0, html.var.auto .sf-c-txt-tomato\:0 { color: hsl(9, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:10, html.var.auto .sf-c-txt-tomato\:10 { color: hsl(9, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:20, html.var.auto .sf-c-txt-tomato\:20 { color: hsl(9, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:30, html.var.auto .sf-c-txt-tomato\:30 { color: hsl(9, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:40, html.var.auto .sf-c-txt-tomato\:40 { color: hsl(9, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:50, html.var.auto .sf-c-txt-tomato\:50 { color: hsl(9, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:60, html.var.auto .sf-c-txt-tomato\:60 { color: hsl(9, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:70, html.var.auto .sf-c-txt-tomato\:70 { color: hsl(9, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:80, html.var.auto .sf-c-txt-tomato\:80 { color: hsl(9, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:90, html.var.auto .sf-c-txt-tomato\:90 { color: hsl(9, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:100, html.var.auto .sf-c-txt-tomato\:100 { color: hsl(9, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:dark, html.auto .sf-c-txt-tomato\:dark { color: hsl(9, 100%, 64%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:0\:dark, html.auto .sf-c-txt-tomato\:0\:dark { color: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:10\:dark, html.auto .sf-c-txt-tomato\:10\:dark { color: hsl(9, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:20\:dark, html.auto .sf-c-txt-tomato\:20\:dark { color: hsl(9, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:30\:dark, html.auto .sf-c-txt-tomato\:30\:dark { color: hsl(9, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:40\:dark, html.auto .sf-c-txt-tomato\:40\:dark { color: hsl(9, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:50\:dark, html.auto .sf-c-txt-tomato\:50\:dark { color: hsl(9, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:60\:dark, html.auto .sf-c-txt-tomato\:60\:dark { color: hsl(9, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:70\:dark, html.auto .sf-c-txt-tomato\:70\:dark { color: hsl(9, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:80\:dark, html.auto .sf-c-txt-tomato\:80\:dark { color: hsl(9, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:90\:dark, html.auto .sf-c-txt-tomato\:90\:dark { color: hsl(9, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:100\:dark, html.auto .sf-c-txt-tomato\:100\:dark { color: hsl(9, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:dark, html.var.auto .sf-c-txt-tomato\:dark { color: hsl(9, 100%, 64%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:0\:dark, html.var.auto .sf-c-txt-tomato\:0\:dark { color: hsl(9, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:10\:dark, html.var.auto .sf-c-txt-tomato\:10\:dark { color: hsl(9, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:20\:dark, html.var.auto .sf-c-txt-tomato\:20\:dark { color: hsl(9, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:30\:dark, html.var.auto .sf-c-txt-tomato\:30\:dark { color: hsl(9, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:40\:dark, html.var.auto .sf-c-txt-tomato\:40\:dark { color: hsl(9, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:50\:dark, html.var.auto .sf-c-txt-tomato\:50\:dark { color: hsl(9, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:60\:dark, html.var.auto .sf-c-txt-tomato\:60\:dark { color: hsl(9, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:70\:dark, html.var.auto .sf-c-txt-tomato\:70\:dark { color: hsl(9, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:80\:dark, html.var.auto .sf-c-txt-tomato\:80\:dark { color: hsl(9, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:90\:dark, html.var.auto .sf-c-txt-tomato\:90\:dark { color: hsl(9, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:100\:dark, html.var.auto .sf-c-txt-tomato\:100\:dark { color: hsl(9, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/turquoise.css b/src/colors/10/turquoise.css index 4f321f7..5b1aaea 100644 --- a/src/colors/10/turquoise.css +++ b/src/colors/10/turquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='turquoise'] { --sf-c-turquoise: 174 72% 56%; --sf-c-turquoise-0: 174 72% 0%; --sf-c-turquoise-10: 174 72% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-turquoise\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-turquoise\:90\:dark, html.var.auto .sf-c-turquoise\:90\:dark { color: hsl(174, 72%, 90%); background: hsl(174, 72%, 10%) } html.var[data-theme='auto'] .sf-c-turquoise\:100\:dark, html.var.auto .sf-c-turquoise\:100\:dark { color: hsl(174, 72%, 90%); background: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise, html.auto .sf-c-txt-turquoise { color: hsl(174, 72%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:0, html.auto .sf-c-txt-turquoise\:0 { color: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:10, html.auto .sf-c-txt-turquoise\:10 { color: hsl(174, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:20, html.auto .sf-c-txt-turquoise\:20 { color: hsl(174, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:30, html.auto .sf-c-txt-turquoise\:30 { color: hsl(174, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:40, html.auto .sf-c-txt-turquoise\:40 { color: hsl(174, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:50, html.auto .sf-c-txt-turquoise\:50 { color: hsl(174, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:60, html.auto .sf-c-txt-turquoise\:60 { color: hsl(174, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:70, html.auto .sf-c-txt-turquoise\:70 { color: hsl(174, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:80, html.auto .sf-c-txt-turquoise\:80 { color: hsl(174, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:90, html.auto .sf-c-txt-turquoise\:90 { color: hsl(174, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:100, html.auto .sf-c-txt-turquoise\:100 { color: hsl(174, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise, html.var.auto .sf-c-txt-turquoise { color: hsl(174, 72%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:0, html.var.auto .sf-c-txt-turquoise\:0 { color: hsl(174, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:10, html.var.auto .sf-c-txt-turquoise\:10 { color: hsl(174, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:20, html.var.auto .sf-c-txt-turquoise\:20 { color: hsl(174, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:30, html.var.auto .sf-c-txt-turquoise\:30 { color: hsl(174, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:40, html.var.auto .sf-c-txt-turquoise\:40 { color: hsl(174, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:50, html.var.auto .sf-c-txt-turquoise\:50 { color: hsl(174, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:60, html.var.auto .sf-c-txt-turquoise\:60 { color: hsl(174, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:70, html.var.auto .sf-c-txt-turquoise\:70 { color: hsl(174, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:80, html.var.auto .sf-c-txt-turquoise\:80 { color: hsl(174, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:90, html.var.auto .sf-c-txt-turquoise\:90 { color: hsl(174, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:100, html.var.auto .sf-c-txt-turquoise\:100 { color: hsl(174, 72%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:dark, html.auto .sf-c-txt-turquoise\:dark { color: hsl(174, 72%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:0\:dark, html.auto .sf-c-txt-turquoise\:0\:dark { color: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:10\:dark, html.auto .sf-c-txt-turquoise\:10\:dark { color: hsl(174, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:20\:dark, html.auto .sf-c-txt-turquoise\:20\:dark { color: hsl(174, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:30\:dark, html.auto .sf-c-txt-turquoise\:30\:dark { color: hsl(174, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:40\:dark, html.auto .sf-c-txt-turquoise\:40\:dark { color: hsl(174, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:50\:dark, html.auto .sf-c-txt-turquoise\:50\:dark { color: hsl(174, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:60\:dark, html.auto .sf-c-txt-turquoise\:60\:dark { color: hsl(174, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:70\:dark, html.auto .sf-c-txt-turquoise\:70\:dark { color: hsl(174, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:80\:dark, html.auto .sf-c-txt-turquoise\:80\:dark { color: hsl(174, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:90\:dark, html.auto .sf-c-txt-turquoise\:90\:dark { color: hsl(174, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:100\:dark, html.auto .sf-c-txt-turquoise\:100\:dark { color: hsl(174, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:dark, html.var.auto .sf-c-txt-turquoise\:dark { color: hsl(174, 72%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:0\:dark, html.var.auto .sf-c-txt-turquoise\:0\:dark { color: hsl(174, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:10\:dark, html.var.auto .sf-c-txt-turquoise\:10\:dark { color: hsl(174, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:20\:dark, html.var.auto .sf-c-txt-turquoise\:20\:dark { color: hsl(174, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:30\:dark, html.var.auto .sf-c-txt-turquoise\:30\:dark { color: hsl(174, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:40\:dark, html.var.auto .sf-c-txt-turquoise\:40\:dark { color: hsl(174, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:50\:dark, html.var.auto .sf-c-txt-turquoise\:50\:dark { color: hsl(174, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:60\:dark, html.var.auto .sf-c-txt-turquoise\:60\:dark { color: hsl(174, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:70\:dark, html.var.auto .sf-c-txt-turquoise\:70\:dark { color: hsl(174, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:80\:dark, html.var.auto .sf-c-txt-turquoise\:80\:dark { color: hsl(174, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:90\:dark, html.var.auto .sf-c-txt-turquoise\:90\:dark { color: hsl(174, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:100\:dark, html.var.auto .sf-c-txt-turquoise\:100\:dark { color: hsl(174, 72%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/violet.css b/src/colors/10/violet.css index 3a8e76b..2635afe 100644 --- a/src/colors/10/violet.css +++ b/src/colors/10/violet.css @@ -1,4 +1,4 @@ -:root { +[class*='violet'] { --sf-c-violet: 300 76% 72%; --sf-c-violet-0: 300 76% 0%; --sf-c-violet-10: 300 76% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-violet\:100\:dark, html.dark .sf-c-txt-vio html.var[data-theme='auto'] .sf-c-violet\:90\:dark, html.var.auto .sf-c-violet\:90\:dark { color: hsl(300, 76%, 90%); background: hsl(300, 76%, 10%) } html.var[data-theme='auto'] .sf-c-violet\:100\:dark, html.var.auto .sf-c-violet\:100\:dark { color: hsl(300, 76%, 90%); background: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet, html.auto .sf-c-txt-violet { color: hsl(300, 76%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:0, html.auto .sf-c-txt-violet\:0 { color: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:10, html.auto .sf-c-txt-violet\:10 { color: hsl(300, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:20, html.auto .sf-c-txt-violet\:20 { color: hsl(300, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:30, html.auto .sf-c-txt-violet\:30 { color: hsl(300, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:40, html.auto .sf-c-txt-violet\:40 { color: hsl(300, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:50, html.auto .sf-c-txt-violet\:50 { color: hsl(300, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:60, html.auto .sf-c-txt-violet\:60 { color: hsl(300, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:70, html.auto .sf-c-txt-violet\:70 { color: hsl(300, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:80, html.auto .sf-c-txt-violet\:80 { color: hsl(300, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:90, html.auto .sf-c-txt-violet\:90 { color: hsl(300, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:100, html.auto .sf-c-txt-violet\:100 { color: hsl(300, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-violet, html.var.auto .sf-c-txt-violet { color: hsl(300, 76%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:0, html.var.auto .sf-c-txt-violet\:0 { color: hsl(300, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:10, html.var.auto .sf-c-txt-violet\:10 { color: hsl(300, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:20, html.var.auto .sf-c-txt-violet\:20 { color: hsl(300, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:30, html.var.auto .sf-c-txt-violet\:30 { color: hsl(300, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:40, html.var.auto .sf-c-txt-violet\:40 { color: hsl(300, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:50, html.var.auto .sf-c-txt-violet\:50 { color: hsl(300, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:60, html.var.auto .sf-c-txt-violet\:60 { color: hsl(300, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:70, html.var.auto .sf-c-txt-violet\:70 { color: hsl(300, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:80, html.var.auto .sf-c-txt-violet\:80 { color: hsl(300, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:90, html.var.auto .sf-c-txt-violet\:90 { color: hsl(300, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:100, html.var.auto .sf-c-txt-violet\:100 { color: hsl(300, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:dark, html.auto .sf-c-txt-violet\:dark { color: hsl(300, 76%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark, html.auto .sf-c-txt-violet\:0\:dark { color: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark, html.auto .sf-c-txt-violet\:10\:dark { color: hsl(300, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark, html.auto .sf-c-txt-violet\:20\:dark { color: hsl(300, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark, html.auto .sf-c-txt-violet\:30\:dark { color: hsl(300, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark, html.auto .sf-c-txt-violet\:40\:dark { color: hsl(300, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark, html.auto .sf-c-txt-violet\:50\:dark { color: hsl(300, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark, html.auto .sf-c-txt-violet\:60\:dark { color: hsl(300, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark, html.auto .sf-c-txt-violet\:70\:dark { color: hsl(300, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark, html.auto .sf-c-txt-violet\:80\:dark { color: hsl(300, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark, html.auto .sf-c-txt-violet\:90\:dark { color: hsl(300, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark, html.auto .sf-c-txt-violet\:100\:dark { color: hsl(300, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:dark, html.var.auto .sf-c-txt-violet\:dark { color: hsl(300, 76%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark, html.var.auto .sf-c-txt-violet\:0\:dark { color: hsl(300, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark, html.var.auto .sf-c-txt-violet\:10\:dark { color: hsl(300, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark, html.var.auto .sf-c-txt-violet\:20\:dark { color: hsl(300, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark, html.var.auto .sf-c-txt-violet\:30\:dark { color: hsl(300, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark, html.var.auto .sf-c-txt-violet\:40\:dark { color: hsl(300, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark, html.var.auto .sf-c-txt-violet\:50\:dark { color: hsl(300, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark, html.var.auto .sf-c-txt-violet\:60\:dark { color: hsl(300, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark, html.var.auto .sf-c-txt-violet\:70\:dark { color: hsl(300, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark, html.var.auto .sf-c-txt-violet\:80\:dark { color: hsl(300, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark, html.var.auto .sf-c-txt-violet\:90\:dark { color: hsl(300, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark, html.var.auto .sf-c-txt-violet\:100\:dark { color: hsl(300, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/wheat.css b/src/colors/10/wheat.css index 3d4c4ac..69fd0f2 100644 --- a/src/colors/10/wheat.css +++ b/src/colors/10/wheat.css @@ -1,4 +1,4 @@ -:root { +[class*='wheat'] { --sf-c-wheat: 39 77% 83%; --sf-c-wheat-0: 39 77% 0%; --sf-c-wheat-10: 39 77% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-wheat\:100\:dark, html.dark .sf-c-txt-whea html.var[data-theme='auto'] .sf-c-wheat\:90\:dark, html.var.auto .sf-c-wheat\:90\:dark { color: hsl(39, 77%, 90%); background: hsl(39, 77%, 10%) } html.var[data-theme='auto'] .sf-c-wheat\:100\:dark, html.var.auto .sf-c-wheat\:100\:dark { color: hsl(39, 77%, 90%); background: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat, html.auto .sf-c-txt-wheat { color: hsl(39, 77%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:0, html.auto .sf-c-txt-wheat\:0 { color: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:10, html.auto .sf-c-txt-wheat\:10 { color: hsl(39, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:20, html.auto .sf-c-txt-wheat\:20 { color: hsl(39, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:30, html.auto .sf-c-txt-wheat\:30 { color: hsl(39, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:40, html.auto .sf-c-txt-wheat\:40 { color: hsl(39, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:50, html.auto .sf-c-txt-wheat\:50 { color: hsl(39, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:60, html.auto .sf-c-txt-wheat\:60 { color: hsl(39, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:70, html.auto .sf-c-txt-wheat\:70 { color: hsl(39, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:80, html.auto .sf-c-txt-wheat\:80 { color: hsl(39, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:90, html.auto .sf-c-txt-wheat\:90 { color: hsl(39, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:100, html.auto .sf-c-txt-wheat\:100 { color: hsl(39, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-wheat, html.var.auto .sf-c-txt-wheat { color: hsl(39, 77%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:0, html.var.auto .sf-c-txt-wheat\:0 { color: hsl(39, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:10, html.var.auto .sf-c-txt-wheat\:10 { color: hsl(39, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:20, html.var.auto .sf-c-txt-wheat\:20 { color: hsl(39, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:30, html.var.auto .sf-c-txt-wheat\:30 { color: hsl(39, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:40, html.var.auto .sf-c-txt-wheat\:40 { color: hsl(39, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:50, html.var.auto .sf-c-txt-wheat\:50 { color: hsl(39, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:60, html.var.auto .sf-c-txt-wheat\:60 { color: hsl(39, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:70, html.var.auto .sf-c-txt-wheat\:70 { color: hsl(39, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:80, html.var.auto .sf-c-txt-wheat\:80 { color: hsl(39, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:90, html.var.auto .sf-c-txt-wheat\:90 { color: hsl(39, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:100, html.var.auto .sf-c-txt-wheat\:100 { color: hsl(39, 77%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:dark, html.auto .sf-c-txt-wheat\:dark { color: hsl(39, 77%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:0\:dark, html.auto .sf-c-txt-wheat\:0\:dark { color: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:10\:dark, html.auto .sf-c-txt-wheat\:10\:dark { color: hsl(39, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:20\:dark, html.auto .sf-c-txt-wheat\:20\:dark { color: hsl(39, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:30\:dark, html.auto .sf-c-txt-wheat\:30\:dark { color: hsl(39, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:40\:dark, html.auto .sf-c-txt-wheat\:40\:dark { color: hsl(39, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:50\:dark, html.auto .sf-c-txt-wheat\:50\:dark { color: hsl(39, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:60\:dark, html.auto .sf-c-txt-wheat\:60\:dark { color: hsl(39, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:70\:dark, html.auto .sf-c-txt-wheat\:70\:dark { color: hsl(39, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:80\:dark, html.auto .sf-c-txt-wheat\:80\:dark { color: hsl(39, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:90\:dark, html.auto .sf-c-txt-wheat\:90\:dark { color: hsl(39, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:100\:dark, html.auto .sf-c-txt-wheat\:100\:dark { color: hsl(39, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:dark, html.var.auto .sf-c-txt-wheat\:dark { color: hsl(39, 77%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:0\:dark, html.var.auto .sf-c-txt-wheat\:0\:dark { color: hsl(39, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:10\:dark, html.var.auto .sf-c-txt-wheat\:10\:dark { color: hsl(39, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:20\:dark, html.var.auto .sf-c-txt-wheat\:20\:dark { color: hsl(39, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:30\:dark, html.var.auto .sf-c-txt-wheat\:30\:dark { color: hsl(39, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:40\:dark, html.var.auto .sf-c-txt-wheat\:40\:dark { color: hsl(39, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:50\:dark, html.var.auto .sf-c-txt-wheat\:50\:dark { color: hsl(39, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:60\:dark, html.var.auto .sf-c-txt-wheat\:60\:dark { color: hsl(39, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:70\:dark, html.var.auto .sf-c-txt-wheat\:70\:dark { color: hsl(39, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:80\:dark, html.var.auto .sf-c-txt-wheat\:80\:dark { color: hsl(39, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:90\:dark, html.var.auto .sf-c-txt-wheat\:90\:dark { color: hsl(39, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:100\:dark, html.var.auto .sf-c-txt-wheat\:100\:dark { color: hsl(39, 77%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/white.css b/src/colors/10/white.css index 0bfa5c1..aa982f1 100644 --- a/src/colors/10/white.css +++ b/src/colors/10/white.css @@ -1,4 +1,4 @@ -:root { +[class*='white'] { --sf-c-white: 0 0% 100%; --sf-c-white-0: 0 0% 0%; --sf-c-white-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-white\:100\:dark, html.dark .sf-c-txt-whit html.var[data-theme='auto'] .sf-c-white\:90\:dark, html.var.auto .sf-c-white\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-white\:100\:dark, html.var.auto .sf-c-white\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white, html.auto .sf-c-txt-white { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:0, html.auto .sf-c-txt-white\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white\:10, html.auto .sf-c-txt-white\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-white\:20, html.auto .sf-c-txt-white\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-white\:30, html.auto .sf-c-txt-white\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-white\:40, html.auto .sf-c-txt-white\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-white\:50, html.auto .sf-c-txt-white\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-white\:60, html.auto .sf-c-txt-white\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-white\:70, html.auto .sf-c-txt-white\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-white\:80, html.auto .sf-c-txt-white\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-white\:90, html.auto .sf-c-txt-white\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-white\:100, html.auto .sf-c-txt-white\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white, html.var.auto .sf-c-txt-white { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:0, html.var.auto .sf-c-txt-white\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-white\:10, html.var.auto .sf-c-txt-white\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-white\:20, html.var.auto .sf-c-txt-white\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-white\:30, html.var.auto .sf-c-txt-white\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-white\:40, html.var.auto .sf-c-txt-white\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-white\:50, html.var.auto .sf-c-txt-white\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-white\:60, html.var.auto .sf-c-txt-white\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-white\:70, html.var.auto .sf-c-txt-white\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-white\:80, html.var.auto .sf-c-txt-white\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-white\:90, html.var.auto .sf-c-txt-white\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-white\:100, html.var.auto .sf-c-txt-white\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:dark, html.auto .sf-c-txt-white\:dark { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark, html.auto .sf-c-txt-white\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark, html.auto .sf-c-txt-white\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark, html.auto .sf-c-txt-white\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark, html.auto .sf-c-txt-white\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark, html.auto .sf-c-txt-white\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark, html.auto .sf-c-txt-white\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark, html.auto .sf-c-txt-white\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark, html.auto .sf-c-txt-white\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark, html.auto .sf-c-txt-white\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark, html.auto .sf-c-txt-white\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark, html.auto .sf-c-txt-white\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:dark, html.var.auto .sf-c-txt-white\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark, html.var.auto .sf-c-txt-white\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark, html.var.auto .sf-c-txt-white\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark, html.var.auto .sf-c-txt-white\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark, html.var.auto .sf-c-txt-white\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark, html.var.auto .sf-c-txt-white\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark, html.var.auto .sf-c-txt-white\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark, html.var.auto .sf-c-txt-white\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark, html.var.auto .sf-c-txt-white\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark, html.var.auto .sf-c-txt-white\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark, html.var.auto .sf-c-txt-white\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark, html.var.auto .sf-c-txt-white\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/whitesmoke.css b/src/colors/10/whitesmoke.css index 5bfe090..98bfc5f 100644 --- a/src/colors/10/whitesmoke.css +++ b/src/colors/10/whitesmoke.css @@ -1,4 +1,4 @@ -:root { +[class*='whitesmoke'] { --sf-c-whitesmoke: 0 0% 96%; --sf-c-whitesmoke-0: 0 0% 0%; --sf-c-whitesmoke-10: 0 0% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-whitesmoke\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-whitesmoke\:90\:dark, html.var.auto .sf-c-whitesmoke\:90\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 10%) } html.var[data-theme='auto'] .sf-c-whitesmoke\:100\:dark, html.var.auto .sf-c-whitesmoke\:100\:dark { color: hsl(0, 0%, 90%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke, html.auto .sf-c-txt-whitesmoke { color: hsl(0, 0%, 96%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0, html.auto .sf-c-txt-whitesmoke\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10, html.auto .sf-c-txt-whitesmoke\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20, html.auto .sf-c-txt-whitesmoke\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30, html.auto .sf-c-txt-whitesmoke\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40, html.auto .sf-c-txt-whitesmoke\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50, html.auto .sf-c-txt-whitesmoke\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60, html.auto .sf-c-txt-whitesmoke\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70, html.auto .sf-c-txt-whitesmoke\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80, html.auto .sf-c-txt-whitesmoke\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90, html.auto .sf-c-txt-whitesmoke\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100, html.auto .sf-c-txt-whitesmoke\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke, html.var.auto .sf-c-txt-whitesmoke { color: hsl(0, 0%, 96%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0, html.var.auto .sf-c-txt-whitesmoke\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10, html.var.auto .sf-c-txt-whitesmoke\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20, html.var.auto .sf-c-txt-whitesmoke\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30, html.var.auto .sf-c-txt-whitesmoke\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40, html.var.auto .sf-c-txt-whitesmoke\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50, html.var.auto .sf-c-txt-whitesmoke\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60, html.var.auto .sf-c-txt-whitesmoke\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70, html.var.auto .sf-c-txt-whitesmoke\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80, html.var.auto .sf-c-txt-whitesmoke\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90, html.var.auto .sf-c-txt-whitesmoke\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100, html.var.auto .sf-c-txt-whitesmoke\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:dark, html.auto .sf-c-txt-whitesmoke\:dark { color: hsl(0, 0%, 96%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0\:dark, html.auto .sf-c-txt-whitesmoke\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10\:dark, html.auto .sf-c-txt-whitesmoke\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20\:dark, html.auto .sf-c-txt-whitesmoke\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30\:dark, html.auto .sf-c-txt-whitesmoke\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40\:dark, html.auto .sf-c-txt-whitesmoke\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50\:dark, html.auto .sf-c-txt-whitesmoke\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60\:dark, html.auto .sf-c-txt-whitesmoke\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70\:dark, html.auto .sf-c-txt-whitesmoke\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80\:dark, html.auto .sf-c-txt-whitesmoke\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90\:dark, html.auto .sf-c-txt-whitesmoke\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100\:dark, html.auto .sf-c-txt-whitesmoke\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:dark, html.var.auto .sf-c-txt-whitesmoke\:dark { color: hsl(0, 0%, 96%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0\:dark, html.var.auto .sf-c-txt-whitesmoke\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10\:dark, html.var.auto .sf-c-txt-whitesmoke\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20\:dark, html.var.auto .sf-c-txt-whitesmoke\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30\:dark, html.var.auto .sf-c-txt-whitesmoke\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40\:dark, html.var.auto .sf-c-txt-whitesmoke\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50\:dark, html.var.auto .sf-c-txt-whitesmoke\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60\:dark, html.var.auto .sf-c-txt-whitesmoke\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70\:dark, html.var.auto .sf-c-txt-whitesmoke\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80\:dark, html.var.auto .sf-c-txt-whitesmoke\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90\:dark, html.var.auto .sf-c-txt-whitesmoke\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100\:dark, html.var.auto .sf-c-txt-whitesmoke\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/yellow.css b/src/colors/10/yellow.css index 3c40879..f3e181d 100644 --- a/src/colors/10/yellow.css +++ b/src/colors/10/yellow.css @@ -1,4 +1,4 @@ -:root { +[class*='yellow'] { --sf-c-yellow: 60 100% 50%; --sf-c-yellow-0: 60 100% 0%; --sf-c-yellow-10: 60 100% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark, html.dark .sf-c-txt-yel html.var[data-theme='auto'] .sf-c-yellow\:90\:dark, html.var.auto .sf-c-yellow\:90\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 10%) } html.var[data-theme='auto'] .sf-c-yellow\:100\:dark, html.var.auto .sf-c-yellow\:100\:dark { color: hsl(60, 100%, 90%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow, html.auto .sf-c-txt-yellow { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:0, html.auto .sf-c-txt-yellow\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:10, html.auto .sf-c-txt-yellow\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:20, html.auto .sf-c-txt-yellow\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:30, html.auto .sf-c-txt-yellow\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:40, html.auto .sf-c-txt-yellow\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:50, html.auto .sf-c-txt-yellow\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:60, html.auto .sf-c-txt-yellow\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:70, html.auto .sf-c-txt-yellow\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:80, html.auto .sf-c-txt-yellow\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:90, html.auto .sf-c-txt-yellow\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:100, html.auto .sf-c-txt-yellow\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellow, html.var.auto .sf-c-txt-yellow { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:0, html.var.auto .sf-c-txt-yellow\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:10, html.var.auto .sf-c-txt-yellow\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:20, html.var.auto .sf-c-txt-yellow\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:30, html.var.auto .sf-c-txt-yellow\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:40, html.var.auto .sf-c-txt-yellow\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:50, html.var.auto .sf-c-txt-yellow\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:60, html.var.auto .sf-c-txt-yellow\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:70, html.var.auto .sf-c-txt-yellow\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:80, html.var.auto .sf-c-txt-yellow\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:90, html.var.auto .sf-c-txt-yellow\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:100, html.var.auto .sf-c-txt-yellow\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:dark, html.auto .sf-c-txt-yellow\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark, html.auto .sf-c-txt-yellow\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark, html.auto .sf-c-txt-yellow\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark, html.auto .sf-c-txt-yellow\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark, html.auto .sf-c-txt-yellow\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark, html.auto .sf-c-txt-yellow\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark, html.auto .sf-c-txt-yellow\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark, html.auto .sf-c-txt-yellow\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark, html.auto .sf-c-txt-yellow\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark, html.auto .sf-c-txt-yellow\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark, html.auto .sf-c-txt-yellow\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark, html.auto .sf-c-txt-yellow\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:dark, html.var.auto .sf-c-txt-yellow\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark, html.var.auto .sf-c-txt-yellow\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark, html.var.auto .sf-c-txt-yellow\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark, html.var.auto .sf-c-txt-yellow\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark, html.var.auto .sf-c-txt-yellow\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark, html.var.auto .sf-c-txt-yellow\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark, html.var.auto .sf-c-txt-yellow\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark, html.var.auto .sf-c-txt-yellow\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark, html.var.auto .sf-c-txt-yellow\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark, html.var.auto .sf-c-txt-yellow\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark, html.var.auto .sf-c-txt-yellow\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark, html.var.auto .sf-c-txt-yellow\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/10/yellowgreen.css b/src/colors/10/yellowgreen.css index 1325d49..57023cc 100644 --- a/src/colors/10/yellowgreen.css +++ b/src/colors/10/yellowgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='yellowgreen'] { --sf-c-yellowgreen: 80 61% 50%; --sf-c-yellowgreen-0: 80 61% 0%; --sf-c-yellowgreen-10: 80 61% 10%; @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-yellowgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-yellowgreen\:90\:dark, html.var.auto .sf-c-yellowgreen\:90\:dark { color: hsl(80, 61%, 90%); background: hsl(80, 61%, 10%) } html.var[data-theme='auto'] .sf-c-yellowgreen\:100\:dark, html.var.auto .sf-c-yellowgreen\:100\:dark { color: hsl(80, 61%, 90%); background: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen, html.auto .sf-c-txt-yellowgreen { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0, html.auto .sf-c-txt-yellowgreen\:0 { color: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10, html.auto .sf-c-txt-yellowgreen\:10 { color: hsl(80, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20, html.auto .sf-c-txt-yellowgreen\:20 { color: hsl(80, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30, html.auto .sf-c-txt-yellowgreen\:30 { color: hsl(80, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40, html.auto .sf-c-txt-yellowgreen\:40 { color: hsl(80, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50, html.auto .sf-c-txt-yellowgreen\:50 { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60, html.auto .sf-c-txt-yellowgreen\:60 { color: hsl(80, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70, html.auto .sf-c-txt-yellowgreen\:70 { color: hsl(80, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80, html.auto .sf-c-txt-yellowgreen\:80 { color: hsl(80, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90, html.auto .sf-c-txt-yellowgreen\:90 { color: hsl(80, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100, html.auto .sf-c-txt-yellowgreen\:100 { color: hsl(80, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen, html.var.auto .sf-c-txt-yellowgreen { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0, html.var.auto .sf-c-txt-yellowgreen\:0 { color: hsl(80, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10, html.var.auto .sf-c-txt-yellowgreen\:10 { color: hsl(80, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20, html.var.auto .sf-c-txt-yellowgreen\:20 { color: hsl(80, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30, html.var.auto .sf-c-txt-yellowgreen\:30 { color: hsl(80, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40, html.var.auto .sf-c-txt-yellowgreen\:40 { color: hsl(80, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50, html.var.auto .sf-c-txt-yellowgreen\:50 { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60, html.var.auto .sf-c-txt-yellowgreen\:60 { color: hsl(80, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70, html.var.auto .sf-c-txt-yellowgreen\:70 { color: hsl(80, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80, html.var.auto .sf-c-txt-yellowgreen\:80 { color: hsl(80, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90, html.var.auto .sf-c-txt-yellowgreen\:90 { color: hsl(80, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100, html.var.auto .sf-c-txt-yellowgreen\:100 { color: hsl(80, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:dark, html.auto .sf-c-txt-yellowgreen\:dark { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0\:dark, html.auto .sf-c-txt-yellowgreen\:0\:dark { color: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10\:dark, html.auto .sf-c-txt-yellowgreen\:10\:dark { color: hsl(80, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20\:dark, html.auto .sf-c-txt-yellowgreen\:20\:dark { color: hsl(80, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30\:dark, html.auto .sf-c-txt-yellowgreen\:30\:dark { color: hsl(80, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40\:dark, html.auto .sf-c-txt-yellowgreen\:40\:dark { color: hsl(80, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50\:dark, html.auto .sf-c-txt-yellowgreen\:50\:dark { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60\:dark, html.auto .sf-c-txt-yellowgreen\:60\:dark { color: hsl(80, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70\:dark, html.auto .sf-c-txt-yellowgreen\:70\:dark { color: hsl(80, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80\:dark, html.auto .sf-c-txt-yellowgreen\:80\:dark { color: hsl(80, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90\:dark, html.auto .sf-c-txt-yellowgreen\:90\:dark { color: hsl(80, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100\:dark, html.auto .sf-c-txt-yellowgreen\:100\:dark { color: hsl(80, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:dark, html.var.auto .sf-c-txt-yellowgreen\:dark { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0\:dark, html.var.auto .sf-c-txt-yellowgreen\:0\:dark { color: hsl(80, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10\:dark, html.var.auto .sf-c-txt-yellowgreen\:10\:dark { color: hsl(80, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20\:dark, html.var.auto .sf-c-txt-yellowgreen\:20\:dark { color: hsl(80, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30\:dark, html.var.auto .sf-c-txt-yellowgreen\:30\:dark { color: hsl(80, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40\:dark, html.var.auto .sf-c-txt-yellowgreen\:40\:dark { color: hsl(80, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50\:dark, html.var.auto .sf-c-txt-yellowgreen\:50\:dark { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60\:dark, html.var.auto .sf-c-txt-yellowgreen\:60\:dark { color: hsl(80, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70\:dark, html.var.auto .sf-c-txt-yellowgreen\:70\:dark { color: hsl(80, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80\:dark, html.var.auto .sf-c-txt-yellowgreen\:80\:dark { color: hsl(80, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90\:dark, html.var.auto .sf-c-txt-yellowgreen\:90\:dark { color: hsl(80, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100\:dark, html.var.auto .sf-c-txt-yellowgreen\:100\:dark { color: hsl(80, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/aliceblue.css b/src/colors/20/aliceblue.css index 7bb9cb2..6762b8f 100644 --- a/src/colors/20/aliceblue.css +++ b/src/colors/20/aliceblue.css @@ -1,4 +1,4 @@ -:root { +[class*='aliceblue'] { --sf-c-aliceblue: 208 100% 97%; --sf-c-aliceblue-0: 208 100% 0%; --sf-c-aliceblue-5: 208 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-aliceblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-aliceblue\:95\:dark, html.var.auto .sf-c-aliceblue\:95\:dark { color: hsl(208, 100%, 95%); background: hsl(208, 100%, 5%) } html.var[data-theme='auto'] .sf-c-aliceblue\:100\:dark, html.var.auto .sf-c-aliceblue\:100\:dark { color: hsl(208, 100%, 95%); background: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:5, html.auto .sf-c-txt-aliceblue\:5 { color: hsl(208, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:15, html.auto .sf-c-txt-aliceblue\:15 { color: hsl(208, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:25, html.auto .sf-c-txt-aliceblue\:25 { color: hsl(208, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:35, html.auto .sf-c-txt-aliceblue\:35 { color: hsl(208, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:45, html.auto .sf-c-txt-aliceblue\:45 { color: hsl(208, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:55, html.auto .sf-c-txt-aliceblue\:55 { color: hsl(208, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:65, html.auto .sf-c-txt-aliceblue\:65 { color: hsl(208, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:75, html.auto .sf-c-txt-aliceblue\:75 { color: hsl(208, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:85, html.auto .sf-c-txt-aliceblue\:85 { color: hsl(208, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:95, html.auto .sf-c-txt-aliceblue\:95 { color: hsl(208, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.var.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.var.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:5, html.var.auto .sf-c-txt-aliceblue\:5 { color: hsl(208, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.var.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:15, html.var.auto .sf-c-txt-aliceblue\:15 { color: hsl(208, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.var.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:25, html.var.auto .sf-c-txt-aliceblue\:25 { color: hsl(208, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.var.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:35, html.var.auto .sf-c-txt-aliceblue\:35 { color: hsl(208, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.var.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:45, html.var.auto .sf-c-txt-aliceblue\:45 { color: hsl(208, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.var.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:55, html.var.auto .sf-c-txt-aliceblue\:55 { color: hsl(208, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.var.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:65, html.var.auto .sf-c-txt-aliceblue\:65 { color: hsl(208, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.var.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:75, html.var.auto .sf-c-txt-aliceblue\:75 { color: hsl(208, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.var.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:85, html.var.auto .sf-c-txt-aliceblue\:85 { color: hsl(208, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.var.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:95, html.var.auto .sf-c-txt-aliceblue\:95 { color: hsl(208, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.var.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:5\:dark, html.auto .sf-c-txt-aliceblue\:5\:dark { color: hsl(208, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:15\:dark, html.auto .sf-c-txt-aliceblue\:15\:dark { color: hsl(208, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:25\:dark, html.auto .sf-c-txt-aliceblue\:25\:dark { color: hsl(208, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:35\:dark, html.auto .sf-c-txt-aliceblue\:35\:dark { color: hsl(208, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:45\:dark, html.auto .sf-c-txt-aliceblue\:45\:dark { color: hsl(208, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:55\:dark, html.auto .sf-c-txt-aliceblue\:55\:dark { color: hsl(208, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:65\:dark, html.auto .sf-c-txt-aliceblue\:65\:dark { color: hsl(208, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:75\:dark, html.auto .sf-c-txt-aliceblue\:75\:dark { color: hsl(208, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:85\:dark, html.auto .sf-c-txt-aliceblue\:85\:dark { color: hsl(208, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:95\:dark, html.auto .sf-c-txt-aliceblue\:95\:dark { color: hsl(208, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.var.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.var.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:5\:dark, html.var.auto .sf-c-txt-aliceblue\:5\:dark { color: hsl(208, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.var.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:15\:dark, html.var.auto .sf-c-txt-aliceblue\:15\:dark { color: hsl(208, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.var.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:25\:dark, html.var.auto .sf-c-txt-aliceblue\:25\:dark { color: hsl(208, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.var.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:35\:dark, html.var.auto .sf-c-txt-aliceblue\:35\:dark { color: hsl(208, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.var.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:45\:dark, html.var.auto .sf-c-txt-aliceblue\:45\:dark { color: hsl(208, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.var.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:55\:dark, html.var.auto .sf-c-txt-aliceblue\:55\:dark { color: hsl(208, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.var.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:65\:dark, html.var.auto .sf-c-txt-aliceblue\:65\:dark { color: hsl(208, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.var.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:75\:dark, html.var.auto .sf-c-txt-aliceblue\:75\:dark { color: hsl(208, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.var.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:85\:dark, html.var.auto .sf-c-txt-aliceblue\:85\:dark { color: hsl(208, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.var.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:95\:dark, html.var.auto .sf-c-txt-aliceblue\:95\:dark { color: hsl(208, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.var.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/antiquewhite.css b/src/colors/20/antiquewhite.css index c507f2a..cf6ff5e 100644 --- a/src/colors/20/antiquewhite.css +++ b/src/colors/20/antiquewhite.css @@ -1,4 +1,4 @@ -:root { +[class*='antiquewhite'] { --sf-c-antiquewhite: 34 78% 91%; --sf-c-antiquewhite-0: 34 78% 0%; --sf-c-antiquewhite-5: 34 78% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-antiquewhite\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-antiquewhite\:95\:dark, html.var.auto .sf-c-antiquewhite\:95\:dark { color: hsl(34, 78%, 95%); background: hsl(34, 78%, 5%) } html.var[data-theme='auto'] .sf-c-antiquewhite\:100\:dark, html.var.auto .sf-c-antiquewhite\:100\:dark { color: hsl(34, 78%, 95%); background: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite, html.auto .sf-c-txt-antiquewhite { color: hsl(34, 78%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0, html.auto .sf-c-txt-antiquewhite\:0 { color: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:5, html.auto .sf-c-txt-antiquewhite\:5 { color: hsl(34, 78%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10, html.auto .sf-c-txt-antiquewhite\:10 { color: hsl(34, 78%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:15, html.auto .sf-c-txt-antiquewhite\:15 { color: hsl(34, 78%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20, html.auto .sf-c-txt-antiquewhite\:20 { color: hsl(34, 78%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:25, html.auto .sf-c-txt-antiquewhite\:25 { color: hsl(34, 78%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30, html.auto .sf-c-txt-antiquewhite\:30 { color: hsl(34, 78%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:35, html.auto .sf-c-txt-antiquewhite\:35 { color: hsl(34, 78%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40, html.auto .sf-c-txt-antiquewhite\:40 { color: hsl(34, 78%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:45, html.auto .sf-c-txt-antiquewhite\:45 { color: hsl(34, 78%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50, html.auto .sf-c-txt-antiquewhite\:50 { color: hsl(34, 78%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:55, html.auto .sf-c-txt-antiquewhite\:55 { color: hsl(34, 78%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60, html.auto .sf-c-txt-antiquewhite\:60 { color: hsl(34, 78%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:65, html.auto .sf-c-txt-antiquewhite\:65 { color: hsl(34, 78%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70, html.auto .sf-c-txt-antiquewhite\:70 { color: hsl(34, 78%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:75, html.auto .sf-c-txt-antiquewhite\:75 { color: hsl(34, 78%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80, html.auto .sf-c-txt-antiquewhite\:80 { color: hsl(34, 78%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:85, html.auto .sf-c-txt-antiquewhite\:85 { color: hsl(34, 78%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90, html.auto .sf-c-txt-antiquewhite\:90 { color: hsl(34, 78%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:95, html.auto .sf-c-txt-antiquewhite\:95 { color: hsl(34, 78%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100, html.auto .sf-c-txt-antiquewhite\:100 { color: hsl(34, 78%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite, html.var.auto .sf-c-txt-antiquewhite { color: hsl(34, 78%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0, html.var.auto .sf-c-txt-antiquewhite\:0 { color: hsl(34, 78%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:5, html.var.auto .sf-c-txt-antiquewhite\:5 { color: hsl(34, 78%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10, html.var.auto .sf-c-txt-antiquewhite\:10 { color: hsl(34, 78%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:15, html.var.auto .sf-c-txt-antiquewhite\:15 { color: hsl(34, 78%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20, html.var.auto .sf-c-txt-antiquewhite\:20 { color: hsl(34, 78%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:25, html.var.auto .sf-c-txt-antiquewhite\:25 { color: hsl(34, 78%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30, html.var.auto .sf-c-txt-antiquewhite\:30 { color: hsl(34, 78%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:35, html.var.auto .sf-c-txt-antiquewhite\:35 { color: hsl(34, 78%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40, html.var.auto .sf-c-txt-antiquewhite\:40 { color: hsl(34, 78%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:45, html.var.auto .sf-c-txt-antiquewhite\:45 { color: hsl(34, 78%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50, html.var.auto .sf-c-txt-antiquewhite\:50 { color: hsl(34, 78%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:55, html.var.auto .sf-c-txt-antiquewhite\:55 { color: hsl(34, 78%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60, html.var.auto .sf-c-txt-antiquewhite\:60 { color: hsl(34, 78%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:65, html.var.auto .sf-c-txt-antiquewhite\:65 { color: hsl(34, 78%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70, html.var.auto .sf-c-txt-antiquewhite\:70 { color: hsl(34, 78%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:75, html.var.auto .sf-c-txt-antiquewhite\:75 { color: hsl(34, 78%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80, html.var.auto .sf-c-txt-antiquewhite\:80 { color: hsl(34, 78%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:85, html.var.auto .sf-c-txt-antiquewhite\:85 { color: hsl(34, 78%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90, html.var.auto .sf-c-txt-antiquewhite\:90 { color: hsl(34, 78%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:95, html.var.auto .sf-c-txt-antiquewhite\:95 { color: hsl(34, 78%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100, html.var.auto .sf-c-txt-antiquewhite\:100 { color: hsl(34, 78%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:dark, html.auto .sf-c-txt-antiquewhite\:dark { color: hsl(34, 78%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0\:dark, html.auto .sf-c-txt-antiquewhite\:0\:dark { color: hsl(34, 78%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:5\:dark, html.auto .sf-c-txt-antiquewhite\:5\:dark { color: hsl(34, 78%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10\:dark, html.auto .sf-c-txt-antiquewhite\:10\:dark { color: hsl(34, 78%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:15\:dark, html.auto .sf-c-txt-antiquewhite\:15\:dark { color: hsl(34, 78%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20\:dark, html.auto .sf-c-txt-antiquewhite\:20\:dark { color: hsl(34, 78%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:25\:dark, html.auto .sf-c-txt-antiquewhite\:25\:dark { color: hsl(34, 78%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30\:dark, html.auto .sf-c-txt-antiquewhite\:30\:dark { color: hsl(34, 78%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:35\:dark, html.auto .sf-c-txt-antiquewhite\:35\:dark { color: hsl(34, 78%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40\:dark, html.auto .sf-c-txt-antiquewhite\:40\:dark { color: hsl(34, 78%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:45\:dark, html.auto .sf-c-txt-antiquewhite\:45\:dark { color: hsl(34, 78%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50\:dark, html.auto .sf-c-txt-antiquewhite\:50\:dark { color: hsl(34, 78%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:55\:dark, html.auto .sf-c-txt-antiquewhite\:55\:dark { color: hsl(34, 78%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60\:dark, html.auto .sf-c-txt-antiquewhite\:60\:dark { color: hsl(34, 78%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:65\:dark, html.auto .sf-c-txt-antiquewhite\:65\:dark { color: hsl(34, 78%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70\:dark, html.auto .sf-c-txt-antiquewhite\:70\:dark { color: hsl(34, 78%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:75\:dark, html.auto .sf-c-txt-antiquewhite\:75\:dark { color: hsl(34, 78%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80\:dark, html.auto .sf-c-txt-antiquewhite\:80\:dark { color: hsl(34, 78%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:85\:dark, html.auto .sf-c-txt-antiquewhite\:85\:dark { color: hsl(34, 78%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90\:dark, html.auto .sf-c-txt-antiquewhite\:90\:dark { color: hsl(34, 78%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:95\:dark, html.auto .sf-c-txt-antiquewhite\:95\:dark { color: hsl(34, 78%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100\:dark, html.auto .sf-c-txt-antiquewhite\:100\:dark { color: hsl(34, 78%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:dark, html.var.auto .sf-c-txt-antiquewhite\:dark { color: hsl(34, 78%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:0\:dark, html.var.auto .sf-c-txt-antiquewhite\:0\:dark { color: hsl(34, 78%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:5\:dark, html.var.auto .sf-c-txt-antiquewhite\:5\:dark { color: hsl(34, 78%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:10\:dark, html.var.auto .sf-c-txt-antiquewhite\:10\:dark { color: hsl(34, 78%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:15\:dark, html.var.auto .sf-c-txt-antiquewhite\:15\:dark { color: hsl(34, 78%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:20\:dark, html.var.auto .sf-c-txt-antiquewhite\:20\:dark { color: hsl(34, 78%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:25\:dark, html.var.auto .sf-c-txt-antiquewhite\:25\:dark { color: hsl(34, 78%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:30\:dark, html.var.auto .sf-c-txt-antiquewhite\:30\:dark { color: hsl(34, 78%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:35\:dark, html.var.auto .sf-c-txt-antiquewhite\:35\:dark { color: hsl(34, 78%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:40\:dark, html.var.auto .sf-c-txt-antiquewhite\:40\:dark { color: hsl(34, 78%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:45\:dark, html.var.auto .sf-c-txt-antiquewhite\:45\:dark { color: hsl(34, 78%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:50\:dark, html.var.auto .sf-c-txt-antiquewhite\:50\:dark { color: hsl(34, 78%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:55\:dark, html.var.auto .sf-c-txt-antiquewhite\:55\:dark { color: hsl(34, 78%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:60\:dark, html.var.auto .sf-c-txt-antiquewhite\:60\:dark { color: hsl(34, 78%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:65\:dark, html.var.auto .sf-c-txt-antiquewhite\:65\:dark { color: hsl(34, 78%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:70\:dark, html.var.auto .sf-c-txt-antiquewhite\:70\:dark { color: hsl(34, 78%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:75\:dark, html.var.auto .sf-c-txt-antiquewhite\:75\:dark { color: hsl(34, 78%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:80\:dark, html.var.auto .sf-c-txt-antiquewhite\:80\:dark { color: hsl(34, 78%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:85\:dark, html.var.auto .sf-c-txt-antiquewhite\:85\:dark { color: hsl(34, 78%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:90\:dark, html.var.auto .sf-c-txt-antiquewhite\:90\:dark { color: hsl(34, 78%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:95\:dark, html.var.auto .sf-c-txt-antiquewhite\:95\:dark { color: hsl(34, 78%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-antiquewhite\:100\:dark, html.var.auto .sf-c-txt-antiquewhite\:100\:dark { color: hsl(34, 78%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/aqua.css b/src/colors/20/aqua.css index 76a492b..08ccd7f 100644 --- a/src/colors/20/aqua.css +++ b/src/colors/20/aqua.css @@ -1,4 +1,4 @@ -:root { +[class*='aqua'] { --sf-c-aqua: 180 100% 50%; --sf-c-aqua-0: 180 100% 0%; --sf-c-aqua-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-aqua\:100\:dark, html.dark .sf-c-txt-aqua\ html.var[data-theme='auto'] .sf-c-aqua\:95\:dark, html.var.auto .sf-c-aqua\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-aqua\:100\:dark, html.var.auto .sf-c-aqua\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua, html.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:5, html.auto .sf-c-txt-aqua\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:15, html.auto .sf-c-txt-aqua\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:25, html.auto .sf-c-txt-aqua\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:35, html.auto .sf-c-txt-aqua\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:45, html.auto .sf-c-txt-aqua\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:55, html.auto .sf-c-txt-aqua\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:65, html.auto .sf-c-txt-aqua\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:75, html.auto .sf-c-txt-aqua\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:85, html.auto .sf-c-txt-aqua\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:95, html.auto .sf-c-txt-aqua\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aqua, html.var.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.var.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:5, html.var.auto .sf-c-txt-aqua\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.var.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:15, html.var.auto .sf-c-txt-aqua\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.var.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:25, html.var.auto .sf-c-txt-aqua\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.var.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:35, html.var.auto .sf-c-txt-aqua\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.var.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:45, html.var.auto .sf-c-txt-aqua\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.var.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:55, html.var.auto .sf-c-txt-aqua\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.var.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:65, html.var.auto .sf-c-txt-aqua\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.var.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:75, html.var.auto .sf-c-txt-aqua\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.var.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:85, html.var.auto .sf-c-txt-aqua\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.var.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:95, html.var.auto .sf-c-txt-aqua\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.var.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:5\:dark, html.auto .sf-c-txt-aqua\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:15\:dark, html.auto .sf-c-txt-aqua\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:25\:dark, html.auto .sf-c-txt-aqua\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:35\:dark, html.auto .sf-c-txt-aqua\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:45\:dark, html.auto .sf-c-txt-aqua\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:55\:dark, html.auto .sf-c-txt-aqua\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:65\:dark, html.auto .sf-c-txt-aqua\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:75\:dark, html.auto .sf-c-txt-aqua\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:85\:dark, html.auto .sf-c-txt-aqua\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:95\:dark, html.auto .sf-c-txt-aqua\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.var.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.var.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:5\:dark, html.var.auto .sf-c-txt-aqua\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.var.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:15\:dark, html.var.auto .sf-c-txt-aqua\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.var.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:25\:dark, html.var.auto .sf-c-txt-aqua\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.var.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:35\:dark, html.var.auto .sf-c-txt-aqua\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.var.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:45\:dark, html.var.auto .sf-c-txt-aqua\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.var.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:55\:dark, html.var.auto .sf-c-txt-aqua\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.var.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:65\:dark, html.var.auto .sf-c-txt-aqua\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.var.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:75\:dark, html.var.auto .sf-c-txt-aqua\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.var.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:85\:dark, html.var.auto .sf-c-txt-aqua\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.var.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:95\:dark, html.var.auto .sf-c-txt-aqua\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.var.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/aquamarine.css b/src/colors/20/aquamarine.css index 243ba3d..01d6de1 100644 --- a/src/colors/20/aquamarine.css +++ b/src/colors/20/aquamarine.css @@ -1,4 +1,4 @@ -:root { +[class*='aquamarine'] { --sf-c-aquamarine: 160 100% 75%; --sf-c-aquamarine-0: 160 100% 0%; --sf-c-aquamarine-5: 160 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-aquamarine\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-aquamarine\:95\:dark, html.var.auto .sf-c-aquamarine\:95\:dark { color: hsl(160, 100%, 95%); background: hsl(160, 100%, 5%) } html.var[data-theme='auto'] .sf-c-aquamarine\:100\:dark, html.var.auto .sf-c-aquamarine\:100\:dark { color: hsl(160, 100%, 95%); background: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine, html.auto .sf-c-txt-aquamarine { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0, html.auto .sf-c-txt-aquamarine\:0 { color: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:5, html.auto .sf-c-txt-aquamarine\:5 { color: hsl(160, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10, html.auto .sf-c-txt-aquamarine\:10 { color: hsl(160, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:15, html.auto .sf-c-txt-aquamarine\:15 { color: hsl(160, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20, html.auto .sf-c-txt-aquamarine\:20 { color: hsl(160, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:25, html.auto .sf-c-txt-aquamarine\:25 { color: hsl(160, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30, html.auto .sf-c-txt-aquamarine\:30 { color: hsl(160, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:35, html.auto .sf-c-txt-aquamarine\:35 { color: hsl(160, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40, html.auto .sf-c-txt-aquamarine\:40 { color: hsl(160, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:45, html.auto .sf-c-txt-aquamarine\:45 { color: hsl(160, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50, html.auto .sf-c-txt-aquamarine\:50 { color: hsl(160, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:55, html.auto .sf-c-txt-aquamarine\:55 { color: hsl(160, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60, html.auto .sf-c-txt-aquamarine\:60 { color: hsl(160, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:65, html.auto .sf-c-txt-aquamarine\:65 { color: hsl(160, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70, html.auto .sf-c-txt-aquamarine\:70 { color: hsl(160, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:75, html.auto .sf-c-txt-aquamarine\:75 { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80, html.auto .sf-c-txt-aquamarine\:80 { color: hsl(160, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:85, html.auto .sf-c-txt-aquamarine\:85 { color: hsl(160, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90, html.auto .sf-c-txt-aquamarine\:90 { color: hsl(160, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:95, html.auto .sf-c-txt-aquamarine\:95 { color: hsl(160, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100, html.auto .sf-c-txt-aquamarine\:100 { color: hsl(160, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine, html.var.auto .sf-c-txt-aquamarine { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0, html.var.auto .sf-c-txt-aquamarine\:0 { color: hsl(160, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:5, html.var.auto .sf-c-txt-aquamarine\:5 { color: hsl(160, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10, html.var.auto .sf-c-txt-aquamarine\:10 { color: hsl(160, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:15, html.var.auto .sf-c-txt-aquamarine\:15 { color: hsl(160, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20, html.var.auto .sf-c-txt-aquamarine\:20 { color: hsl(160, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:25, html.var.auto .sf-c-txt-aquamarine\:25 { color: hsl(160, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30, html.var.auto .sf-c-txt-aquamarine\:30 { color: hsl(160, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:35, html.var.auto .sf-c-txt-aquamarine\:35 { color: hsl(160, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40, html.var.auto .sf-c-txt-aquamarine\:40 { color: hsl(160, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:45, html.var.auto .sf-c-txt-aquamarine\:45 { color: hsl(160, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50, html.var.auto .sf-c-txt-aquamarine\:50 { color: hsl(160, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:55, html.var.auto .sf-c-txt-aquamarine\:55 { color: hsl(160, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60, html.var.auto .sf-c-txt-aquamarine\:60 { color: hsl(160, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:65, html.var.auto .sf-c-txt-aquamarine\:65 { color: hsl(160, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70, html.var.auto .sf-c-txt-aquamarine\:70 { color: hsl(160, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:75, html.var.auto .sf-c-txt-aquamarine\:75 { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80, html.var.auto .sf-c-txt-aquamarine\:80 { color: hsl(160, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:85, html.var.auto .sf-c-txt-aquamarine\:85 { color: hsl(160, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90, html.var.auto .sf-c-txt-aquamarine\:90 { color: hsl(160, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:95, html.var.auto .sf-c-txt-aquamarine\:95 { color: hsl(160, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100, html.var.auto .sf-c-txt-aquamarine\:100 { color: hsl(160, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:dark, html.auto .sf-c-txt-aquamarine\:dark { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0\:dark, html.auto .sf-c-txt-aquamarine\:0\:dark { color: hsl(160, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:5\:dark, html.auto .sf-c-txt-aquamarine\:5\:dark { color: hsl(160, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10\:dark, html.auto .sf-c-txt-aquamarine\:10\:dark { color: hsl(160, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:15\:dark, html.auto .sf-c-txt-aquamarine\:15\:dark { color: hsl(160, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20\:dark, html.auto .sf-c-txt-aquamarine\:20\:dark { color: hsl(160, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:25\:dark, html.auto .sf-c-txt-aquamarine\:25\:dark { color: hsl(160, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30\:dark, html.auto .sf-c-txt-aquamarine\:30\:dark { color: hsl(160, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:35\:dark, html.auto .sf-c-txt-aquamarine\:35\:dark { color: hsl(160, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40\:dark, html.auto .sf-c-txt-aquamarine\:40\:dark { color: hsl(160, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:45\:dark, html.auto .sf-c-txt-aquamarine\:45\:dark { color: hsl(160, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50\:dark, html.auto .sf-c-txt-aquamarine\:50\:dark { color: hsl(160, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:55\:dark, html.auto .sf-c-txt-aquamarine\:55\:dark { color: hsl(160, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60\:dark, html.auto .sf-c-txt-aquamarine\:60\:dark { color: hsl(160, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:65\:dark, html.auto .sf-c-txt-aquamarine\:65\:dark { color: hsl(160, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70\:dark, html.auto .sf-c-txt-aquamarine\:70\:dark { color: hsl(160, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:75\:dark, html.auto .sf-c-txt-aquamarine\:75\:dark { color: hsl(160, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80\:dark, html.auto .sf-c-txt-aquamarine\:80\:dark { color: hsl(160, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:85\:dark, html.auto .sf-c-txt-aquamarine\:85\:dark { color: hsl(160, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90\:dark, html.auto .sf-c-txt-aquamarine\:90\:dark { color: hsl(160, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:95\:dark, html.auto .sf-c-txt-aquamarine\:95\:dark { color: hsl(160, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100\:dark, html.auto .sf-c-txt-aquamarine\:100\:dark { color: hsl(160, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:dark, html.var.auto .sf-c-txt-aquamarine\:dark { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:0\:dark, html.var.auto .sf-c-txt-aquamarine\:0\:dark { color: hsl(160, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:5\:dark, html.var.auto .sf-c-txt-aquamarine\:5\:dark { color: hsl(160, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:10\:dark, html.var.auto .sf-c-txt-aquamarine\:10\:dark { color: hsl(160, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:15\:dark, html.var.auto .sf-c-txt-aquamarine\:15\:dark { color: hsl(160, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:20\:dark, html.var.auto .sf-c-txt-aquamarine\:20\:dark { color: hsl(160, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:25\:dark, html.var.auto .sf-c-txt-aquamarine\:25\:dark { color: hsl(160, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:30\:dark, html.var.auto .sf-c-txt-aquamarine\:30\:dark { color: hsl(160, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:35\:dark, html.var.auto .sf-c-txt-aquamarine\:35\:dark { color: hsl(160, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:40\:dark, html.var.auto .sf-c-txt-aquamarine\:40\:dark { color: hsl(160, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:45\:dark, html.var.auto .sf-c-txt-aquamarine\:45\:dark { color: hsl(160, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:50\:dark, html.var.auto .sf-c-txt-aquamarine\:50\:dark { color: hsl(160, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:55\:dark, html.var.auto .sf-c-txt-aquamarine\:55\:dark { color: hsl(160, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:60\:dark, html.var.auto .sf-c-txt-aquamarine\:60\:dark { color: hsl(160, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:65\:dark, html.var.auto .sf-c-txt-aquamarine\:65\:dark { color: hsl(160, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:70\:dark, html.var.auto .sf-c-txt-aquamarine\:70\:dark { color: hsl(160, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:75\:dark, html.var.auto .sf-c-txt-aquamarine\:75\:dark { color: hsl(160, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:80\:dark, html.var.auto .sf-c-txt-aquamarine\:80\:dark { color: hsl(160, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:85\:dark, html.var.auto .sf-c-txt-aquamarine\:85\:dark { color: hsl(160, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:90\:dark, html.var.auto .sf-c-txt-aquamarine\:90\:dark { color: hsl(160, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:95\:dark, html.var.auto .sf-c-txt-aquamarine\:95\:dark { color: hsl(160, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-aquamarine\:100\:dark, html.var.auto .sf-c-txt-aquamarine\:100\:dark { color: hsl(160, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/azure.css b/src/colors/20/azure.css index 4866266..cc0264e 100644 --- a/src/colors/20/azure.css +++ b/src/colors/20/azure.css @@ -1,4 +1,4 @@ -:root { +[class*='azure'] { --sf-c-azure: 180 100% 97%; --sf-c-azure-0: 180 100% 0%; --sf-c-azure-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-azure\:100\:dark, html.dark .sf-c-txt-azur html.var[data-theme='auto'] .sf-c-azure\:95\:dark, html.var.auto .sf-c-azure\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-azure\:100\:dark, html.var.auto .sf-c-azure\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure, html.auto .sf-c-txt-azure { color: hsl(180, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:0, html.auto .sf-c-txt-azure\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:5, html.auto .sf-c-txt-azure\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:10, html.auto .sf-c-txt-azure\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:15, html.auto .sf-c-txt-azure\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:20, html.auto .sf-c-txt-azure\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:25, html.auto .sf-c-txt-azure\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:30, html.auto .sf-c-txt-azure\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:35, html.auto .sf-c-txt-azure\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:40, html.auto .sf-c-txt-azure\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:45, html.auto .sf-c-txt-azure\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:50, html.auto .sf-c-txt-azure\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:55, html.auto .sf-c-txt-azure\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:60, html.auto .sf-c-txt-azure\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:65, html.auto .sf-c-txt-azure\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:70, html.auto .sf-c-txt-azure\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:75, html.auto .sf-c-txt-azure\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:80, html.auto .sf-c-txt-azure\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:85, html.auto .sf-c-txt-azure\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:90, html.auto .sf-c-txt-azure\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:95, html.auto .sf-c-txt-azure\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:100, html.auto .sf-c-txt-azure\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-azure, html.var.auto .sf-c-txt-azure { color: hsl(180, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:0, html.var.auto .sf-c-txt-azure\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:5, html.var.auto .sf-c-txt-azure\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:10, html.var.auto .sf-c-txt-azure\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:15, html.var.auto .sf-c-txt-azure\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:20, html.var.auto .sf-c-txt-azure\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:25, html.var.auto .sf-c-txt-azure\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:30, html.var.auto .sf-c-txt-azure\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:35, html.var.auto .sf-c-txt-azure\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:40, html.var.auto .sf-c-txt-azure\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:45, html.var.auto .sf-c-txt-azure\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:50, html.var.auto .sf-c-txt-azure\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:55, html.var.auto .sf-c-txt-azure\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:60, html.var.auto .sf-c-txt-azure\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:65, html.var.auto .sf-c-txt-azure\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:70, html.var.auto .sf-c-txt-azure\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:75, html.var.auto .sf-c-txt-azure\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:80, html.var.auto .sf-c-txt-azure\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:85, html.var.auto .sf-c-txt-azure\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:90, html.var.auto .sf-c-txt-azure\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:95, html.var.auto .sf-c-txt-azure\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:100, html.var.auto .sf-c-txt-azure\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:dark, html.auto .sf-c-txt-azure\:dark { color: hsl(180, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:0\:dark, html.auto .sf-c-txt-azure\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:5\:dark, html.auto .sf-c-txt-azure\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:10\:dark, html.auto .sf-c-txt-azure\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:15\:dark, html.auto .sf-c-txt-azure\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:20\:dark, html.auto .sf-c-txt-azure\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:25\:dark, html.auto .sf-c-txt-azure\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:30\:dark, html.auto .sf-c-txt-azure\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:35\:dark, html.auto .sf-c-txt-azure\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:40\:dark, html.auto .sf-c-txt-azure\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:45\:dark, html.auto .sf-c-txt-azure\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:50\:dark, html.auto .sf-c-txt-azure\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:55\:dark, html.auto .sf-c-txt-azure\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:60\:dark, html.auto .sf-c-txt-azure\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:65\:dark, html.auto .sf-c-txt-azure\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:70\:dark, html.auto .sf-c-txt-azure\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:75\:dark, html.auto .sf-c-txt-azure\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:80\:dark, html.auto .sf-c-txt-azure\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:85\:dark, html.auto .sf-c-txt-azure\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:90\:dark, html.auto .sf-c-txt-azure\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:95\:dark, html.auto .sf-c-txt-azure\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-azure\:100\:dark, html.auto .sf-c-txt-azure\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:dark, html.var.auto .sf-c-txt-azure\:dark { color: hsl(180, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:0\:dark, html.var.auto .sf-c-txt-azure\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:5\:dark, html.var.auto .sf-c-txt-azure\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:10\:dark, html.var.auto .sf-c-txt-azure\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:15\:dark, html.var.auto .sf-c-txt-azure\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:20\:dark, html.var.auto .sf-c-txt-azure\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:25\:dark, html.var.auto .sf-c-txt-azure\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:30\:dark, html.var.auto .sf-c-txt-azure\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:35\:dark, html.var.auto .sf-c-txt-azure\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:40\:dark, html.var.auto .sf-c-txt-azure\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:45\:dark, html.var.auto .sf-c-txt-azure\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:50\:dark, html.var.auto .sf-c-txt-azure\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:55\:dark, html.var.auto .sf-c-txt-azure\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:60\:dark, html.var.auto .sf-c-txt-azure\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:65\:dark, html.var.auto .sf-c-txt-azure\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:70\:dark, html.var.auto .sf-c-txt-azure\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:75\:dark, html.var.auto .sf-c-txt-azure\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:80\:dark, html.var.auto .sf-c-txt-azure\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:85\:dark, html.var.auto .sf-c-txt-azure\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:90\:dark, html.var.auto .sf-c-txt-azure\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:95\:dark, html.var.auto .sf-c-txt-azure\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-azure\:100\:dark, html.var.auto .sf-c-txt-azure\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/beige.css b/src/colors/20/beige.css index ef2284b..673a6c0 100644 --- a/src/colors/20/beige.css +++ b/src/colors/20/beige.css @@ -1,4 +1,4 @@ -:root { +[class*='beige'] { --sf-c-beige: 60 56% 91%; --sf-c-beige-0: 60 56% 0%; --sf-c-beige-5: 60 56% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-beige\:100\:dark, html.dark .sf-c-txt-beig html.var[data-theme='auto'] .sf-c-beige\:95\:dark, html.var.auto .sf-c-beige\:95\:dark { color: hsl(60, 56%, 95%); background: hsl(60, 56%, 5%) } html.var[data-theme='auto'] .sf-c-beige\:100\:dark, html.var.auto .sf-c-beige\:100\:dark { color: hsl(60, 56%, 95%); background: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige, html.auto .sf-c-txt-beige { color: hsl(60, 56%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:0, html.auto .sf-c-txt-beige\:0 { color: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:5, html.auto .sf-c-txt-beige\:5 { color: hsl(60, 56%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:10, html.auto .sf-c-txt-beige\:10 { color: hsl(60, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:15, html.auto .sf-c-txt-beige\:15 { color: hsl(60, 56%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:20, html.auto .sf-c-txt-beige\:20 { color: hsl(60, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:25, html.auto .sf-c-txt-beige\:25 { color: hsl(60, 56%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:30, html.auto .sf-c-txt-beige\:30 { color: hsl(60, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:35, html.auto .sf-c-txt-beige\:35 { color: hsl(60, 56%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:40, html.auto .sf-c-txt-beige\:40 { color: hsl(60, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:45, html.auto .sf-c-txt-beige\:45 { color: hsl(60, 56%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:50, html.auto .sf-c-txt-beige\:50 { color: hsl(60, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:55, html.auto .sf-c-txt-beige\:55 { color: hsl(60, 56%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:60, html.auto .sf-c-txt-beige\:60 { color: hsl(60, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:65, html.auto .sf-c-txt-beige\:65 { color: hsl(60, 56%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:70, html.auto .sf-c-txt-beige\:70 { color: hsl(60, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:75, html.auto .sf-c-txt-beige\:75 { color: hsl(60, 56%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:80, html.auto .sf-c-txt-beige\:80 { color: hsl(60, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:85, html.auto .sf-c-txt-beige\:85 { color: hsl(60, 56%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:90, html.auto .sf-c-txt-beige\:90 { color: hsl(60, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:95, html.auto .sf-c-txt-beige\:95 { color: hsl(60, 56%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:100, html.auto .sf-c-txt-beige\:100 { color: hsl(60, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-beige, html.var.auto .sf-c-txt-beige { color: hsl(60, 56%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:0, html.var.auto .sf-c-txt-beige\:0 { color: hsl(60, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:5, html.var.auto .sf-c-txt-beige\:5 { color: hsl(60, 56%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:10, html.var.auto .sf-c-txt-beige\:10 { color: hsl(60, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:15, html.var.auto .sf-c-txt-beige\:15 { color: hsl(60, 56%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:20, html.var.auto .sf-c-txt-beige\:20 { color: hsl(60, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:25, html.var.auto .sf-c-txt-beige\:25 { color: hsl(60, 56%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:30, html.var.auto .sf-c-txt-beige\:30 { color: hsl(60, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:35, html.var.auto .sf-c-txt-beige\:35 { color: hsl(60, 56%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:40, html.var.auto .sf-c-txt-beige\:40 { color: hsl(60, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:45, html.var.auto .sf-c-txt-beige\:45 { color: hsl(60, 56%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:50, html.var.auto .sf-c-txt-beige\:50 { color: hsl(60, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:55, html.var.auto .sf-c-txt-beige\:55 { color: hsl(60, 56%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:60, html.var.auto .sf-c-txt-beige\:60 { color: hsl(60, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:65, html.var.auto .sf-c-txt-beige\:65 { color: hsl(60, 56%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:70, html.var.auto .sf-c-txt-beige\:70 { color: hsl(60, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:75, html.var.auto .sf-c-txt-beige\:75 { color: hsl(60, 56%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:80, html.var.auto .sf-c-txt-beige\:80 { color: hsl(60, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:85, html.var.auto .sf-c-txt-beige\:85 { color: hsl(60, 56%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:90, html.var.auto .sf-c-txt-beige\:90 { color: hsl(60, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:95, html.var.auto .sf-c-txt-beige\:95 { color: hsl(60, 56%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:100, html.var.auto .sf-c-txt-beige\:100 { color: hsl(60, 56%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:dark, html.auto .sf-c-txt-beige\:dark { color: hsl(60, 56%, 91%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:0\:dark, html.auto .sf-c-txt-beige\:0\:dark { color: hsl(60, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:5\:dark, html.auto .sf-c-txt-beige\:5\:dark { color: hsl(60, 56%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:10\:dark, html.auto .sf-c-txt-beige\:10\:dark { color: hsl(60, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:15\:dark, html.auto .sf-c-txt-beige\:15\:dark { color: hsl(60, 56%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:20\:dark, html.auto .sf-c-txt-beige\:20\:dark { color: hsl(60, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:25\:dark, html.auto .sf-c-txt-beige\:25\:dark { color: hsl(60, 56%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:30\:dark, html.auto .sf-c-txt-beige\:30\:dark { color: hsl(60, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:35\:dark, html.auto .sf-c-txt-beige\:35\:dark { color: hsl(60, 56%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:40\:dark, html.auto .sf-c-txt-beige\:40\:dark { color: hsl(60, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:45\:dark, html.auto .sf-c-txt-beige\:45\:dark { color: hsl(60, 56%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:50\:dark, html.auto .sf-c-txt-beige\:50\:dark { color: hsl(60, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:55\:dark, html.auto .sf-c-txt-beige\:55\:dark { color: hsl(60, 56%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:60\:dark, html.auto .sf-c-txt-beige\:60\:dark { color: hsl(60, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:65\:dark, html.auto .sf-c-txt-beige\:65\:dark { color: hsl(60, 56%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:70\:dark, html.auto .sf-c-txt-beige\:70\:dark { color: hsl(60, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:75\:dark, html.auto .sf-c-txt-beige\:75\:dark { color: hsl(60, 56%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:80\:dark, html.auto .sf-c-txt-beige\:80\:dark { color: hsl(60, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:85\:dark, html.auto .sf-c-txt-beige\:85\:dark { color: hsl(60, 56%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:90\:dark, html.auto .sf-c-txt-beige\:90\:dark { color: hsl(60, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:95\:dark, html.auto .sf-c-txt-beige\:95\:dark { color: hsl(60, 56%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-beige\:100\:dark, html.auto .sf-c-txt-beige\:100\:dark { color: hsl(60, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:dark, html.var.auto .sf-c-txt-beige\:dark { color: hsl(60, 56%, 91%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:0\:dark, html.var.auto .sf-c-txt-beige\:0\:dark { color: hsl(60, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:5\:dark, html.var.auto .sf-c-txt-beige\:5\:dark { color: hsl(60, 56%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:10\:dark, html.var.auto .sf-c-txt-beige\:10\:dark { color: hsl(60, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:15\:dark, html.var.auto .sf-c-txt-beige\:15\:dark { color: hsl(60, 56%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:20\:dark, html.var.auto .sf-c-txt-beige\:20\:dark { color: hsl(60, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:25\:dark, html.var.auto .sf-c-txt-beige\:25\:dark { color: hsl(60, 56%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:30\:dark, html.var.auto .sf-c-txt-beige\:30\:dark { color: hsl(60, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:35\:dark, html.var.auto .sf-c-txt-beige\:35\:dark { color: hsl(60, 56%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:40\:dark, html.var.auto .sf-c-txt-beige\:40\:dark { color: hsl(60, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:45\:dark, html.var.auto .sf-c-txt-beige\:45\:dark { color: hsl(60, 56%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:50\:dark, html.var.auto .sf-c-txt-beige\:50\:dark { color: hsl(60, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:55\:dark, html.var.auto .sf-c-txt-beige\:55\:dark { color: hsl(60, 56%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:60\:dark, html.var.auto .sf-c-txt-beige\:60\:dark { color: hsl(60, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:65\:dark, html.var.auto .sf-c-txt-beige\:65\:dark { color: hsl(60, 56%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:70\:dark, html.var.auto .sf-c-txt-beige\:70\:dark { color: hsl(60, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:75\:dark, html.var.auto .sf-c-txt-beige\:75\:dark { color: hsl(60, 56%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:80\:dark, html.var.auto .sf-c-txt-beige\:80\:dark { color: hsl(60, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:85\:dark, html.var.auto .sf-c-txt-beige\:85\:dark { color: hsl(60, 56%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:90\:dark, html.var.auto .sf-c-txt-beige\:90\:dark { color: hsl(60, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:95\:dark, html.var.auto .sf-c-txt-beige\:95\:dark { color: hsl(60, 56%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-beige\:100\:dark, html.var.auto .sf-c-txt-beige\:100\:dark { color: hsl(60, 56%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/bisque.css b/src/colors/20/bisque.css index d4fe13e..3d314da 100644 --- a/src/colors/20/bisque.css +++ b/src/colors/20/bisque.css @@ -1,4 +1,4 @@ -:root { +[class*='bisque'] { --sf-c-bisque: 33 100% 88%; --sf-c-bisque-0: 33 100% 0%; --sf-c-bisque-5: 33 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-bisque\:100\:dark, html.dark .sf-c-txt-bis html.var[data-theme='auto'] .sf-c-bisque\:95\:dark, html.var.auto .sf-c-bisque\:95\:dark { color: hsl(33, 100%, 95%); background: hsl(33, 100%, 5%) } html.var[data-theme='auto'] .sf-c-bisque\:100\:dark, html.var.auto .sf-c-bisque\:100\:dark { color: hsl(33, 100%, 95%); background: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque, html.auto .sf-c-txt-bisque { color: hsl(33, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:0, html.auto .sf-c-txt-bisque\:0 { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:5, html.auto .sf-c-txt-bisque\:5 { color: hsl(33, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:10, html.auto .sf-c-txt-bisque\:10 { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:15, html.auto .sf-c-txt-bisque\:15 { color: hsl(33, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:20, html.auto .sf-c-txt-bisque\:20 { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:25, html.auto .sf-c-txt-bisque\:25 { color: hsl(33, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:30, html.auto .sf-c-txt-bisque\:30 { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:35, html.auto .sf-c-txt-bisque\:35 { color: hsl(33, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:40, html.auto .sf-c-txt-bisque\:40 { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:45, html.auto .sf-c-txt-bisque\:45 { color: hsl(33, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:50, html.auto .sf-c-txt-bisque\:50 { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:55, html.auto .sf-c-txt-bisque\:55 { color: hsl(33, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:60, html.auto .sf-c-txt-bisque\:60 { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:65, html.auto .sf-c-txt-bisque\:65 { color: hsl(33, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:70, html.auto .sf-c-txt-bisque\:70 { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:75, html.auto .sf-c-txt-bisque\:75 { color: hsl(33, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:80, html.auto .sf-c-txt-bisque\:80 { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:85, html.auto .sf-c-txt-bisque\:85 { color: hsl(33, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:90, html.auto .sf-c-txt-bisque\:90 { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:95, html.auto .sf-c-txt-bisque\:95 { color: hsl(33, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:100, html.auto .sf-c-txt-bisque\:100 { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-bisque, html.var.auto .sf-c-txt-bisque { color: hsl(33, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:0, html.var.auto .sf-c-txt-bisque\:0 { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:5, html.var.auto .sf-c-txt-bisque\:5 { color: hsl(33, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:10, html.var.auto .sf-c-txt-bisque\:10 { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:15, html.var.auto .sf-c-txt-bisque\:15 { color: hsl(33, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:20, html.var.auto .sf-c-txt-bisque\:20 { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:25, html.var.auto .sf-c-txt-bisque\:25 { color: hsl(33, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:30, html.var.auto .sf-c-txt-bisque\:30 { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:35, html.var.auto .sf-c-txt-bisque\:35 { color: hsl(33, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:40, html.var.auto .sf-c-txt-bisque\:40 { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:45, html.var.auto .sf-c-txt-bisque\:45 { color: hsl(33, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:50, html.var.auto .sf-c-txt-bisque\:50 { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:55, html.var.auto .sf-c-txt-bisque\:55 { color: hsl(33, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:60, html.var.auto .sf-c-txt-bisque\:60 { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:65, html.var.auto .sf-c-txt-bisque\:65 { color: hsl(33, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:70, html.var.auto .sf-c-txt-bisque\:70 { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:75, html.var.auto .sf-c-txt-bisque\:75 { color: hsl(33, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:80, html.var.auto .sf-c-txt-bisque\:80 { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:85, html.var.auto .sf-c-txt-bisque\:85 { color: hsl(33, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:90, html.var.auto .sf-c-txt-bisque\:90 { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:95, html.var.auto .sf-c-txt-bisque\:95 { color: hsl(33, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:100, html.var.auto .sf-c-txt-bisque\:100 { color: hsl(33, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:dark, html.auto .sf-c-txt-bisque\:dark { color: hsl(33, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:0\:dark, html.auto .sf-c-txt-bisque\:0\:dark { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:5\:dark, html.auto .sf-c-txt-bisque\:5\:dark { color: hsl(33, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:10\:dark, html.auto .sf-c-txt-bisque\:10\:dark { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:15\:dark, html.auto .sf-c-txt-bisque\:15\:dark { color: hsl(33, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:20\:dark, html.auto .sf-c-txt-bisque\:20\:dark { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:25\:dark, html.auto .sf-c-txt-bisque\:25\:dark { color: hsl(33, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:30\:dark, html.auto .sf-c-txt-bisque\:30\:dark { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:35\:dark, html.auto .sf-c-txt-bisque\:35\:dark { color: hsl(33, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:40\:dark, html.auto .sf-c-txt-bisque\:40\:dark { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:45\:dark, html.auto .sf-c-txt-bisque\:45\:dark { color: hsl(33, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:50\:dark, html.auto .sf-c-txt-bisque\:50\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:55\:dark, html.auto .sf-c-txt-bisque\:55\:dark { color: hsl(33, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:60\:dark, html.auto .sf-c-txt-bisque\:60\:dark { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:65\:dark, html.auto .sf-c-txt-bisque\:65\:dark { color: hsl(33, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:70\:dark, html.auto .sf-c-txt-bisque\:70\:dark { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:75\:dark, html.auto .sf-c-txt-bisque\:75\:dark { color: hsl(33, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:80\:dark, html.auto .sf-c-txt-bisque\:80\:dark { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:85\:dark, html.auto .sf-c-txt-bisque\:85\:dark { color: hsl(33, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:90\:dark, html.auto .sf-c-txt-bisque\:90\:dark { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:95\:dark, html.auto .sf-c-txt-bisque\:95\:dark { color: hsl(33, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-bisque\:100\:dark, html.auto .sf-c-txt-bisque\:100\:dark { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:dark, html.var.auto .sf-c-txt-bisque\:dark { color: hsl(33, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:0\:dark, html.var.auto .sf-c-txt-bisque\:0\:dark { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:5\:dark, html.var.auto .sf-c-txt-bisque\:5\:dark { color: hsl(33, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:10\:dark, html.var.auto .sf-c-txt-bisque\:10\:dark { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:15\:dark, html.var.auto .sf-c-txt-bisque\:15\:dark { color: hsl(33, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:20\:dark, html.var.auto .sf-c-txt-bisque\:20\:dark { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:25\:dark, html.var.auto .sf-c-txt-bisque\:25\:dark { color: hsl(33, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:30\:dark, html.var.auto .sf-c-txt-bisque\:30\:dark { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:35\:dark, html.var.auto .sf-c-txt-bisque\:35\:dark { color: hsl(33, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:40\:dark, html.var.auto .sf-c-txt-bisque\:40\:dark { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:45\:dark, html.var.auto .sf-c-txt-bisque\:45\:dark { color: hsl(33, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:50\:dark, html.var.auto .sf-c-txt-bisque\:50\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:55\:dark, html.var.auto .sf-c-txt-bisque\:55\:dark { color: hsl(33, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:60\:dark, html.var.auto .sf-c-txt-bisque\:60\:dark { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:65\:dark, html.var.auto .sf-c-txt-bisque\:65\:dark { color: hsl(33, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:70\:dark, html.var.auto .sf-c-txt-bisque\:70\:dark { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:75\:dark, html.var.auto .sf-c-txt-bisque\:75\:dark { color: hsl(33, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:80\:dark, html.var.auto .sf-c-txt-bisque\:80\:dark { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:85\:dark, html.var.auto .sf-c-txt-bisque\:85\:dark { color: hsl(33, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:90\:dark, html.var.auto .sf-c-txt-bisque\:90\:dark { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:95\:dark, html.var.auto .sf-c-txt-bisque\:95\:dark { color: hsl(33, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-bisque\:100\:dark, html.var.auto .sf-c-txt-bisque\:100\:dark { color: hsl(33, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/black.css b/src/colors/20/black.css index bdbff44..d5b5ca7 100644 --- a/src/colors/20/black.css +++ b/src/colors/20/black.css @@ -1,4 +1,4 @@ -:root { +[class*='black'] { --sf-c-black: 0 0% 0%; --sf-c-black-0: 0 0% 0%; --sf-c-black-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark, html.dark .sf-c-txt-blac html.var[data-theme='auto'] .sf-c-black\:95\:dark, html.var.auto .sf-c-black\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-black\:100\:dark, html.var.auto .sf-c-black\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black, html.auto .sf-c-txt-black { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:0, html.auto .sf-c-txt-black\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:5, html.auto .sf-c-txt-black\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-black\:10, html.auto .sf-c-txt-black\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-black\:15, html.auto .sf-c-txt-black\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-black\:20, html.auto .sf-c-txt-black\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-black\:25, html.auto .sf-c-txt-black\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-black\:30, html.auto .sf-c-txt-black\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-black\:35, html.auto .sf-c-txt-black\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-black\:40, html.auto .sf-c-txt-black\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-black\:45, html.auto .sf-c-txt-black\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-black\:50, html.auto .sf-c-txt-black\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-black\:55, html.auto .sf-c-txt-black\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-black\:60, html.auto .sf-c-txt-black\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-black\:65, html.auto .sf-c-txt-black\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-black\:70, html.auto .sf-c-txt-black\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-black\:75, html.auto .sf-c-txt-black\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-black\:80, html.auto .sf-c-txt-black\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-black\:85, html.auto .sf-c-txt-black\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-black\:90, html.auto .sf-c-txt-black\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-black\:95, html.auto .sf-c-txt-black\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-black\:100, html.auto .sf-c-txt-black\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-black, html.var.auto .sf-c-txt-black { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:0, html.var.auto .sf-c-txt-black\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:5, html.var.auto .sf-c-txt-black\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-black\:10, html.var.auto .sf-c-txt-black\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-black\:15, html.var.auto .sf-c-txt-black\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-black\:20, html.var.auto .sf-c-txt-black\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-black\:25, html.var.auto .sf-c-txt-black\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-black\:30, html.var.auto .sf-c-txt-black\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-black\:35, html.var.auto .sf-c-txt-black\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-black\:40, html.var.auto .sf-c-txt-black\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-black\:45, html.var.auto .sf-c-txt-black\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-black\:50, html.var.auto .sf-c-txt-black\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-black\:55, html.var.auto .sf-c-txt-black\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-black\:60, html.var.auto .sf-c-txt-black\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-black\:65, html.var.auto .sf-c-txt-black\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-black\:70, html.var.auto .sf-c-txt-black\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-black\:75, html.var.auto .sf-c-txt-black\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-black\:80, html.var.auto .sf-c-txt-black\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-black\:85, html.var.auto .sf-c-txt-black\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-black\:90, html.var.auto .sf-c-txt-black\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-black\:95, html.var.auto .sf-c-txt-black\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-black\:100, html.var.auto .sf-c-txt-black\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-black\:dark, html.auto .sf-c-txt-black\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark, html.auto .sf-c-txt-black\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-black\:5\:dark, html.auto .sf-c-txt-black\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark, html.auto .sf-c-txt-black\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-black\:15\:dark, html.auto .sf-c-txt-black\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark, html.auto .sf-c-txt-black\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-black\:25\:dark, html.auto .sf-c-txt-black\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark, html.auto .sf-c-txt-black\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-black\:35\:dark, html.auto .sf-c-txt-black\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark, html.auto .sf-c-txt-black\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-black\:45\:dark, html.auto .sf-c-txt-black\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark, html.auto .sf-c-txt-black\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-black\:55\:dark, html.auto .sf-c-txt-black\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark, html.auto .sf-c-txt-black\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-black\:65\:dark, html.auto .sf-c-txt-black\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark, html.auto .sf-c-txt-black\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-black\:75\:dark, html.auto .sf-c-txt-black\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark, html.auto .sf-c-txt-black\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-black\:85\:dark, html.auto .sf-c-txt-black\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark, html.auto .sf-c-txt-black\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-black\:95\:dark, html.auto .sf-c-txt-black\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark, html.auto .sf-c-txt-black\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-black\:dark, html.var.auto .sf-c-txt-black\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark, html.var.auto .sf-c-txt-black\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-black\:5\:dark, html.var.auto .sf-c-txt-black\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark, html.var.auto .sf-c-txt-black\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-black\:15\:dark, html.var.auto .sf-c-txt-black\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark, html.var.auto .sf-c-txt-black\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-black\:25\:dark, html.var.auto .sf-c-txt-black\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark, html.var.auto .sf-c-txt-black\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-black\:35\:dark, html.var.auto .sf-c-txt-black\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark, html.var.auto .sf-c-txt-black\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-black\:45\:dark, html.var.auto .sf-c-txt-black\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark, html.var.auto .sf-c-txt-black\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-black\:55\:dark, html.var.auto .sf-c-txt-black\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark, html.var.auto .sf-c-txt-black\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-black\:65\:dark, html.var.auto .sf-c-txt-black\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark, html.var.auto .sf-c-txt-black\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-black\:75\:dark, html.var.auto .sf-c-txt-black\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark, html.var.auto .sf-c-txt-black\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-black\:85\:dark, html.var.auto .sf-c-txt-black\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark, html.var.auto .sf-c-txt-black\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-black\:95\:dark, html.var.auto .sf-c-txt-black\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark, html.var.auto .sf-c-txt-black\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/blanchedalmond.css b/src/colors/20/blanchedalmond.css index dcd0988..21e8b3e 100644 --- a/src/colors/20/blanchedalmond.css +++ b/src/colors/20/blanchedalmond.css @@ -1,4 +1,4 @@ -:root { +[class*='blanchedalmond'] { --sf-c-blanchedalmond: 36 100% 90%; --sf-c-blanchedalmond-0: 36 100% 0%; --sf-c-blanchedalmond-5: 36 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-blanchedalmond\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-blanchedalmond\:95\:dark, html.var.auto .sf-c-blanchedalmond\:95\:dark { color: hsl(36, 100%, 95%); background: hsl(36, 100%, 5%) } html.var[data-theme='auto'] .sf-c-blanchedalmond\:100\:dark, html.var.auto .sf-c-blanchedalmond\:100\:dark { color: hsl(36, 100%, 95%); background: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond, html.auto .sf-c-txt-blanchedalmond { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0, html.auto .sf-c-txt-blanchedalmond\:0 { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:5, html.auto .sf-c-txt-blanchedalmond\:5 { color: hsl(36, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10, html.auto .sf-c-txt-blanchedalmond\:10 { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:15, html.auto .sf-c-txt-blanchedalmond\:15 { color: hsl(36, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20, html.auto .sf-c-txt-blanchedalmond\:20 { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:25, html.auto .sf-c-txt-blanchedalmond\:25 { color: hsl(36, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30, html.auto .sf-c-txt-blanchedalmond\:30 { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:35, html.auto .sf-c-txt-blanchedalmond\:35 { color: hsl(36, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40, html.auto .sf-c-txt-blanchedalmond\:40 { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:45, html.auto .sf-c-txt-blanchedalmond\:45 { color: hsl(36, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50, html.auto .sf-c-txt-blanchedalmond\:50 { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:55, html.auto .sf-c-txt-blanchedalmond\:55 { color: hsl(36, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60, html.auto .sf-c-txt-blanchedalmond\:60 { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:65, html.auto .sf-c-txt-blanchedalmond\:65 { color: hsl(36, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70, html.auto .sf-c-txt-blanchedalmond\:70 { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:75, html.auto .sf-c-txt-blanchedalmond\:75 { color: hsl(36, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80, html.auto .sf-c-txt-blanchedalmond\:80 { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:85, html.auto .sf-c-txt-blanchedalmond\:85 { color: hsl(36, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90, html.auto .sf-c-txt-blanchedalmond\:90 { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:95, html.auto .sf-c-txt-blanchedalmond\:95 { color: hsl(36, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100, html.auto .sf-c-txt-blanchedalmond\:100 { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond, html.var.auto .sf-c-txt-blanchedalmond { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0, html.var.auto .sf-c-txt-blanchedalmond\:0 { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:5, html.var.auto .sf-c-txt-blanchedalmond\:5 { color: hsl(36, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10, html.var.auto .sf-c-txt-blanchedalmond\:10 { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:15, html.var.auto .sf-c-txt-blanchedalmond\:15 { color: hsl(36, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20, html.var.auto .sf-c-txt-blanchedalmond\:20 { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:25, html.var.auto .sf-c-txt-blanchedalmond\:25 { color: hsl(36, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30, html.var.auto .sf-c-txt-blanchedalmond\:30 { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:35, html.var.auto .sf-c-txt-blanchedalmond\:35 { color: hsl(36, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40, html.var.auto .sf-c-txt-blanchedalmond\:40 { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:45, html.var.auto .sf-c-txt-blanchedalmond\:45 { color: hsl(36, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50, html.var.auto .sf-c-txt-blanchedalmond\:50 { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:55, html.var.auto .sf-c-txt-blanchedalmond\:55 { color: hsl(36, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60, html.var.auto .sf-c-txt-blanchedalmond\:60 { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:65, html.var.auto .sf-c-txt-blanchedalmond\:65 { color: hsl(36, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70, html.var.auto .sf-c-txt-blanchedalmond\:70 { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:75, html.var.auto .sf-c-txt-blanchedalmond\:75 { color: hsl(36, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80, html.var.auto .sf-c-txt-blanchedalmond\:80 { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:85, html.var.auto .sf-c-txt-blanchedalmond\:85 { color: hsl(36, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90, html.var.auto .sf-c-txt-blanchedalmond\:90 { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:95, html.var.auto .sf-c-txt-blanchedalmond\:95 { color: hsl(36, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100, html.var.auto .sf-c-txt-blanchedalmond\:100 { color: hsl(36, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:dark, html.auto .sf-c-txt-blanchedalmond\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0\:dark, html.auto .sf-c-txt-blanchedalmond\:0\:dark { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:5\:dark, html.auto .sf-c-txt-blanchedalmond\:5\:dark { color: hsl(36, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10\:dark, html.auto .sf-c-txt-blanchedalmond\:10\:dark { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:15\:dark, html.auto .sf-c-txt-blanchedalmond\:15\:dark { color: hsl(36, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20\:dark, html.auto .sf-c-txt-blanchedalmond\:20\:dark { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:25\:dark, html.auto .sf-c-txt-blanchedalmond\:25\:dark { color: hsl(36, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30\:dark, html.auto .sf-c-txt-blanchedalmond\:30\:dark { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:35\:dark, html.auto .sf-c-txt-blanchedalmond\:35\:dark { color: hsl(36, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40\:dark, html.auto .sf-c-txt-blanchedalmond\:40\:dark { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:45\:dark, html.auto .sf-c-txt-blanchedalmond\:45\:dark { color: hsl(36, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50\:dark, html.auto .sf-c-txt-blanchedalmond\:50\:dark { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:55\:dark, html.auto .sf-c-txt-blanchedalmond\:55\:dark { color: hsl(36, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60\:dark, html.auto .sf-c-txt-blanchedalmond\:60\:dark { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:65\:dark, html.auto .sf-c-txt-blanchedalmond\:65\:dark { color: hsl(36, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70\:dark, html.auto .sf-c-txt-blanchedalmond\:70\:dark { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:75\:dark, html.auto .sf-c-txt-blanchedalmond\:75\:dark { color: hsl(36, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80\:dark, html.auto .sf-c-txt-blanchedalmond\:80\:dark { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:85\:dark, html.auto .sf-c-txt-blanchedalmond\:85\:dark { color: hsl(36, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90\:dark, html.auto .sf-c-txt-blanchedalmond\:90\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:95\:dark, html.auto .sf-c-txt-blanchedalmond\:95\:dark { color: hsl(36, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100\:dark, html.auto .sf-c-txt-blanchedalmond\:100\:dark { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:dark, html.var.auto .sf-c-txt-blanchedalmond\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:0\:dark, html.var.auto .sf-c-txt-blanchedalmond\:0\:dark { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:5\:dark, html.var.auto .sf-c-txt-blanchedalmond\:5\:dark { color: hsl(36, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:10\:dark, html.var.auto .sf-c-txt-blanchedalmond\:10\:dark { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:15\:dark, html.var.auto .sf-c-txt-blanchedalmond\:15\:dark { color: hsl(36, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:20\:dark, html.var.auto .sf-c-txt-blanchedalmond\:20\:dark { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:25\:dark, html.var.auto .sf-c-txt-blanchedalmond\:25\:dark { color: hsl(36, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:30\:dark, html.var.auto .sf-c-txt-blanchedalmond\:30\:dark { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:35\:dark, html.var.auto .sf-c-txt-blanchedalmond\:35\:dark { color: hsl(36, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:40\:dark, html.var.auto .sf-c-txt-blanchedalmond\:40\:dark { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:45\:dark, html.var.auto .sf-c-txt-blanchedalmond\:45\:dark { color: hsl(36, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:50\:dark, html.var.auto .sf-c-txt-blanchedalmond\:50\:dark { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:55\:dark, html.var.auto .sf-c-txt-blanchedalmond\:55\:dark { color: hsl(36, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:60\:dark, html.var.auto .sf-c-txt-blanchedalmond\:60\:dark { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:65\:dark, html.var.auto .sf-c-txt-blanchedalmond\:65\:dark { color: hsl(36, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:70\:dark, html.var.auto .sf-c-txt-blanchedalmond\:70\:dark { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:75\:dark, html.var.auto .sf-c-txt-blanchedalmond\:75\:dark { color: hsl(36, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:80\:dark, html.var.auto .sf-c-txt-blanchedalmond\:80\:dark { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:85\:dark, html.var.auto .sf-c-txt-blanchedalmond\:85\:dark { color: hsl(36, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:90\:dark, html.var.auto .sf-c-txt-blanchedalmond\:90\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:95\:dark, html.var.auto .sf-c-txt-blanchedalmond\:95\:dark { color: hsl(36, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blanchedalmond\:100\:dark, html.var.auto .sf-c-txt-blanchedalmond\:100\:dark { color: hsl(36, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/blue.css b/src/colors/20/blue.css index 5b9a34d..3c753d3 100644 --- a/src/colors/20/blue.css +++ b/src/colors/20/blue.css @@ -1,4 +1,4 @@ -:root { +[class*='blue'] { --sf-c-blue: 240 100% 50%; --sf-c-blue-0: 240 100% 0%; --sf-c-blue-5: 240 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark, html.dark .sf-c-txt-blue\ html.var[data-theme='auto'] .sf-c-blue\:95\:dark, html.var.auto .sf-c-blue\:95\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 5%) } html.var[data-theme='auto'] .sf-c-blue\:100\:dark, html.var.auto .sf-c-blue\:100\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue, html.auto .sf-c-txt-blue { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:0, html.auto .sf-c-txt-blue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:5, html.auto .sf-c-txt-blue\:5 { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:10, html.auto .sf-c-txt-blue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:15, html.auto .sf-c-txt-blue\:15 { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:20, html.auto .sf-c-txt-blue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:25, html.auto .sf-c-txt-blue\:25 { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:30, html.auto .sf-c-txt-blue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:35, html.auto .sf-c-txt-blue\:35 { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:40, html.auto .sf-c-txt-blue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:45, html.auto .sf-c-txt-blue\:45 { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:50, html.auto .sf-c-txt-blue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:55, html.auto .sf-c-txt-blue\:55 { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:60, html.auto .sf-c-txt-blue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:65, html.auto .sf-c-txt-blue\:65 { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:70, html.auto .sf-c-txt-blue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:75, html.auto .sf-c-txt-blue\:75 { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:80, html.auto .sf-c-txt-blue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:85, html.auto .sf-c-txt-blue\:85 { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:90, html.auto .sf-c-txt-blue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:95, html.auto .sf-c-txt-blue\:95 { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:100, html.auto .sf-c-txt-blue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blue, html.var.auto .sf-c-txt-blue { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:0, html.var.auto .sf-c-txt-blue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:5, html.var.auto .sf-c-txt-blue\:5 { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:10, html.var.auto .sf-c-txt-blue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:15, html.var.auto .sf-c-txt-blue\:15 { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:20, html.var.auto .sf-c-txt-blue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:25, html.var.auto .sf-c-txt-blue\:25 { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:30, html.var.auto .sf-c-txt-blue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:35, html.var.auto .sf-c-txt-blue\:35 { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:40, html.var.auto .sf-c-txt-blue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:45, html.var.auto .sf-c-txt-blue\:45 { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:50, html.var.auto .sf-c-txt-blue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:55, html.var.auto .sf-c-txt-blue\:55 { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:60, html.var.auto .sf-c-txt-blue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:65, html.var.auto .sf-c-txt-blue\:65 { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:70, html.var.auto .sf-c-txt-blue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:75, html.var.auto .sf-c-txt-blue\:75 { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:80, html.var.auto .sf-c-txt-blue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:85, html.var.auto .sf-c-txt-blue\:85 { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:90, html.var.auto .sf-c-txt-blue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:95, html.var.auto .sf-c-txt-blue\:95 { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:100, html.var.auto .sf-c-txt-blue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:dark, html.auto .sf-c-txt-blue\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark, html.auto .sf-c-txt-blue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:5\:dark, html.auto .sf-c-txt-blue\:5\:dark { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark, html.auto .sf-c-txt-blue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:15\:dark, html.auto .sf-c-txt-blue\:15\:dark { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark, html.auto .sf-c-txt-blue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:25\:dark, html.auto .sf-c-txt-blue\:25\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark, html.auto .sf-c-txt-blue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:35\:dark, html.auto .sf-c-txt-blue\:35\:dark { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark, html.auto .sf-c-txt-blue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:45\:dark, html.auto .sf-c-txt-blue\:45\:dark { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark, html.auto .sf-c-txt-blue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:55\:dark, html.auto .sf-c-txt-blue\:55\:dark { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark, html.auto .sf-c-txt-blue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:65\:dark, html.auto .sf-c-txt-blue\:65\:dark { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark, html.auto .sf-c-txt-blue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:75\:dark, html.auto .sf-c-txt-blue\:75\:dark { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark, html.auto .sf-c-txt-blue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:85\:dark, html.auto .sf-c-txt-blue\:85\:dark { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark, html.auto .sf-c-txt-blue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:95\:dark, html.auto .sf-c-txt-blue\:95\:dark { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark, html.auto .sf-c-txt-blue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:dark, html.var.auto .sf-c-txt-blue\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark, html.var.auto .sf-c-txt-blue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:5\:dark, html.var.auto .sf-c-txt-blue\:5\:dark { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark, html.var.auto .sf-c-txt-blue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:15\:dark, html.var.auto .sf-c-txt-blue\:15\:dark { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark, html.var.auto .sf-c-txt-blue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:25\:dark, html.var.auto .sf-c-txt-blue\:25\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark, html.var.auto .sf-c-txt-blue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:35\:dark, html.var.auto .sf-c-txt-blue\:35\:dark { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark, html.var.auto .sf-c-txt-blue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:45\:dark, html.var.auto .sf-c-txt-blue\:45\:dark { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark, html.var.auto .sf-c-txt-blue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:55\:dark, html.var.auto .sf-c-txt-blue\:55\:dark { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark, html.var.auto .sf-c-txt-blue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:65\:dark, html.var.auto .sf-c-txt-blue\:65\:dark { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark, html.var.auto .sf-c-txt-blue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:75\:dark, html.var.auto .sf-c-txt-blue\:75\:dark { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark, html.var.auto .sf-c-txt-blue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:85\:dark, html.var.auto .sf-c-txt-blue\:85\:dark { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark, html.var.auto .sf-c-txt-blue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:95\:dark, html.var.auto .sf-c-txt-blue\:95\:dark { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark, html.var.auto .sf-c-txt-blue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/blueviolet.css b/src/colors/20/blueviolet.css index b3569b6..89840b0 100644 --- a/src/colors/20/blueviolet.css +++ b/src/colors/20/blueviolet.css @@ -1,4 +1,4 @@ -:root { +[class*='blueviolet'] { --sf-c-blueviolet: 271 76% 53%; --sf-c-blueviolet-0: 271 76% 0%; --sf-c-blueviolet-5: 271 76% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-blueviolet\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-blueviolet\:95\:dark, html.var.auto .sf-c-blueviolet\:95\:dark { color: hsl(271, 76%, 95%); background: hsl(271, 76%, 5%) } html.var[data-theme='auto'] .sf-c-blueviolet\:100\:dark, html.var.auto .sf-c-blueviolet\:100\:dark { color: hsl(271, 76%, 95%); background: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet, html.auto .sf-c-txt-blueviolet { color: hsl(271, 76%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0, html.auto .sf-c-txt-blueviolet\:0 { color: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:5, html.auto .sf-c-txt-blueviolet\:5 { color: hsl(271, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10, html.auto .sf-c-txt-blueviolet\:10 { color: hsl(271, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:15, html.auto .sf-c-txt-blueviolet\:15 { color: hsl(271, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20, html.auto .sf-c-txt-blueviolet\:20 { color: hsl(271, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:25, html.auto .sf-c-txt-blueviolet\:25 { color: hsl(271, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30, html.auto .sf-c-txt-blueviolet\:30 { color: hsl(271, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:35, html.auto .sf-c-txt-blueviolet\:35 { color: hsl(271, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40, html.auto .sf-c-txt-blueviolet\:40 { color: hsl(271, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:45, html.auto .sf-c-txt-blueviolet\:45 { color: hsl(271, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50, html.auto .sf-c-txt-blueviolet\:50 { color: hsl(271, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:55, html.auto .sf-c-txt-blueviolet\:55 { color: hsl(271, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60, html.auto .sf-c-txt-blueviolet\:60 { color: hsl(271, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:65, html.auto .sf-c-txt-blueviolet\:65 { color: hsl(271, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70, html.auto .sf-c-txt-blueviolet\:70 { color: hsl(271, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:75, html.auto .sf-c-txt-blueviolet\:75 { color: hsl(271, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80, html.auto .sf-c-txt-blueviolet\:80 { color: hsl(271, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:85, html.auto .sf-c-txt-blueviolet\:85 { color: hsl(271, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90, html.auto .sf-c-txt-blueviolet\:90 { color: hsl(271, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:95, html.auto .sf-c-txt-blueviolet\:95 { color: hsl(271, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100, html.auto .sf-c-txt-blueviolet\:100 { color: hsl(271, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet, html.var.auto .sf-c-txt-blueviolet { color: hsl(271, 76%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0, html.var.auto .sf-c-txt-blueviolet\:0 { color: hsl(271, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:5, html.var.auto .sf-c-txt-blueviolet\:5 { color: hsl(271, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10, html.var.auto .sf-c-txt-blueviolet\:10 { color: hsl(271, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:15, html.var.auto .sf-c-txt-blueviolet\:15 { color: hsl(271, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20, html.var.auto .sf-c-txt-blueviolet\:20 { color: hsl(271, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:25, html.var.auto .sf-c-txt-blueviolet\:25 { color: hsl(271, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30, html.var.auto .sf-c-txt-blueviolet\:30 { color: hsl(271, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:35, html.var.auto .sf-c-txt-blueviolet\:35 { color: hsl(271, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40, html.var.auto .sf-c-txt-blueviolet\:40 { color: hsl(271, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:45, html.var.auto .sf-c-txt-blueviolet\:45 { color: hsl(271, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50, html.var.auto .sf-c-txt-blueviolet\:50 { color: hsl(271, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:55, html.var.auto .sf-c-txt-blueviolet\:55 { color: hsl(271, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60, html.var.auto .sf-c-txt-blueviolet\:60 { color: hsl(271, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:65, html.var.auto .sf-c-txt-blueviolet\:65 { color: hsl(271, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70, html.var.auto .sf-c-txt-blueviolet\:70 { color: hsl(271, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:75, html.var.auto .sf-c-txt-blueviolet\:75 { color: hsl(271, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80, html.var.auto .sf-c-txt-blueviolet\:80 { color: hsl(271, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:85, html.var.auto .sf-c-txt-blueviolet\:85 { color: hsl(271, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90, html.var.auto .sf-c-txt-blueviolet\:90 { color: hsl(271, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:95, html.var.auto .sf-c-txt-blueviolet\:95 { color: hsl(271, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100, html.var.auto .sf-c-txt-blueviolet\:100 { color: hsl(271, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:dark, html.auto .sf-c-txt-blueviolet\:dark { color: hsl(271, 76%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0\:dark, html.auto .sf-c-txt-blueviolet\:0\:dark { color: hsl(271, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:5\:dark, html.auto .sf-c-txt-blueviolet\:5\:dark { color: hsl(271, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10\:dark, html.auto .sf-c-txt-blueviolet\:10\:dark { color: hsl(271, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:15\:dark, html.auto .sf-c-txt-blueviolet\:15\:dark { color: hsl(271, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20\:dark, html.auto .sf-c-txt-blueviolet\:20\:dark { color: hsl(271, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:25\:dark, html.auto .sf-c-txt-blueviolet\:25\:dark { color: hsl(271, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30\:dark, html.auto .sf-c-txt-blueviolet\:30\:dark { color: hsl(271, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:35\:dark, html.auto .sf-c-txt-blueviolet\:35\:dark { color: hsl(271, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40\:dark, html.auto .sf-c-txt-blueviolet\:40\:dark { color: hsl(271, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:45\:dark, html.auto .sf-c-txt-blueviolet\:45\:dark { color: hsl(271, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50\:dark, html.auto .sf-c-txt-blueviolet\:50\:dark { color: hsl(271, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:55\:dark, html.auto .sf-c-txt-blueviolet\:55\:dark { color: hsl(271, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60\:dark, html.auto .sf-c-txt-blueviolet\:60\:dark { color: hsl(271, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:65\:dark, html.auto .sf-c-txt-blueviolet\:65\:dark { color: hsl(271, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70\:dark, html.auto .sf-c-txt-blueviolet\:70\:dark { color: hsl(271, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:75\:dark, html.auto .sf-c-txt-blueviolet\:75\:dark { color: hsl(271, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80\:dark, html.auto .sf-c-txt-blueviolet\:80\:dark { color: hsl(271, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:85\:dark, html.auto .sf-c-txt-blueviolet\:85\:dark { color: hsl(271, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90\:dark, html.auto .sf-c-txt-blueviolet\:90\:dark { color: hsl(271, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:95\:dark, html.auto .sf-c-txt-blueviolet\:95\:dark { color: hsl(271, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100\:dark, html.auto .sf-c-txt-blueviolet\:100\:dark { color: hsl(271, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:dark, html.var.auto .sf-c-txt-blueviolet\:dark { color: hsl(271, 76%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:0\:dark, html.var.auto .sf-c-txt-blueviolet\:0\:dark { color: hsl(271, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:5\:dark, html.var.auto .sf-c-txt-blueviolet\:5\:dark { color: hsl(271, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:10\:dark, html.var.auto .sf-c-txt-blueviolet\:10\:dark { color: hsl(271, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:15\:dark, html.var.auto .sf-c-txt-blueviolet\:15\:dark { color: hsl(271, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:20\:dark, html.var.auto .sf-c-txt-blueviolet\:20\:dark { color: hsl(271, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:25\:dark, html.var.auto .sf-c-txt-blueviolet\:25\:dark { color: hsl(271, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:30\:dark, html.var.auto .sf-c-txt-blueviolet\:30\:dark { color: hsl(271, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:35\:dark, html.var.auto .sf-c-txt-blueviolet\:35\:dark { color: hsl(271, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:40\:dark, html.var.auto .sf-c-txt-blueviolet\:40\:dark { color: hsl(271, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:45\:dark, html.var.auto .sf-c-txt-blueviolet\:45\:dark { color: hsl(271, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:50\:dark, html.var.auto .sf-c-txt-blueviolet\:50\:dark { color: hsl(271, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:55\:dark, html.var.auto .sf-c-txt-blueviolet\:55\:dark { color: hsl(271, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:60\:dark, html.var.auto .sf-c-txt-blueviolet\:60\:dark { color: hsl(271, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:65\:dark, html.var.auto .sf-c-txt-blueviolet\:65\:dark { color: hsl(271, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:70\:dark, html.var.auto .sf-c-txt-blueviolet\:70\:dark { color: hsl(271, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:75\:dark, html.var.auto .sf-c-txt-blueviolet\:75\:dark { color: hsl(271, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:80\:dark, html.var.auto .sf-c-txt-blueviolet\:80\:dark { color: hsl(271, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:85\:dark, html.var.auto .sf-c-txt-blueviolet\:85\:dark { color: hsl(271, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:90\:dark, html.var.auto .sf-c-txt-blueviolet\:90\:dark { color: hsl(271, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:95\:dark, html.var.auto .sf-c-txt-blueviolet\:95\:dark { color: hsl(271, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-blueviolet\:100\:dark, html.var.auto .sf-c-txt-blueviolet\:100\:dark { color: hsl(271, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/brown.css b/src/colors/20/brown.css index 58ca651..97323fb 100644 --- a/src/colors/20/brown.css +++ b/src/colors/20/brown.css @@ -1,4 +1,4 @@ -:root { +[class*='brown'] { --sf-c-brown: 0 59% 41%; --sf-c-brown-0: 0 59% 0%; --sf-c-brown-5: 0 59% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-brown\:100\:dark, html.dark .sf-c-txt-brow html.var[data-theme='auto'] .sf-c-brown\:95\:dark, html.var.auto .sf-c-brown\:95\:dark { color: hsl(0, 59%, 95%); background: hsl(0, 59%, 5%) } html.var[data-theme='auto'] .sf-c-brown\:100\:dark, html.var.auto .sf-c-brown\:100\:dark { color: hsl(0, 59%, 95%); background: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown, html.auto .sf-c-txt-brown { color: hsl(0, 59%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:0, html.auto .sf-c-txt-brown\:0 { color: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:5, html.auto .sf-c-txt-brown\:5 { color: hsl(0, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:10, html.auto .sf-c-txt-brown\:10 { color: hsl(0, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:15, html.auto .sf-c-txt-brown\:15 { color: hsl(0, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:20, html.auto .sf-c-txt-brown\:20 { color: hsl(0, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:25, html.auto .sf-c-txt-brown\:25 { color: hsl(0, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:30, html.auto .sf-c-txt-brown\:30 { color: hsl(0, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:35, html.auto .sf-c-txt-brown\:35 { color: hsl(0, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:40, html.auto .sf-c-txt-brown\:40 { color: hsl(0, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:45, html.auto .sf-c-txt-brown\:45 { color: hsl(0, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:50, html.auto .sf-c-txt-brown\:50 { color: hsl(0, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:55, html.auto .sf-c-txt-brown\:55 { color: hsl(0, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:60, html.auto .sf-c-txt-brown\:60 { color: hsl(0, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:65, html.auto .sf-c-txt-brown\:65 { color: hsl(0, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:70, html.auto .sf-c-txt-brown\:70 { color: hsl(0, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:75, html.auto .sf-c-txt-brown\:75 { color: hsl(0, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:80, html.auto .sf-c-txt-brown\:80 { color: hsl(0, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:85, html.auto .sf-c-txt-brown\:85 { color: hsl(0, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:90, html.auto .sf-c-txt-brown\:90 { color: hsl(0, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:95, html.auto .sf-c-txt-brown\:95 { color: hsl(0, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:100, html.auto .sf-c-txt-brown\:100 { color: hsl(0, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-brown, html.var.auto .sf-c-txt-brown { color: hsl(0, 59%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:0, html.var.auto .sf-c-txt-brown\:0 { color: hsl(0, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:5, html.var.auto .sf-c-txt-brown\:5 { color: hsl(0, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:10, html.var.auto .sf-c-txt-brown\:10 { color: hsl(0, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:15, html.var.auto .sf-c-txt-brown\:15 { color: hsl(0, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:20, html.var.auto .sf-c-txt-brown\:20 { color: hsl(0, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:25, html.var.auto .sf-c-txt-brown\:25 { color: hsl(0, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:30, html.var.auto .sf-c-txt-brown\:30 { color: hsl(0, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:35, html.var.auto .sf-c-txt-brown\:35 { color: hsl(0, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:40, html.var.auto .sf-c-txt-brown\:40 { color: hsl(0, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:45, html.var.auto .sf-c-txt-brown\:45 { color: hsl(0, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:50, html.var.auto .sf-c-txt-brown\:50 { color: hsl(0, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:55, html.var.auto .sf-c-txt-brown\:55 { color: hsl(0, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:60, html.var.auto .sf-c-txt-brown\:60 { color: hsl(0, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:65, html.var.auto .sf-c-txt-brown\:65 { color: hsl(0, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:70, html.var.auto .sf-c-txt-brown\:70 { color: hsl(0, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:75, html.var.auto .sf-c-txt-brown\:75 { color: hsl(0, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:80, html.var.auto .sf-c-txt-brown\:80 { color: hsl(0, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:85, html.var.auto .sf-c-txt-brown\:85 { color: hsl(0, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:90, html.var.auto .sf-c-txt-brown\:90 { color: hsl(0, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:95, html.var.auto .sf-c-txt-brown\:95 { color: hsl(0, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:100, html.var.auto .sf-c-txt-brown\:100 { color: hsl(0, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:dark, html.auto .sf-c-txt-brown\:dark { color: hsl(0, 59%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:0\:dark, html.auto .sf-c-txt-brown\:0\:dark { color: hsl(0, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:5\:dark, html.auto .sf-c-txt-brown\:5\:dark { color: hsl(0, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:10\:dark, html.auto .sf-c-txt-brown\:10\:dark { color: hsl(0, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:15\:dark, html.auto .sf-c-txt-brown\:15\:dark { color: hsl(0, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:20\:dark, html.auto .sf-c-txt-brown\:20\:dark { color: hsl(0, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:25\:dark, html.auto .sf-c-txt-brown\:25\:dark { color: hsl(0, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:30\:dark, html.auto .sf-c-txt-brown\:30\:dark { color: hsl(0, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:35\:dark, html.auto .sf-c-txt-brown\:35\:dark { color: hsl(0, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:40\:dark, html.auto .sf-c-txt-brown\:40\:dark { color: hsl(0, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:45\:dark, html.auto .sf-c-txt-brown\:45\:dark { color: hsl(0, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:50\:dark, html.auto .sf-c-txt-brown\:50\:dark { color: hsl(0, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:55\:dark, html.auto .sf-c-txt-brown\:55\:dark { color: hsl(0, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:60\:dark, html.auto .sf-c-txt-brown\:60\:dark { color: hsl(0, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:65\:dark, html.auto .sf-c-txt-brown\:65\:dark { color: hsl(0, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:70\:dark, html.auto .sf-c-txt-brown\:70\:dark { color: hsl(0, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:75\:dark, html.auto .sf-c-txt-brown\:75\:dark { color: hsl(0, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:80\:dark, html.auto .sf-c-txt-brown\:80\:dark { color: hsl(0, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:85\:dark, html.auto .sf-c-txt-brown\:85\:dark { color: hsl(0, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:90\:dark, html.auto .sf-c-txt-brown\:90\:dark { color: hsl(0, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:95\:dark, html.auto .sf-c-txt-brown\:95\:dark { color: hsl(0, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-brown\:100\:dark, html.auto .sf-c-txt-brown\:100\:dark { color: hsl(0, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:dark, html.var.auto .sf-c-txt-brown\:dark { color: hsl(0, 59%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:0\:dark, html.var.auto .sf-c-txt-brown\:0\:dark { color: hsl(0, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:5\:dark, html.var.auto .sf-c-txt-brown\:5\:dark { color: hsl(0, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:10\:dark, html.var.auto .sf-c-txt-brown\:10\:dark { color: hsl(0, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:15\:dark, html.var.auto .sf-c-txt-brown\:15\:dark { color: hsl(0, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:20\:dark, html.var.auto .sf-c-txt-brown\:20\:dark { color: hsl(0, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:25\:dark, html.var.auto .sf-c-txt-brown\:25\:dark { color: hsl(0, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:30\:dark, html.var.auto .sf-c-txt-brown\:30\:dark { color: hsl(0, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:35\:dark, html.var.auto .sf-c-txt-brown\:35\:dark { color: hsl(0, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:40\:dark, html.var.auto .sf-c-txt-brown\:40\:dark { color: hsl(0, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:45\:dark, html.var.auto .sf-c-txt-brown\:45\:dark { color: hsl(0, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:50\:dark, html.var.auto .sf-c-txt-brown\:50\:dark { color: hsl(0, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:55\:dark, html.var.auto .sf-c-txt-brown\:55\:dark { color: hsl(0, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:60\:dark, html.var.auto .sf-c-txt-brown\:60\:dark { color: hsl(0, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:65\:dark, html.var.auto .sf-c-txt-brown\:65\:dark { color: hsl(0, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:70\:dark, html.var.auto .sf-c-txt-brown\:70\:dark { color: hsl(0, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:75\:dark, html.var.auto .sf-c-txt-brown\:75\:dark { color: hsl(0, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:80\:dark, html.var.auto .sf-c-txt-brown\:80\:dark { color: hsl(0, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:85\:dark, html.var.auto .sf-c-txt-brown\:85\:dark { color: hsl(0, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:90\:dark, html.var.auto .sf-c-txt-brown\:90\:dark { color: hsl(0, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:95\:dark, html.var.auto .sf-c-txt-brown\:95\:dark { color: hsl(0, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-brown\:100\:dark, html.var.auto .sf-c-txt-brown\:100\:dark { color: hsl(0, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/burlywood.css b/src/colors/20/burlywood.css index 71d18f2..3843a5c 100644 --- a/src/colors/20/burlywood.css +++ b/src/colors/20/burlywood.css @@ -1,4 +1,4 @@ -:root { +[class*='burlywood'] { --sf-c-burlywood: 34 57% 70%; --sf-c-burlywood-0: 34 57% 0%; --sf-c-burlywood-5: 34 57% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-burlywood\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-burlywood\:95\:dark, html.var.auto .sf-c-burlywood\:95\:dark { color: hsl(34, 57%, 95%); background: hsl(34, 57%, 5%) } html.var[data-theme='auto'] .sf-c-burlywood\:100\:dark, html.var.auto .sf-c-burlywood\:100\:dark { color: hsl(34, 57%, 95%); background: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood, html.auto .sf-c-txt-burlywood { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:0, html.auto .sf-c-txt-burlywood\:0 { color: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:5, html.auto .sf-c-txt-burlywood\:5 { color: hsl(34, 57%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:10, html.auto .sf-c-txt-burlywood\:10 { color: hsl(34, 57%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:15, html.auto .sf-c-txt-burlywood\:15 { color: hsl(34, 57%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:20, html.auto .sf-c-txt-burlywood\:20 { color: hsl(34, 57%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:25, html.auto .sf-c-txt-burlywood\:25 { color: hsl(34, 57%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:30, html.auto .sf-c-txt-burlywood\:30 { color: hsl(34, 57%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:35, html.auto .sf-c-txt-burlywood\:35 { color: hsl(34, 57%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:40, html.auto .sf-c-txt-burlywood\:40 { color: hsl(34, 57%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:45, html.auto .sf-c-txt-burlywood\:45 { color: hsl(34, 57%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:50, html.auto .sf-c-txt-burlywood\:50 { color: hsl(34, 57%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:55, html.auto .sf-c-txt-burlywood\:55 { color: hsl(34, 57%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:60, html.auto .sf-c-txt-burlywood\:60 { color: hsl(34, 57%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:65, html.auto .sf-c-txt-burlywood\:65 { color: hsl(34, 57%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:70, html.auto .sf-c-txt-burlywood\:70 { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:75, html.auto .sf-c-txt-burlywood\:75 { color: hsl(34, 57%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:80, html.auto .sf-c-txt-burlywood\:80 { color: hsl(34, 57%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:85, html.auto .sf-c-txt-burlywood\:85 { color: hsl(34, 57%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:90, html.auto .sf-c-txt-burlywood\:90 { color: hsl(34, 57%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:95, html.auto .sf-c-txt-burlywood\:95 { color: hsl(34, 57%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:100, html.auto .sf-c-txt-burlywood\:100 { color: hsl(34, 57%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood, html.var.auto .sf-c-txt-burlywood { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:0, html.var.auto .sf-c-txt-burlywood\:0 { color: hsl(34, 57%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:5, html.var.auto .sf-c-txt-burlywood\:5 { color: hsl(34, 57%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:10, html.var.auto .sf-c-txt-burlywood\:10 { color: hsl(34, 57%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:15, html.var.auto .sf-c-txt-burlywood\:15 { color: hsl(34, 57%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:20, html.var.auto .sf-c-txt-burlywood\:20 { color: hsl(34, 57%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:25, html.var.auto .sf-c-txt-burlywood\:25 { color: hsl(34, 57%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:30, html.var.auto .sf-c-txt-burlywood\:30 { color: hsl(34, 57%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:35, html.var.auto .sf-c-txt-burlywood\:35 { color: hsl(34, 57%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:40, html.var.auto .sf-c-txt-burlywood\:40 { color: hsl(34, 57%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:45, html.var.auto .sf-c-txt-burlywood\:45 { color: hsl(34, 57%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:50, html.var.auto .sf-c-txt-burlywood\:50 { color: hsl(34, 57%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:55, html.var.auto .sf-c-txt-burlywood\:55 { color: hsl(34, 57%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:60, html.var.auto .sf-c-txt-burlywood\:60 { color: hsl(34, 57%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:65, html.var.auto .sf-c-txt-burlywood\:65 { color: hsl(34, 57%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:70, html.var.auto .sf-c-txt-burlywood\:70 { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:75, html.var.auto .sf-c-txt-burlywood\:75 { color: hsl(34, 57%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:80, html.var.auto .sf-c-txt-burlywood\:80 { color: hsl(34, 57%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:85, html.var.auto .sf-c-txt-burlywood\:85 { color: hsl(34, 57%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:90, html.var.auto .sf-c-txt-burlywood\:90 { color: hsl(34, 57%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:95, html.var.auto .sf-c-txt-burlywood\:95 { color: hsl(34, 57%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:100, html.var.auto .sf-c-txt-burlywood\:100 { color: hsl(34, 57%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:dark, html.auto .sf-c-txt-burlywood\:dark { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:0\:dark, html.auto .sf-c-txt-burlywood\:0\:dark { color: hsl(34, 57%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:5\:dark, html.auto .sf-c-txt-burlywood\:5\:dark { color: hsl(34, 57%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:10\:dark, html.auto .sf-c-txt-burlywood\:10\:dark { color: hsl(34, 57%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:15\:dark, html.auto .sf-c-txt-burlywood\:15\:dark { color: hsl(34, 57%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:20\:dark, html.auto .sf-c-txt-burlywood\:20\:dark { color: hsl(34, 57%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:25\:dark, html.auto .sf-c-txt-burlywood\:25\:dark { color: hsl(34, 57%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:30\:dark, html.auto .sf-c-txt-burlywood\:30\:dark { color: hsl(34, 57%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:35\:dark, html.auto .sf-c-txt-burlywood\:35\:dark { color: hsl(34, 57%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:40\:dark, html.auto .sf-c-txt-burlywood\:40\:dark { color: hsl(34, 57%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:45\:dark, html.auto .sf-c-txt-burlywood\:45\:dark { color: hsl(34, 57%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:50\:dark, html.auto .sf-c-txt-burlywood\:50\:dark { color: hsl(34, 57%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:55\:dark, html.auto .sf-c-txt-burlywood\:55\:dark { color: hsl(34, 57%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:60\:dark, html.auto .sf-c-txt-burlywood\:60\:dark { color: hsl(34, 57%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:65\:dark, html.auto .sf-c-txt-burlywood\:65\:dark { color: hsl(34, 57%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:70\:dark, html.auto .sf-c-txt-burlywood\:70\:dark { color: hsl(34, 57%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:75\:dark, html.auto .sf-c-txt-burlywood\:75\:dark { color: hsl(34, 57%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:80\:dark, html.auto .sf-c-txt-burlywood\:80\:dark { color: hsl(34, 57%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:85\:dark, html.auto .sf-c-txt-burlywood\:85\:dark { color: hsl(34, 57%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:90\:dark, html.auto .sf-c-txt-burlywood\:90\:dark { color: hsl(34, 57%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:95\:dark, html.auto .sf-c-txt-burlywood\:95\:dark { color: hsl(34, 57%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-burlywood\:100\:dark, html.auto .sf-c-txt-burlywood\:100\:dark { color: hsl(34, 57%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:dark, html.var.auto .sf-c-txt-burlywood\:dark { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:0\:dark, html.var.auto .sf-c-txt-burlywood\:0\:dark { color: hsl(34, 57%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:5\:dark, html.var.auto .sf-c-txt-burlywood\:5\:dark { color: hsl(34, 57%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:10\:dark, html.var.auto .sf-c-txt-burlywood\:10\:dark { color: hsl(34, 57%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:15\:dark, html.var.auto .sf-c-txt-burlywood\:15\:dark { color: hsl(34, 57%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:20\:dark, html.var.auto .sf-c-txt-burlywood\:20\:dark { color: hsl(34, 57%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:25\:dark, html.var.auto .sf-c-txt-burlywood\:25\:dark { color: hsl(34, 57%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:30\:dark, html.var.auto .sf-c-txt-burlywood\:30\:dark { color: hsl(34, 57%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:35\:dark, html.var.auto .sf-c-txt-burlywood\:35\:dark { color: hsl(34, 57%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:40\:dark, html.var.auto .sf-c-txt-burlywood\:40\:dark { color: hsl(34, 57%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:45\:dark, html.var.auto .sf-c-txt-burlywood\:45\:dark { color: hsl(34, 57%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:50\:dark, html.var.auto .sf-c-txt-burlywood\:50\:dark { color: hsl(34, 57%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:55\:dark, html.var.auto .sf-c-txt-burlywood\:55\:dark { color: hsl(34, 57%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:60\:dark, html.var.auto .sf-c-txt-burlywood\:60\:dark { color: hsl(34, 57%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:65\:dark, html.var.auto .sf-c-txt-burlywood\:65\:dark { color: hsl(34, 57%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:70\:dark, html.var.auto .sf-c-txt-burlywood\:70\:dark { color: hsl(34, 57%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:75\:dark, html.var.auto .sf-c-txt-burlywood\:75\:dark { color: hsl(34, 57%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:80\:dark, html.var.auto .sf-c-txt-burlywood\:80\:dark { color: hsl(34, 57%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:85\:dark, html.var.auto .sf-c-txt-burlywood\:85\:dark { color: hsl(34, 57%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:90\:dark, html.var.auto .sf-c-txt-burlywood\:90\:dark { color: hsl(34, 57%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:95\:dark, html.var.auto .sf-c-txt-burlywood\:95\:dark { color: hsl(34, 57%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-burlywood\:100\:dark, html.var.auto .sf-c-txt-burlywood\:100\:dark { color: hsl(34, 57%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/cadetblue.css b/src/colors/20/cadetblue.css index cfd0e82..b9ebe6f 100644 --- a/src/colors/20/cadetblue.css +++ b/src/colors/20/cadetblue.css @@ -1,4 +1,4 @@ -:root { +[class*='cadetblue'] { --sf-c-cadetblue: 182 25% 50%; --sf-c-cadetblue-0: 182 25% 0%; --sf-c-cadetblue-5: 182 25% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-cadetblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-cadetblue\:95\:dark, html.var.auto .sf-c-cadetblue\:95\:dark { color: hsl(182, 25%, 95%); background: hsl(182, 25%, 5%) } html.var[data-theme='auto'] .sf-c-cadetblue\:100\:dark, html.var.auto .sf-c-cadetblue\:100\:dark { color: hsl(182, 25%, 95%); background: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue, html.auto .sf-c-txt-cadetblue { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0, html.auto .sf-c-txt-cadetblue\:0 { color: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:5, html.auto .sf-c-txt-cadetblue\:5 { color: hsl(182, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10, html.auto .sf-c-txt-cadetblue\:10 { color: hsl(182, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:15, html.auto .sf-c-txt-cadetblue\:15 { color: hsl(182, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20, html.auto .sf-c-txt-cadetblue\:20 { color: hsl(182, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:25, html.auto .sf-c-txt-cadetblue\:25 { color: hsl(182, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30, html.auto .sf-c-txt-cadetblue\:30 { color: hsl(182, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:35, html.auto .sf-c-txt-cadetblue\:35 { color: hsl(182, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40, html.auto .sf-c-txt-cadetblue\:40 { color: hsl(182, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:45, html.auto .sf-c-txt-cadetblue\:45 { color: hsl(182, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50, html.auto .sf-c-txt-cadetblue\:50 { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:55, html.auto .sf-c-txt-cadetblue\:55 { color: hsl(182, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60, html.auto .sf-c-txt-cadetblue\:60 { color: hsl(182, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:65, html.auto .sf-c-txt-cadetblue\:65 { color: hsl(182, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70, html.auto .sf-c-txt-cadetblue\:70 { color: hsl(182, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:75, html.auto .sf-c-txt-cadetblue\:75 { color: hsl(182, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80, html.auto .sf-c-txt-cadetblue\:80 { color: hsl(182, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:85, html.auto .sf-c-txt-cadetblue\:85 { color: hsl(182, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90, html.auto .sf-c-txt-cadetblue\:90 { color: hsl(182, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:95, html.auto .sf-c-txt-cadetblue\:95 { color: hsl(182, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100, html.auto .sf-c-txt-cadetblue\:100 { color: hsl(182, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue, html.var.auto .sf-c-txt-cadetblue { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0, html.var.auto .sf-c-txt-cadetblue\:0 { color: hsl(182, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:5, html.var.auto .sf-c-txt-cadetblue\:5 { color: hsl(182, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10, html.var.auto .sf-c-txt-cadetblue\:10 { color: hsl(182, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:15, html.var.auto .sf-c-txt-cadetblue\:15 { color: hsl(182, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20, html.var.auto .sf-c-txt-cadetblue\:20 { color: hsl(182, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:25, html.var.auto .sf-c-txt-cadetblue\:25 { color: hsl(182, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30, html.var.auto .sf-c-txt-cadetblue\:30 { color: hsl(182, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:35, html.var.auto .sf-c-txt-cadetblue\:35 { color: hsl(182, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40, html.var.auto .sf-c-txt-cadetblue\:40 { color: hsl(182, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:45, html.var.auto .sf-c-txt-cadetblue\:45 { color: hsl(182, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50, html.var.auto .sf-c-txt-cadetblue\:50 { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:55, html.var.auto .sf-c-txt-cadetblue\:55 { color: hsl(182, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60, html.var.auto .sf-c-txt-cadetblue\:60 { color: hsl(182, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:65, html.var.auto .sf-c-txt-cadetblue\:65 { color: hsl(182, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70, html.var.auto .sf-c-txt-cadetblue\:70 { color: hsl(182, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:75, html.var.auto .sf-c-txt-cadetblue\:75 { color: hsl(182, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80, html.var.auto .sf-c-txt-cadetblue\:80 { color: hsl(182, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:85, html.var.auto .sf-c-txt-cadetblue\:85 { color: hsl(182, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90, html.var.auto .sf-c-txt-cadetblue\:90 { color: hsl(182, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:95, html.var.auto .sf-c-txt-cadetblue\:95 { color: hsl(182, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100, html.var.auto .sf-c-txt-cadetblue\:100 { color: hsl(182, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:dark, html.auto .sf-c-txt-cadetblue\:dark { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0\:dark, html.auto .sf-c-txt-cadetblue\:0\:dark { color: hsl(182, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:5\:dark, html.auto .sf-c-txt-cadetblue\:5\:dark { color: hsl(182, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10\:dark, html.auto .sf-c-txt-cadetblue\:10\:dark { color: hsl(182, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:15\:dark, html.auto .sf-c-txt-cadetblue\:15\:dark { color: hsl(182, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20\:dark, html.auto .sf-c-txt-cadetblue\:20\:dark { color: hsl(182, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:25\:dark, html.auto .sf-c-txt-cadetblue\:25\:dark { color: hsl(182, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30\:dark, html.auto .sf-c-txt-cadetblue\:30\:dark { color: hsl(182, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:35\:dark, html.auto .sf-c-txt-cadetblue\:35\:dark { color: hsl(182, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40\:dark, html.auto .sf-c-txt-cadetblue\:40\:dark { color: hsl(182, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:45\:dark, html.auto .sf-c-txt-cadetblue\:45\:dark { color: hsl(182, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50\:dark, html.auto .sf-c-txt-cadetblue\:50\:dark { color: hsl(182, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:55\:dark, html.auto .sf-c-txt-cadetblue\:55\:dark { color: hsl(182, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60\:dark, html.auto .sf-c-txt-cadetblue\:60\:dark { color: hsl(182, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:65\:dark, html.auto .sf-c-txt-cadetblue\:65\:dark { color: hsl(182, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70\:dark, html.auto .sf-c-txt-cadetblue\:70\:dark { color: hsl(182, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:75\:dark, html.auto .sf-c-txt-cadetblue\:75\:dark { color: hsl(182, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80\:dark, html.auto .sf-c-txt-cadetblue\:80\:dark { color: hsl(182, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:85\:dark, html.auto .sf-c-txt-cadetblue\:85\:dark { color: hsl(182, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90\:dark, html.auto .sf-c-txt-cadetblue\:90\:dark { color: hsl(182, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:95\:dark, html.auto .sf-c-txt-cadetblue\:95\:dark { color: hsl(182, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100\:dark, html.auto .sf-c-txt-cadetblue\:100\:dark { color: hsl(182, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:dark, html.var.auto .sf-c-txt-cadetblue\:dark { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:0\:dark, html.var.auto .sf-c-txt-cadetblue\:0\:dark { color: hsl(182, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:5\:dark, html.var.auto .sf-c-txt-cadetblue\:5\:dark { color: hsl(182, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:10\:dark, html.var.auto .sf-c-txt-cadetblue\:10\:dark { color: hsl(182, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:15\:dark, html.var.auto .sf-c-txt-cadetblue\:15\:dark { color: hsl(182, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:20\:dark, html.var.auto .sf-c-txt-cadetblue\:20\:dark { color: hsl(182, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:25\:dark, html.var.auto .sf-c-txt-cadetblue\:25\:dark { color: hsl(182, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:30\:dark, html.var.auto .sf-c-txt-cadetblue\:30\:dark { color: hsl(182, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:35\:dark, html.var.auto .sf-c-txt-cadetblue\:35\:dark { color: hsl(182, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:40\:dark, html.var.auto .sf-c-txt-cadetblue\:40\:dark { color: hsl(182, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:45\:dark, html.var.auto .sf-c-txt-cadetblue\:45\:dark { color: hsl(182, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:50\:dark, html.var.auto .sf-c-txt-cadetblue\:50\:dark { color: hsl(182, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:55\:dark, html.var.auto .sf-c-txt-cadetblue\:55\:dark { color: hsl(182, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:60\:dark, html.var.auto .sf-c-txt-cadetblue\:60\:dark { color: hsl(182, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:65\:dark, html.var.auto .sf-c-txt-cadetblue\:65\:dark { color: hsl(182, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:70\:dark, html.var.auto .sf-c-txt-cadetblue\:70\:dark { color: hsl(182, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:75\:dark, html.var.auto .sf-c-txt-cadetblue\:75\:dark { color: hsl(182, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:80\:dark, html.var.auto .sf-c-txt-cadetblue\:80\:dark { color: hsl(182, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:85\:dark, html.var.auto .sf-c-txt-cadetblue\:85\:dark { color: hsl(182, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:90\:dark, html.var.auto .sf-c-txt-cadetblue\:90\:dark { color: hsl(182, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:95\:dark, html.var.auto .sf-c-txt-cadetblue\:95\:dark { color: hsl(182, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cadetblue\:100\:dark, html.var.auto .sf-c-txt-cadetblue\:100\:dark { color: hsl(182, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/chartreuse.css b/src/colors/20/chartreuse.css index 01cdb96..bc97dc1 100644 --- a/src/colors/20/chartreuse.css +++ b/src/colors/20/chartreuse.css @@ -1,4 +1,4 @@ -:root { +[class*='chartreuse'] { --sf-c-chartreuse: 90 100% 50%; --sf-c-chartreuse-0: 90 100% 0%; --sf-c-chartreuse-5: 90 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-chartreuse\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-chartreuse\:95\:dark, html.var.auto .sf-c-chartreuse\:95\:dark { color: hsl(90, 100%, 95%); background: hsl(90, 100%, 5%) } html.var[data-theme='auto'] .sf-c-chartreuse\:100\:dark, html.var.auto .sf-c-chartreuse\:100\:dark { color: hsl(90, 100%, 95%); background: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse, html.auto .sf-c-txt-chartreuse { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0, html.auto .sf-c-txt-chartreuse\:0 { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:5, html.auto .sf-c-txt-chartreuse\:5 { color: hsl(90, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10, html.auto .sf-c-txt-chartreuse\:10 { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:15, html.auto .sf-c-txt-chartreuse\:15 { color: hsl(90, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20, html.auto .sf-c-txt-chartreuse\:20 { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:25, html.auto .sf-c-txt-chartreuse\:25 { color: hsl(90, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30, html.auto .sf-c-txt-chartreuse\:30 { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:35, html.auto .sf-c-txt-chartreuse\:35 { color: hsl(90, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40, html.auto .sf-c-txt-chartreuse\:40 { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:45, html.auto .sf-c-txt-chartreuse\:45 { color: hsl(90, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50, html.auto .sf-c-txt-chartreuse\:50 { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:55, html.auto .sf-c-txt-chartreuse\:55 { color: hsl(90, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60, html.auto .sf-c-txt-chartreuse\:60 { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:65, html.auto .sf-c-txt-chartreuse\:65 { color: hsl(90, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70, html.auto .sf-c-txt-chartreuse\:70 { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:75, html.auto .sf-c-txt-chartreuse\:75 { color: hsl(90, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80, html.auto .sf-c-txt-chartreuse\:80 { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:85, html.auto .sf-c-txt-chartreuse\:85 { color: hsl(90, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90, html.auto .sf-c-txt-chartreuse\:90 { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:95, html.auto .sf-c-txt-chartreuse\:95 { color: hsl(90, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100, html.auto .sf-c-txt-chartreuse\:100 { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse, html.var.auto .sf-c-txt-chartreuse { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0, html.var.auto .sf-c-txt-chartreuse\:0 { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:5, html.var.auto .sf-c-txt-chartreuse\:5 { color: hsl(90, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10, html.var.auto .sf-c-txt-chartreuse\:10 { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:15, html.var.auto .sf-c-txt-chartreuse\:15 { color: hsl(90, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20, html.var.auto .sf-c-txt-chartreuse\:20 { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:25, html.var.auto .sf-c-txt-chartreuse\:25 { color: hsl(90, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30, html.var.auto .sf-c-txt-chartreuse\:30 { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:35, html.var.auto .sf-c-txt-chartreuse\:35 { color: hsl(90, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40, html.var.auto .sf-c-txt-chartreuse\:40 { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:45, html.var.auto .sf-c-txt-chartreuse\:45 { color: hsl(90, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50, html.var.auto .sf-c-txt-chartreuse\:50 { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:55, html.var.auto .sf-c-txt-chartreuse\:55 { color: hsl(90, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60, html.var.auto .sf-c-txt-chartreuse\:60 { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:65, html.var.auto .sf-c-txt-chartreuse\:65 { color: hsl(90, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70, html.var.auto .sf-c-txt-chartreuse\:70 { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:75, html.var.auto .sf-c-txt-chartreuse\:75 { color: hsl(90, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80, html.var.auto .sf-c-txt-chartreuse\:80 { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:85, html.var.auto .sf-c-txt-chartreuse\:85 { color: hsl(90, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90, html.var.auto .sf-c-txt-chartreuse\:90 { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:95, html.var.auto .sf-c-txt-chartreuse\:95 { color: hsl(90, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100, html.var.auto .sf-c-txt-chartreuse\:100 { color: hsl(90, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:dark, html.auto .sf-c-txt-chartreuse\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0\:dark, html.auto .sf-c-txt-chartreuse\:0\:dark { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:5\:dark, html.auto .sf-c-txt-chartreuse\:5\:dark { color: hsl(90, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10\:dark, html.auto .sf-c-txt-chartreuse\:10\:dark { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:15\:dark, html.auto .sf-c-txt-chartreuse\:15\:dark { color: hsl(90, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20\:dark, html.auto .sf-c-txt-chartreuse\:20\:dark { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:25\:dark, html.auto .sf-c-txt-chartreuse\:25\:dark { color: hsl(90, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30\:dark, html.auto .sf-c-txt-chartreuse\:30\:dark { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:35\:dark, html.auto .sf-c-txt-chartreuse\:35\:dark { color: hsl(90, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40\:dark, html.auto .sf-c-txt-chartreuse\:40\:dark { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:45\:dark, html.auto .sf-c-txt-chartreuse\:45\:dark { color: hsl(90, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50\:dark, html.auto .sf-c-txt-chartreuse\:50\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:55\:dark, html.auto .sf-c-txt-chartreuse\:55\:dark { color: hsl(90, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60\:dark, html.auto .sf-c-txt-chartreuse\:60\:dark { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:65\:dark, html.auto .sf-c-txt-chartreuse\:65\:dark { color: hsl(90, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70\:dark, html.auto .sf-c-txt-chartreuse\:70\:dark { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:75\:dark, html.auto .sf-c-txt-chartreuse\:75\:dark { color: hsl(90, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80\:dark, html.auto .sf-c-txt-chartreuse\:80\:dark { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:85\:dark, html.auto .sf-c-txt-chartreuse\:85\:dark { color: hsl(90, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90\:dark, html.auto .sf-c-txt-chartreuse\:90\:dark { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:95\:dark, html.auto .sf-c-txt-chartreuse\:95\:dark { color: hsl(90, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100\:dark, html.auto .sf-c-txt-chartreuse\:100\:dark { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:dark, html.var.auto .sf-c-txt-chartreuse\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:0\:dark, html.var.auto .sf-c-txt-chartreuse\:0\:dark { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:5\:dark, html.var.auto .sf-c-txt-chartreuse\:5\:dark { color: hsl(90, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:10\:dark, html.var.auto .sf-c-txt-chartreuse\:10\:dark { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:15\:dark, html.var.auto .sf-c-txt-chartreuse\:15\:dark { color: hsl(90, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:20\:dark, html.var.auto .sf-c-txt-chartreuse\:20\:dark { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:25\:dark, html.var.auto .sf-c-txt-chartreuse\:25\:dark { color: hsl(90, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:30\:dark, html.var.auto .sf-c-txt-chartreuse\:30\:dark { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:35\:dark, html.var.auto .sf-c-txt-chartreuse\:35\:dark { color: hsl(90, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:40\:dark, html.var.auto .sf-c-txt-chartreuse\:40\:dark { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:45\:dark, html.var.auto .sf-c-txt-chartreuse\:45\:dark { color: hsl(90, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:50\:dark, html.var.auto .sf-c-txt-chartreuse\:50\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:55\:dark, html.var.auto .sf-c-txt-chartreuse\:55\:dark { color: hsl(90, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:60\:dark, html.var.auto .sf-c-txt-chartreuse\:60\:dark { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:65\:dark, html.var.auto .sf-c-txt-chartreuse\:65\:dark { color: hsl(90, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:70\:dark, html.var.auto .sf-c-txt-chartreuse\:70\:dark { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:75\:dark, html.var.auto .sf-c-txt-chartreuse\:75\:dark { color: hsl(90, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:80\:dark, html.var.auto .sf-c-txt-chartreuse\:80\:dark { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:85\:dark, html.var.auto .sf-c-txt-chartreuse\:85\:dark { color: hsl(90, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:90\:dark, html.var.auto .sf-c-txt-chartreuse\:90\:dark { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:95\:dark, html.var.auto .sf-c-txt-chartreuse\:95\:dark { color: hsl(90, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-chartreuse\:100\:dark, html.var.auto .sf-c-txt-chartreuse\:100\:dark { color: hsl(90, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/chocolate.css b/src/colors/20/chocolate.css index 0323dcf..f1c523b 100644 --- a/src/colors/20/chocolate.css +++ b/src/colors/20/chocolate.css @@ -1,4 +1,4 @@ -:root { +[class*='chocolate'] { --sf-c-chocolate: 25 75% 47%; --sf-c-chocolate-0: 25 75% 0%; --sf-c-chocolate-5: 25 75% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-chocolate\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-chocolate\:95\:dark, html.var.auto .sf-c-chocolate\:95\:dark { color: hsl(25, 75%, 95%); background: hsl(25, 75%, 5%) } html.var[data-theme='auto'] .sf-c-chocolate\:100\:dark, html.var.auto .sf-c-chocolate\:100\:dark { color: hsl(25, 75%, 95%); background: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate, html.auto .sf-c-txt-chocolate { color: hsl(25, 75%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:0, html.auto .sf-c-txt-chocolate\:0 { color: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:5, html.auto .sf-c-txt-chocolate\:5 { color: hsl(25, 75%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:10, html.auto .sf-c-txt-chocolate\:10 { color: hsl(25, 75%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:15, html.auto .sf-c-txt-chocolate\:15 { color: hsl(25, 75%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:20, html.auto .sf-c-txt-chocolate\:20 { color: hsl(25, 75%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:25, html.auto .sf-c-txt-chocolate\:25 { color: hsl(25, 75%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:30, html.auto .sf-c-txt-chocolate\:30 { color: hsl(25, 75%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:35, html.auto .sf-c-txt-chocolate\:35 { color: hsl(25, 75%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:40, html.auto .sf-c-txt-chocolate\:40 { color: hsl(25, 75%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:45, html.auto .sf-c-txt-chocolate\:45 { color: hsl(25, 75%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:50, html.auto .sf-c-txt-chocolate\:50 { color: hsl(25, 75%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:55, html.auto .sf-c-txt-chocolate\:55 { color: hsl(25, 75%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:60, html.auto .sf-c-txt-chocolate\:60 { color: hsl(25, 75%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:65, html.auto .sf-c-txt-chocolate\:65 { color: hsl(25, 75%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:70, html.auto .sf-c-txt-chocolate\:70 { color: hsl(25, 75%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:75, html.auto .sf-c-txt-chocolate\:75 { color: hsl(25, 75%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:80, html.auto .sf-c-txt-chocolate\:80 { color: hsl(25, 75%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:85, html.auto .sf-c-txt-chocolate\:85 { color: hsl(25, 75%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:90, html.auto .sf-c-txt-chocolate\:90 { color: hsl(25, 75%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:95, html.auto .sf-c-txt-chocolate\:95 { color: hsl(25, 75%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:100, html.auto .sf-c-txt-chocolate\:100 { color: hsl(25, 75%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate, html.var.auto .sf-c-txt-chocolate { color: hsl(25, 75%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:0, html.var.auto .sf-c-txt-chocolate\:0 { color: hsl(25, 75%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:5, html.var.auto .sf-c-txt-chocolate\:5 { color: hsl(25, 75%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:10, html.var.auto .sf-c-txt-chocolate\:10 { color: hsl(25, 75%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:15, html.var.auto .sf-c-txt-chocolate\:15 { color: hsl(25, 75%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:20, html.var.auto .sf-c-txt-chocolate\:20 { color: hsl(25, 75%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:25, html.var.auto .sf-c-txt-chocolate\:25 { color: hsl(25, 75%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:30, html.var.auto .sf-c-txt-chocolate\:30 { color: hsl(25, 75%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:35, html.var.auto .sf-c-txt-chocolate\:35 { color: hsl(25, 75%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:40, html.var.auto .sf-c-txt-chocolate\:40 { color: hsl(25, 75%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:45, html.var.auto .sf-c-txt-chocolate\:45 { color: hsl(25, 75%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:50, html.var.auto .sf-c-txt-chocolate\:50 { color: hsl(25, 75%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:55, html.var.auto .sf-c-txt-chocolate\:55 { color: hsl(25, 75%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:60, html.var.auto .sf-c-txt-chocolate\:60 { color: hsl(25, 75%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:65, html.var.auto .sf-c-txt-chocolate\:65 { color: hsl(25, 75%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:70, html.var.auto .sf-c-txt-chocolate\:70 { color: hsl(25, 75%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:75, html.var.auto .sf-c-txt-chocolate\:75 { color: hsl(25, 75%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:80, html.var.auto .sf-c-txt-chocolate\:80 { color: hsl(25, 75%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:85, html.var.auto .sf-c-txt-chocolate\:85 { color: hsl(25, 75%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:90, html.var.auto .sf-c-txt-chocolate\:90 { color: hsl(25, 75%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:95, html.var.auto .sf-c-txt-chocolate\:95 { color: hsl(25, 75%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:100, html.var.auto .sf-c-txt-chocolate\:100 { color: hsl(25, 75%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:dark, html.auto .sf-c-txt-chocolate\:dark { color: hsl(25, 75%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:0\:dark, html.auto .sf-c-txt-chocolate\:0\:dark { color: hsl(25, 75%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:5\:dark, html.auto .sf-c-txt-chocolate\:5\:dark { color: hsl(25, 75%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:10\:dark, html.auto .sf-c-txt-chocolate\:10\:dark { color: hsl(25, 75%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:15\:dark, html.auto .sf-c-txt-chocolate\:15\:dark { color: hsl(25, 75%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:20\:dark, html.auto .sf-c-txt-chocolate\:20\:dark { color: hsl(25, 75%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:25\:dark, html.auto .sf-c-txt-chocolate\:25\:dark { color: hsl(25, 75%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:30\:dark, html.auto .sf-c-txt-chocolate\:30\:dark { color: hsl(25, 75%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:35\:dark, html.auto .sf-c-txt-chocolate\:35\:dark { color: hsl(25, 75%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:40\:dark, html.auto .sf-c-txt-chocolate\:40\:dark { color: hsl(25, 75%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:45\:dark, html.auto .sf-c-txt-chocolate\:45\:dark { color: hsl(25, 75%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:50\:dark, html.auto .sf-c-txt-chocolate\:50\:dark { color: hsl(25, 75%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:55\:dark, html.auto .sf-c-txt-chocolate\:55\:dark { color: hsl(25, 75%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:60\:dark, html.auto .sf-c-txt-chocolate\:60\:dark { color: hsl(25, 75%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:65\:dark, html.auto .sf-c-txt-chocolate\:65\:dark { color: hsl(25, 75%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:70\:dark, html.auto .sf-c-txt-chocolate\:70\:dark { color: hsl(25, 75%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:75\:dark, html.auto .sf-c-txt-chocolate\:75\:dark { color: hsl(25, 75%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:80\:dark, html.auto .sf-c-txt-chocolate\:80\:dark { color: hsl(25, 75%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:85\:dark, html.auto .sf-c-txt-chocolate\:85\:dark { color: hsl(25, 75%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:90\:dark, html.auto .sf-c-txt-chocolate\:90\:dark { color: hsl(25, 75%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:95\:dark, html.auto .sf-c-txt-chocolate\:95\:dark { color: hsl(25, 75%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-chocolate\:100\:dark, html.auto .sf-c-txt-chocolate\:100\:dark { color: hsl(25, 75%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:dark, html.var.auto .sf-c-txt-chocolate\:dark { color: hsl(25, 75%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:0\:dark, html.var.auto .sf-c-txt-chocolate\:0\:dark { color: hsl(25, 75%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:5\:dark, html.var.auto .sf-c-txt-chocolate\:5\:dark { color: hsl(25, 75%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:10\:dark, html.var.auto .sf-c-txt-chocolate\:10\:dark { color: hsl(25, 75%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:15\:dark, html.var.auto .sf-c-txt-chocolate\:15\:dark { color: hsl(25, 75%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:20\:dark, html.var.auto .sf-c-txt-chocolate\:20\:dark { color: hsl(25, 75%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:25\:dark, html.var.auto .sf-c-txt-chocolate\:25\:dark { color: hsl(25, 75%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:30\:dark, html.var.auto .sf-c-txt-chocolate\:30\:dark { color: hsl(25, 75%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:35\:dark, html.var.auto .sf-c-txt-chocolate\:35\:dark { color: hsl(25, 75%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:40\:dark, html.var.auto .sf-c-txt-chocolate\:40\:dark { color: hsl(25, 75%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:45\:dark, html.var.auto .sf-c-txt-chocolate\:45\:dark { color: hsl(25, 75%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:50\:dark, html.var.auto .sf-c-txt-chocolate\:50\:dark { color: hsl(25, 75%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:55\:dark, html.var.auto .sf-c-txt-chocolate\:55\:dark { color: hsl(25, 75%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:60\:dark, html.var.auto .sf-c-txt-chocolate\:60\:dark { color: hsl(25, 75%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:65\:dark, html.var.auto .sf-c-txt-chocolate\:65\:dark { color: hsl(25, 75%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:70\:dark, html.var.auto .sf-c-txt-chocolate\:70\:dark { color: hsl(25, 75%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:75\:dark, html.var.auto .sf-c-txt-chocolate\:75\:dark { color: hsl(25, 75%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:80\:dark, html.var.auto .sf-c-txt-chocolate\:80\:dark { color: hsl(25, 75%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:85\:dark, html.var.auto .sf-c-txt-chocolate\:85\:dark { color: hsl(25, 75%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:90\:dark, html.var.auto .sf-c-txt-chocolate\:90\:dark { color: hsl(25, 75%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:95\:dark, html.var.auto .sf-c-txt-chocolate\:95\:dark { color: hsl(25, 75%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-chocolate\:100\:dark, html.var.auto .sf-c-txt-chocolate\:100\:dark { color: hsl(25, 75%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/coral.css b/src/colors/20/coral.css index 2b7bbd8..7f964ef 100644 --- a/src/colors/20/coral.css +++ b/src/colors/20/coral.css @@ -1,4 +1,4 @@ -:root { +[class*='coral'] { --sf-c-coral: 16 100% 66%; --sf-c-coral-0: 16 100% 0%; --sf-c-coral-5: 16 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-coral\:100\:dark, html.dark .sf-c-txt-cora html.var[data-theme='auto'] .sf-c-coral\:95\:dark, html.var.auto .sf-c-coral\:95\:dark { color: hsl(16, 100%, 95%); background: hsl(16, 100%, 5%) } html.var[data-theme='auto'] .sf-c-coral\:100\:dark, html.var.auto .sf-c-coral\:100\:dark { color: hsl(16, 100%, 95%); background: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral, html.auto .sf-c-txt-coral { color: hsl(16, 100%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:0, html.auto .sf-c-txt-coral\:0 { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:5, html.auto .sf-c-txt-coral\:5 { color: hsl(16, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:10, html.auto .sf-c-txt-coral\:10 { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:15, html.auto .sf-c-txt-coral\:15 { color: hsl(16, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:20, html.auto .sf-c-txt-coral\:20 { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:25, html.auto .sf-c-txt-coral\:25 { color: hsl(16, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:30, html.auto .sf-c-txt-coral\:30 { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:35, html.auto .sf-c-txt-coral\:35 { color: hsl(16, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:40, html.auto .sf-c-txt-coral\:40 { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:45, html.auto .sf-c-txt-coral\:45 { color: hsl(16, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:50, html.auto .sf-c-txt-coral\:50 { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:55, html.auto .sf-c-txt-coral\:55 { color: hsl(16, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:60, html.auto .sf-c-txt-coral\:60 { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:65, html.auto .sf-c-txt-coral\:65 { color: hsl(16, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:70, html.auto .sf-c-txt-coral\:70 { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:75, html.auto .sf-c-txt-coral\:75 { color: hsl(16, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:80, html.auto .sf-c-txt-coral\:80 { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:85, html.auto .sf-c-txt-coral\:85 { color: hsl(16, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:90, html.auto .sf-c-txt-coral\:90 { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:95, html.auto .sf-c-txt-coral\:95 { color: hsl(16, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:100, html.auto .sf-c-txt-coral\:100 { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-coral, html.var.auto .sf-c-txt-coral { color: hsl(16, 100%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:0, html.var.auto .sf-c-txt-coral\:0 { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:5, html.var.auto .sf-c-txt-coral\:5 { color: hsl(16, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:10, html.var.auto .sf-c-txt-coral\:10 { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:15, html.var.auto .sf-c-txt-coral\:15 { color: hsl(16, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:20, html.var.auto .sf-c-txt-coral\:20 { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:25, html.var.auto .sf-c-txt-coral\:25 { color: hsl(16, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:30, html.var.auto .sf-c-txt-coral\:30 { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:35, html.var.auto .sf-c-txt-coral\:35 { color: hsl(16, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:40, html.var.auto .sf-c-txt-coral\:40 { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:45, html.var.auto .sf-c-txt-coral\:45 { color: hsl(16, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:50, html.var.auto .sf-c-txt-coral\:50 { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:55, html.var.auto .sf-c-txt-coral\:55 { color: hsl(16, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:60, html.var.auto .sf-c-txt-coral\:60 { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:65, html.var.auto .sf-c-txt-coral\:65 { color: hsl(16, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:70, html.var.auto .sf-c-txt-coral\:70 { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:75, html.var.auto .sf-c-txt-coral\:75 { color: hsl(16, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:80, html.var.auto .sf-c-txt-coral\:80 { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:85, html.var.auto .sf-c-txt-coral\:85 { color: hsl(16, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:90, html.var.auto .sf-c-txt-coral\:90 { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:95, html.var.auto .sf-c-txt-coral\:95 { color: hsl(16, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:100, html.var.auto .sf-c-txt-coral\:100 { color: hsl(16, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:dark, html.auto .sf-c-txt-coral\:dark { color: hsl(16, 100%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:0\:dark, html.auto .sf-c-txt-coral\:0\:dark { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:5\:dark, html.auto .sf-c-txt-coral\:5\:dark { color: hsl(16, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:10\:dark, html.auto .sf-c-txt-coral\:10\:dark { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:15\:dark, html.auto .sf-c-txt-coral\:15\:dark { color: hsl(16, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:20\:dark, html.auto .sf-c-txt-coral\:20\:dark { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:25\:dark, html.auto .sf-c-txt-coral\:25\:dark { color: hsl(16, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:30\:dark, html.auto .sf-c-txt-coral\:30\:dark { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:35\:dark, html.auto .sf-c-txt-coral\:35\:dark { color: hsl(16, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:40\:dark, html.auto .sf-c-txt-coral\:40\:dark { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:45\:dark, html.auto .sf-c-txt-coral\:45\:dark { color: hsl(16, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:50\:dark, html.auto .sf-c-txt-coral\:50\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:55\:dark, html.auto .sf-c-txt-coral\:55\:dark { color: hsl(16, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:60\:dark, html.auto .sf-c-txt-coral\:60\:dark { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:65\:dark, html.auto .sf-c-txt-coral\:65\:dark { color: hsl(16, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:70\:dark, html.auto .sf-c-txt-coral\:70\:dark { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:75\:dark, html.auto .sf-c-txt-coral\:75\:dark { color: hsl(16, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:80\:dark, html.auto .sf-c-txt-coral\:80\:dark { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:85\:dark, html.auto .sf-c-txt-coral\:85\:dark { color: hsl(16, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:90\:dark, html.auto .sf-c-txt-coral\:90\:dark { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:95\:dark, html.auto .sf-c-txt-coral\:95\:dark { color: hsl(16, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-coral\:100\:dark, html.auto .sf-c-txt-coral\:100\:dark { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:dark, html.var.auto .sf-c-txt-coral\:dark { color: hsl(16, 100%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:0\:dark, html.var.auto .sf-c-txt-coral\:0\:dark { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:5\:dark, html.var.auto .sf-c-txt-coral\:5\:dark { color: hsl(16, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:10\:dark, html.var.auto .sf-c-txt-coral\:10\:dark { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:15\:dark, html.var.auto .sf-c-txt-coral\:15\:dark { color: hsl(16, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:20\:dark, html.var.auto .sf-c-txt-coral\:20\:dark { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:25\:dark, html.var.auto .sf-c-txt-coral\:25\:dark { color: hsl(16, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:30\:dark, html.var.auto .sf-c-txt-coral\:30\:dark { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:35\:dark, html.var.auto .sf-c-txt-coral\:35\:dark { color: hsl(16, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:40\:dark, html.var.auto .sf-c-txt-coral\:40\:dark { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:45\:dark, html.var.auto .sf-c-txt-coral\:45\:dark { color: hsl(16, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:50\:dark, html.var.auto .sf-c-txt-coral\:50\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:55\:dark, html.var.auto .sf-c-txt-coral\:55\:dark { color: hsl(16, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:60\:dark, html.var.auto .sf-c-txt-coral\:60\:dark { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:65\:dark, html.var.auto .sf-c-txt-coral\:65\:dark { color: hsl(16, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:70\:dark, html.var.auto .sf-c-txt-coral\:70\:dark { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:75\:dark, html.var.auto .sf-c-txt-coral\:75\:dark { color: hsl(16, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:80\:dark, html.var.auto .sf-c-txt-coral\:80\:dark { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:85\:dark, html.var.auto .sf-c-txt-coral\:85\:dark { color: hsl(16, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:90\:dark, html.var.auto .sf-c-txt-coral\:90\:dark { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:95\:dark, html.var.auto .sf-c-txt-coral\:95\:dark { color: hsl(16, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-coral\:100\:dark, html.var.auto .sf-c-txt-coral\:100\:dark { color: hsl(16, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/cornflowerblue.css b/src/colors/20/cornflowerblue.css index c39ac49..91eb778 100644 --- a/src/colors/20/cornflowerblue.css +++ b/src/colors/20/cornflowerblue.css @@ -1,4 +1,4 @@ -:root { +[class*='cornflowerblue'] { --sf-c-cornflowerblue: 219 79% 66%; --sf-c-cornflowerblue-0: 219 79% 0%; --sf-c-cornflowerblue-5: 219 79% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-cornflowerblue\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-cornflowerblue\:95\:dark, html.var.auto .sf-c-cornflowerblue\:95\:dark { color: hsl(219, 79%, 95%); background: hsl(219, 79%, 5%) } html.var[data-theme='auto'] .sf-c-cornflowerblue\:100\:dark, html.var.auto .sf-c-cornflowerblue\:100\:dark { color: hsl(219, 79%, 95%); background: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue, html.auto .sf-c-txt-cornflowerblue { color: hsl(219, 79%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0, html.auto .sf-c-txt-cornflowerblue\:0 { color: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:5, html.auto .sf-c-txt-cornflowerblue\:5 { color: hsl(219, 79%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10, html.auto .sf-c-txt-cornflowerblue\:10 { color: hsl(219, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:15, html.auto .sf-c-txt-cornflowerblue\:15 { color: hsl(219, 79%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20, html.auto .sf-c-txt-cornflowerblue\:20 { color: hsl(219, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:25, html.auto .sf-c-txt-cornflowerblue\:25 { color: hsl(219, 79%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30, html.auto .sf-c-txt-cornflowerblue\:30 { color: hsl(219, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:35, html.auto .sf-c-txt-cornflowerblue\:35 { color: hsl(219, 79%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40, html.auto .sf-c-txt-cornflowerblue\:40 { color: hsl(219, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:45, html.auto .sf-c-txt-cornflowerblue\:45 { color: hsl(219, 79%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50, html.auto .sf-c-txt-cornflowerblue\:50 { color: hsl(219, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:55, html.auto .sf-c-txt-cornflowerblue\:55 { color: hsl(219, 79%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60, html.auto .sf-c-txt-cornflowerblue\:60 { color: hsl(219, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:65, html.auto .sf-c-txt-cornflowerblue\:65 { color: hsl(219, 79%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70, html.auto .sf-c-txt-cornflowerblue\:70 { color: hsl(219, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:75, html.auto .sf-c-txt-cornflowerblue\:75 { color: hsl(219, 79%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80, html.auto .sf-c-txt-cornflowerblue\:80 { color: hsl(219, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:85, html.auto .sf-c-txt-cornflowerblue\:85 { color: hsl(219, 79%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90, html.auto .sf-c-txt-cornflowerblue\:90 { color: hsl(219, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:95, html.auto .sf-c-txt-cornflowerblue\:95 { color: hsl(219, 79%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100, html.auto .sf-c-txt-cornflowerblue\:100 { color: hsl(219, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue, html.var.auto .sf-c-txt-cornflowerblue { color: hsl(219, 79%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0, html.var.auto .sf-c-txt-cornflowerblue\:0 { color: hsl(219, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:5, html.var.auto .sf-c-txt-cornflowerblue\:5 { color: hsl(219, 79%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10, html.var.auto .sf-c-txt-cornflowerblue\:10 { color: hsl(219, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:15, html.var.auto .sf-c-txt-cornflowerblue\:15 { color: hsl(219, 79%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20, html.var.auto .sf-c-txt-cornflowerblue\:20 { color: hsl(219, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:25, html.var.auto .sf-c-txt-cornflowerblue\:25 { color: hsl(219, 79%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30, html.var.auto .sf-c-txt-cornflowerblue\:30 { color: hsl(219, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:35, html.var.auto .sf-c-txt-cornflowerblue\:35 { color: hsl(219, 79%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40, html.var.auto .sf-c-txt-cornflowerblue\:40 { color: hsl(219, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:45, html.var.auto .sf-c-txt-cornflowerblue\:45 { color: hsl(219, 79%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50, html.var.auto .sf-c-txt-cornflowerblue\:50 { color: hsl(219, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:55, html.var.auto .sf-c-txt-cornflowerblue\:55 { color: hsl(219, 79%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60, html.var.auto .sf-c-txt-cornflowerblue\:60 { color: hsl(219, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:65, html.var.auto .sf-c-txt-cornflowerblue\:65 { color: hsl(219, 79%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70, html.var.auto .sf-c-txt-cornflowerblue\:70 { color: hsl(219, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:75, html.var.auto .sf-c-txt-cornflowerblue\:75 { color: hsl(219, 79%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80, html.var.auto .sf-c-txt-cornflowerblue\:80 { color: hsl(219, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:85, html.var.auto .sf-c-txt-cornflowerblue\:85 { color: hsl(219, 79%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90, html.var.auto .sf-c-txt-cornflowerblue\:90 { color: hsl(219, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:95, html.var.auto .sf-c-txt-cornflowerblue\:95 { color: hsl(219, 79%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100, html.var.auto .sf-c-txt-cornflowerblue\:100 { color: hsl(219, 79%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:dark, html.auto .sf-c-txt-cornflowerblue\:dark { color: hsl(219, 79%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0\:dark, html.auto .sf-c-txt-cornflowerblue\:0\:dark { color: hsl(219, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:5\:dark, html.auto .sf-c-txt-cornflowerblue\:5\:dark { color: hsl(219, 79%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10\:dark, html.auto .sf-c-txt-cornflowerblue\:10\:dark { color: hsl(219, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:15\:dark, html.auto .sf-c-txt-cornflowerblue\:15\:dark { color: hsl(219, 79%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20\:dark, html.auto .sf-c-txt-cornflowerblue\:20\:dark { color: hsl(219, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:25\:dark, html.auto .sf-c-txt-cornflowerblue\:25\:dark { color: hsl(219, 79%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30\:dark, html.auto .sf-c-txt-cornflowerblue\:30\:dark { color: hsl(219, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:35\:dark, html.auto .sf-c-txt-cornflowerblue\:35\:dark { color: hsl(219, 79%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40\:dark, html.auto .sf-c-txt-cornflowerblue\:40\:dark { color: hsl(219, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:45\:dark, html.auto .sf-c-txt-cornflowerblue\:45\:dark { color: hsl(219, 79%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50\:dark, html.auto .sf-c-txt-cornflowerblue\:50\:dark { color: hsl(219, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:55\:dark, html.auto .sf-c-txt-cornflowerblue\:55\:dark { color: hsl(219, 79%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60\:dark, html.auto .sf-c-txt-cornflowerblue\:60\:dark { color: hsl(219, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:65\:dark, html.auto .sf-c-txt-cornflowerblue\:65\:dark { color: hsl(219, 79%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70\:dark, html.auto .sf-c-txt-cornflowerblue\:70\:dark { color: hsl(219, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:75\:dark, html.auto .sf-c-txt-cornflowerblue\:75\:dark { color: hsl(219, 79%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80\:dark, html.auto .sf-c-txt-cornflowerblue\:80\:dark { color: hsl(219, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:85\:dark, html.auto .sf-c-txt-cornflowerblue\:85\:dark { color: hsl(219, 79%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90\:dark, html.auto .sf-c-txt-cornflowerblue\:90\:dark { color: hsl(219, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:95\:dark, html.auto .sf-c-txt-cornflowerblue\:95\:dark { color: hsl(219, 79%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100\:dark, html.auto .sf-c-txt-cornflowerblue\:100\:dark { color: hsl(219, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:dark, html.var.auto .sf-c-txt-cornflowerblue\:dark { color: hsl(219, 79%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:0\:dark, html.var.auto .sf-c-txt-cornflowerblue\:0\:dark { color: hsl(219, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:5\:dark, html.var.auto .sf-c-txt-cornflowerblue\:5\:dark { color: hsl(219, 79%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:10\:dark, html.var.auto .sf-c-txt-cornflowerblue\:10\:dark { color: hsl(219, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:15\:dark, html.var.auto .sf-c-txt-cornflowerblue\:15\:dark { color: hsl(219, 79%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:20\:dark, html.var.auto .sf-c-txt-cornflowerblue\:20\:dark { color: hsl(219, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:25\:dark, html.var.auto .sf-c-txt-cornflowerblue\:25\:dark { color: hsl(219, 79%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:30\:dark, html.var.auto .sf-c-txt-cornflowerblue\:30\:dark { color: hsl(219, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:35\:dark, html.var.auto .sf-c-txt-cornflowerblue\:35\:dark { color: hsl(219, 79%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:40\:dark, html.var.auto .sf-c-txt-cornflowerblue\:40\:dark { color: hsl(219, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:45\:dark, html.var.auto .sf-c-txt-cornflowerblue\:45\:dark { color: hsl(219, 79%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:50\:dark, html.var.auto .sf-c-txt-cornflowerblue\:50\:dark { color: hsl(219, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:55\:dark, html.var.auto .sf-c-txt-cornflowerblue\:55\:dark { color: hsl(219, 79%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:60\:dark, html.var.auto .sf-c-txt-cornflowerblue\:60\:dark { color: hsl(219, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:65\:dark, html.var.auto .sf-c-txt-cornflowerblue\:65\:dark { color: hsl(219, 79%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:70\:dark, html.var.auto .sf-c-txt-cornflowerblue\:70\:dark { color: hsl(219, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:75\:dark, html.var.auto .sf-c-txt-cornflowerblue\:75\:dark { color: hsl(219, 79%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:80\:dark, html.var.auto .sf-c-txt-cornflowerblue\:80\:dark { color: hsl(219, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:85\:dark, html.var.auto .sf-c-txt-cornflowerblue\:85\:dark { color: hsl(219, 79%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:90\:dark, html.var.auto .sf-c-txt-cornflowerblue\:90\:dark { color: hsl(219, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:95\:dark, html.var.auto .sf-c-txt-cornflowerblue\:95\:dark { color: hsl(219, 79%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cornflowerblue\:100\:dark, html.var.auto .sf-c-txt-cornflowerblue\:100\:dark { color: hsl(219, 79%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/cornsilk.css b/src/colors/20/cornsilk.css index f1e5654..80130ff 100644 --- a/src/colors/20/cornsilk.css +++ b/src/colors/20/cornsilk.css @@ -1,4 +1,4 @@ -:root { +[class*='cornsilk'] { --sf-c-cornsilk: 48 100% 93%; --sf-c-cornsilk-0: 48 100% 0%; --sf-c-cornsilk-5: 48 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-cornsilk\:100\:dark, html.dark .sf-c-txt-c html.var[data-theme='auto'] .sf-c-cornsilk\:95\:dark, html.var.auto .sf-c-cornsilk\:95\:dark { color: hsl(48, 100%, 95%); background: hsl(48, 100%, 5%) } html.var[data-theme='auto'] .sf-c-cornsilk\:100\:dark, html.var.auto .sf-c-cornsilk\:100\:dark { color: hsl(48, 100%, 95%); background: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk, html.auto .sf-c-txt-cornsilk { color: hsl(48, 100%, 93%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0, html.auto .sf-c-txt-cornsilk\:0 { color: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:5, html.auto .sf-c-txt-cornsilk\:5 { color: hsl(48, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10, html.auto .sf-c-txt-cornsilk\:10 { color: hsl(48, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:15, html.auto .sf-c-txt-cornsilk\:15 { color: hsl(48, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20, html.auto .sf-c-txt-cornsilk\:20 { color: hsl(48, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:25, html.auto .sf-c-txt-cornsilk\:25 { color: hsl(48, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30, html.auto .sf-c-txt-cornsilk\:30 { color: hsl(48, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:35, html.auto .sf-c-txt-cornsilk\:35 { color: hsl(48, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40, html.auto .sf-c-txt-cornsilk\:40 { color: hsl(48, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:45, html.auto .sf-c-txt-cornsilk\:45 { color: hsl(48, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50, html.auto .sf-c-txt-cornsilk\:50 { color: hsl(48, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:55, html.auto .sf-c-txt-cornsilk\:55 { color: hsl(48, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60, html.auto .sf-c-txt-cornsilk\:60 { color: hsl(48, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:65, html.auto .sf-c-txt-cornsilk\:65 { color: hsl(48, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70, html.auto .sf-c-txt-cornsilk\:70 { color: hsl(48, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:75, html.auto .sf-c-txt-cornsilk\:75 { color: hsl(48, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80, html.auto .sf-c-txt-cornsilk\:80 { color: hsl(48, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:85, html.auto .sf-c-txt-cornsilk\:85 { color: hsl(48, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90, html.auto .sf-c-txt-cornsilk\:90 { color: hsl(48, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:95, html.auto .sf-c-txt-cornsilk\:95 { color: hsl(48, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100, html.auto .sf-c-txt-cornsilk\:100 { color: hsl(48, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk, html.var.auto .sf-c-txt-cornsilk { color: hsl(48, 100%, 93%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0, html.var.auto .sf-c-txt-cornsilk\:0 { color: hsl(48, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:5, html.var.auto .sf-c-txt-cornsilk\:5 { color: hsl(48, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10, html.var.auto .sf-c-txt-cornsilk\:10 { color: hsl(48, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:15, html.var.auto .sf-c-txt-cornsilk\:15 { color: hsl(48, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20, html.var.auto .sf-c-txt-cornsilk\:20 { color: hsl(48, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:25, html.var.auto .sf-c-txt-cornsilk\:25 { color: hsl(48, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30, html.var.auto .sf-c-txt-cornsilk\:30 { color: hsl(48, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:35, html.var.auto .sf-c-txt-cornsilk\:35 { color: hsl(48, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40, html.var.auto .sf-c-txt-cornsilk\:40 { color: hsl(48, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:45, html.var.auto .sf-c-txt-cornsilk\:45 { color: hsl(48, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50, html.var.auto .sf-c-txt-cornsilk\:50 { color: hsl(48, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:55, html.var.auto .sf-c-txt-cornsilk\:55 { color: hsl(48, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60, html.var.auto .sf-c-txt-cornsilk\:60 { color: hsl(48, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:65, html.var.auto .sf-c-txt-cornsilk\:65 { color: hsl(48, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70, html.var.auto .sf-c-txt-cornsilk\:70 { color: hsl(48, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:75, html.var.auto .sf-c-txt-cornsilk\:75 { color: hsl(48, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80, html.var.auto .sf-c-txt-cornsilk\:80 { color: hsl(48, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:85, html.var.auto .sf-c-txt-cornsilk\:85 { color: hsl(48, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90, html.var.auto .sf-c-txt-cornsilk\:90 { color: hsl(48, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:95, html.var.auto .sf-c-txt-cornsilk\:95 { color: hsl(48, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100, html.var.auto .sf-c-txt-cornsilk\:100 { color: hsl(48, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:dark, html.auto .sf-c-txt-cornsilk\:dark { color: hsl(48, 100%, 93%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0\:dark, html.auto .sf-c-txt-cornsilk\:0\:dark { color: hsl(48, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:5\:dark, html.auto .sf-c-txt-cornsilk\:5\:dark { color: hsl(48, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10\:dark, html.auto .sf-c-txt-cornsilk\:10\:dark { color: hsl(48, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:15\:dark, html.auto .sf-c-txt-cornsilk\:15\:dark { color: hsl(48, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20\:dark, html.auto .sf-c-txt-cornsilk\:20\:dark { color: hsl(48, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:25\:dark, html.auto .sf-c-txt-cornsilk\:25\:dark { color: hsl(48, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30\:dark, html.auto .sf-c-txt-cornsilk\:30\:dark { color: hsl(48, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:35\:dark, html.auto .sf-c-txt-cornsilk\:35\:dark { color: hsl(48, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40\:dark, html.auto .sf-c-txt-cornsilk\:40\:dark { color: hsl(48, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:45\:dark, html.auto .sf-c-txt-cornsilk\:45\:dark { color: hsl(48, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50\:dark, html.auto .sf-c-txt-cornsilk\:50\:dark { color: hsl(48, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:55\:dark, html.auto .sf-c-txt-cornsilk\:55\:dark { color: hsl(48, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60\:dark, html.auto .sf-c-txt-cornsilk\:60\:dark { color: hsl(48, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:65\:dark, html.auto .sf-c-txt-cornsilk\:65\:dark { color: hsl(48, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70\:dark, html.auto .sf-c-txt-cornsilk\:70\:dark { color: hsl(48, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:75\:dark, html.auto .sf-c-txt-cornsilk\:75\:dark { color: hsl(48, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80\:dark, html.auto .sf-c-txt-cornsilk\:80\:dark { color: hsl(48, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:85\:dark, html.auto .sf-c-txt-cornsilk\:85\:dark { color: hsl(48, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90\:dark, html.auto .sf-c-txt-cornsilk\:90\:dark { color: hsl(48, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:95\:dark, html.auto .sf-c-txt-cornsilk\:95\:dark { color: hsl(48, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100\:dark, html.auto .sf-c-txt-cornsilk\:100\:dark { color: hsl(48, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:dark, html.var.auto .sf-c-txt-cornsilk\:dark { color: hsl(48, 100%, 93%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:0\:dark, html.var.auto .sf-c-txt-cornsilk\:0\:dark { color: hsl(48, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:5\:dark, html.var.auto .sf-c-txt-cornsilk\:5\:dark { color: hsl(48, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:10\:dark, html.var.auto .sf-c-txt-cornsilk\:10\:dark { color: hsl(48, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:15\:dark, html.var.auto .sf-c-txt-cornsilk\:15\:dark { color: hsl(48, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:20\:dark, html.var.auto .sf-c-txt-cornsilk\:20\:dark { color: hsl(48, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:25\:dark, html.var.auto .sf-c-txt-cornsilk\:25\:dark { color: hsl(48, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:30\:dark, html.var.auto .sf-c-txt-cornsilk\:30\:dark { color: hsl(48, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:35\:dark, html.var.auto .sf-c-txt-cornsilk\:35\:dark { color: hsl(48, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:40\:dark, html.var.auto .sf-c-txt-cornsilk\:40\:dark { color: hsl(48, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:45\:dark, html.var.auto .sf-c-txt-cornsilk\:45\:dark { color: hsl(48, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:50\:dark, html.var.auto .sf-c-txt-cornsilk\:50\:dark { color: hsl(48, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:55\:dark, html.var.auto .sf-c-txt-cornsilk\:55\:dark { color: hsl(48, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:60\:dark, html.var.auto .sf-c-txt-cornsilk\:60\:dark { color: hsl(48, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:65\:dark, html.var.auto .sf-c-txt-cornsilk\:65\:dark { color: hsl(48, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:70\:dark, html.var.auto .sf-c-txt-cornsilk\:70\:dark { color: hsl(48, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:75\:dark, html.var.auto .sf-c-txt-cornsilk\:75\:dark { color: hsl(48, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:80\:dark, html.var.auto .sf-c-txt-cornsilk\:80\:dark { color: hsl(48, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:85\:dark, html.var.auto .sf-c-txt-cornsilk\:85\:dark { color: hsl(48, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:90\:dark, html.var.auto .sf-c-txt-cornsilk\:90\:dark { color: hsl(48, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:95\:dark, html.var.auto .sf-c-txt-cornsilk\:95\:dark { color: hsl(48, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cornsilk\:100\:dark, html.var.auto .sf-c-txt-cornsilk\:100\:dark { color: hsl(48, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/crimson.css b/src/colors/20/crimson.css index 1a82330..6fca4de 100644 --- a/src/colors/20/crimson.css +++ b/src/colors/20/crimson.css @@ -1,4 +1,4 @@ -:root { +[class*='crimson'] { --sf-c-crimson: 348 83% 47%; --sf-c-crimson-0: 348 83% 0%; --sf-c-crimson-5: 348 83% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-crimson\:100\:dark, html.dark .sf-c-txt-cr html.var[data-theme='auto'] .sf-c-crimson\:95\:dark, html.var.auto .sf-c-crimson\:95\:dark { color: hsl(348, 83%, 95%); background: hsl(348, 83%, 5%) } html.var[data-theme='auto'] .sf-c-crimson\:100\:dark, html.var.auto .sf-c-crimson\:100\:dark { color: hsl(348, 83%, 95%); background: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson, html.auto .sf-c-txt-crimson { color: hsl(348, 83%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:0, html.auto .sf-c-txt-crimson\:0 { color: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:5, html.auto .sf-c-txt-crimson\:5 { color: hsl(348, 83%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:10, html.auto .sf-c-txt-crimson\:10 { color: hsl(348, 83%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:15, html.auto .sf-c-txt-crimson\:15 { color: hsl(348, 83%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:20, html.auto .sf-c-txt-crimson\:20 { color: hsl(348, 83%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:25, html.auto .sf-c-txt-crimson\:25 { color: hsl(348, 83%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:30, html.auto .sf-c-txt-crimson\:30 { color: hsl(348, 83%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:35, html.auto .sf-c-txt-crimson\:35 { color: hsl(348, 83%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:40, html.auto .sf-c-txt-crimson\:40 { color: hsl(348, 83%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:45, html.auto .sf-c-txt-crimson\:45 { color: hsl(348, 83%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:50, html.auto .sf-c-txt-crimson\:50 { color: hsl(348, 83%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:55, html.auto .sf-c-txt-crimson\:55 { color: hsl(348, 83%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:60, html.auto .sf-c-txt-crimson\:60 { color: hsl(348, 83%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:65, html.auto .sf-c-txt-crimson\:65 { color: hsl(348, 83%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:70, html.auto .sf-c-txt-crimson\:70 { color: hsl(348, 83%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:75, html.auto .sf-c-txt-crimson\:75 { color: hsl(348, 83%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:80, html.auto .sf-c-txt-crimson\:80 { color: hsl(348, 83%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:85, html.auto .sf-c-txt-crimson\:85 { color: hsl(348, 83%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:90, html.auto .sf-c-txt-crimson\:90 { color: hsl(348, 83%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:95, html.auto .sf-c-txt-crimson\:95 { color: hsl(348, 83%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:100, html.auto .sf-c-txt-crimson\:100 { color: hsl(348, 83%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-crimson, html.var.auto .sf-c-txt-crimson { color: hsl(348, 83%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:0, html.var.auto .sf-c-txt-crimson\:0 { color: hsl(348, 83%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:5, html.var.auto .sf-c-txt-crimson\:5 { color: hsl(348, 83%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:10, html.var.auto .sf-c-txt-crimson\:10 { color: hsl(348, 83%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:15, html.var.auto .sf-c-txt-crimson\:15 { color: hsl(348, 83%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:20, html.var.auto .sf-c-txt-crimson\:20 { color: hsl(348, 83%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:25, html.var.auto .sf-c-txt-crimson\:25 { color: hsl(348, 83%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:30, html.var.auto .sf-c-txt-crimson\:30 { color: hsl(348, 83%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:35, html.var.auto .sf-c-txt-crimson\:35 { color: hsl(348, 83%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:40, html.var.auto .sf-c-txt-crimson\:40 { color: hsl(348, 83%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:45, html.var.auto .sf-c-txt-crimson\:45 { color: hsl(348, 83%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:50, html.var.auto .sf-c-txt-crimson\:50 { color: hsl(348, 83%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:55, html.var.auto .sf-c-txt-crimson\:55 { color: hsl(348, 83%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:60, html.var.auto .sf-c-txt-crimson\:60 { color: hsl(348, 83%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:65, html.var.auto .sf-c-txt-crimson\:65 { color: hsl(348, 83%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:70, html.var.auto .sf-c-txt-crimson\:70 { color: hsl(348, 83%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:75, html.var.auto .sf-c-txt-crimson\:75 { color: hsl(348, 83%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:80, html.var.auto .sf-c-txt-crimson\:80 { color: hsl(348, 83%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:85, html.var.auto .sf-c-txt-crimson\:85 { color: hsl(348, 83%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:90, html.var.auto .sf-c-txt-crimson\:90 { color: hsl(348, 83%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:95, html.var.auto .sf-c-txt-crimson\:95 { color: hsl(348, 83%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:100, html.var.auto .sf-c-txt-crimson\:100 { color: hsl(348, 83%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:dark, html.auto .sf-c-txt-crimson\:dark { color: hsl(348, 83%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:0\:dark, html.auto .sf-c-txt-crimson\:0\:dark { color: hsl(348, 83%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:5\:dark, html.auto .sf-c-txt-crimson\:5\:dark { color: hsl(348, 83%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:10\:dark, html.auto .sf-c-txt-crimson\:10\:dark { color: hsl(348, 83%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:15\:dark, html.auto .sf-c-txt-crimson\:15\:dark { color: hsl(348, 83%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:20\:dark, html.auto .sf-c-txt-crimson\:20\:dark { color: hsl(348, 83%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:25\:dark, html.auto .sf-c-txt-crimson\:25\:dark { color: hsl(348, 83%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:30\:dark, html.auto .sf-c-txt-crimson\:30\:dark { color: hsl(348, 83%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:35\:dark, html.auto .sf-c-txt-crimson\:35\:dark { color: hsl(348, 83%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:40\:dark, html.auto .sf-c-txt-crimson\:40\:dark { color: hsl(348, 83%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:45\:dark, html.auto .sf-c-txt-crimson\:45\:dark { color: hsl(348, 83%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:50\:dark, html.auto .sf-c-txt-crimson\:50\:dark { color: hsl(348, 83%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:55\:dark, html.auto .sf-c-txt-crimson\:55\:dark { color: hsl(348, 83%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:60\:dark, html.auto .sf-c-txt-crimson\:60\:dark { color: hsl(348, 83%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:65\:dark, html.auto .sf-c-txt-crimson\:65\:dark { color: hsl(348, 83%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:70\:dark, html.auto .sf-c-txt-crimson\:70\:dark { color: hsl(348, 83%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:75\:dark, html.auto .sf-c-txt-crimson\:75\:dark { color: hsl(348, 83%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:80\:dark, html.auto .sf-c-txt-crimson\:80\:dark { color: hsl(348, 83%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:85\:dark, html.auto .sf-c-txt-crimson\:85\:dark { color: hsl(348, 83%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:90\:dark, html.auto .sf-c-txt-crimson\:90\:dark { color: hsl(348, 83%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:95\:dark, html.auto .sf-c-txt-crimson\:95\:dark { color: hsl(348, 83%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-crimson\:100\:dark, html.auto .sf-c-txt-crimson\:100\:dark { color: hsl(348, 83%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:dark, html.var.auto .sf-c-txt-crimson\:dark { color: hsl(348, 83%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:0\:dark, html.var.auto .sf-c-txt-crimson\:0\:dark { color: hsl(348, 83%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:5\:dark, html.var.auto .sf-c-txt-crimson\:5\:dark { color: hsl(348, 83%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:10\:dark, html.var.auto .sf-c-txt-crimson\:10\:dark { color: hsl(348, 83%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:15\:dark, html.var.auto .sf-c-txt-crimson\:15\:dark { color: hsl(348, 83%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:20\:dark, html.var.auto .sf-c-txt-crimson\:20\:dark { color: hsl(348, 83%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:25\:dark, html.var.auto .sf-c-txt-crimson\:25\:dark { color: hsl(348, 83%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:30\:dark, html.var.auto .sf-c-txt-crimson\:30\:dark { color: hsl(348, 83%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:35\:dark, html.var.auto .sf-c-txt-crimson\:35\:dark { color: hsl(348, 83%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:40\:dark, html.var.auto .sf-c-txt-crimson\:40\:dark { color: hsl(348, 83%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:45\:dark, html.var.auto .sf-c-txt-crimson\:45\:dark { color: hsl(348, 83%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:50\:dark, html.var.auto .sf-c-txt-crimson\:50\:dark { color: hsl(348, 83%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:55\:dark, html.var.auto .sf-c-txt-crimson\:55\:dark { color: hsl(348, 83%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:60\:dark, html.var.auto .sf-c-txt-crimson\:60\:dark { color: hsl(348, 83%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:65\:dark, html.var.auto .sf-c-txt-crimson\:65\:dark { color: hsl(348, 83%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:70\:dark, html.var.auto .sf-c-txt-crimson\:70\:dark { color: hsl(348, 83%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:75\:dark, html.var.auto .sf-c-txt-crimson\:75\:dark { color: hsl(348, 83%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:80\:dark, html.var.auto .sf-c-txt-crimson\:80\:dark { color: hsl(348, 83%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:85\:dark, html.var.auto .sf-c-txt-crimson\:85\:dark { color: hsl(348, 83%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:90\:dark, html.var.auto .sf-c-txt-crimson\:90\:dark { color: hsl(348, 83%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:95\:dark, html.var.auto .sf-c-txt-crimson\:95\:dark { color: hsl(348, 83%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-crimson\:100\:dark, html.var.auto .sf-c-txt-crimson\:100\:dark { color: hsl(348, 83%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/cyan.css b/src/colors/20/cyan.css index 51295f9..468ed1e 100644 --- a/src/colors/20/cyan.css +++ b/src/colors/20/cyan.css @@ -1,4 +1,4 @@ -:root { +[class*='cyan'] { --sf-c-cyan: 180 100% 50%; --sf-c-cyan-0: 180 100% 0%; --sf-c-cyan-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-cyan\:100\:dark, html.dark .sf-c-txt-cyan\ html.var[data-theme='auto'] .sf-c-cyan\:95\:dark, html.var.auto .sf-c-cyan\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-cyan\:100\:dark, html.var.auto .sf-c-cyan\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan, html.auto .sf-c-txt-cyan { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:0, html.auto .sf-c-txt-cyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:5, html.auto .sf-c-txt-cyan\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:10, html.auto .sf-c-txt-cyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:15, html.auto .sf-c-txt-cyan\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:20, html.auto .sf-c-txt-cyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:25, html.auto .sf-c-txt-cyan\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:30, html.auto .sf-c-txt-cyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:35, html.auto .sf-c-txt-cyan\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:40, html.auto .sf-c-txt-cyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:45, html.auto .sf-c-txt-cyan\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:50, html.auto .sf-c-txt-cyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:55, html.auto .sf-c-txt-cyan\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:60, html.auto .sf-c-txt-cyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:65, html.auto .sf-c-txt-cyan\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:70, html.auto .sf-c-txt-cyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:75, html.auto .sf-c-txt-cyan\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:80, html.auto .sf-c-txt-cyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:85, html.auto .sf-c-txt-cyan\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:90, html.auto .sf-c-txt-cyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:95, html.auto .sf-c-txt-cyan\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:100, html.auto .sf-c-txt-cyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cyan, html.var.auto .sf-c-txt-cyan { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:0, html.var.auto .sf-c-txt-cyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:5, html.var.auto .sf-c-txt-cyan\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:10, html.var.auto .sf-c-txt-cyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:15, html.var.auto .sf-c-txt-cyan\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:20, html.var.auto .sf-c-txt-cyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:25, html.var.auto .sf-c-txt-cyan\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:30, html.var.auto .sf-c-txt-cyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:35, html.var.auto .sf-c-txt-cyan\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:40, html.var.auto .sf-c-txt-cyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:45, html.var.auto .sf-c-txt-cyan\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:50, html.var.auto .sf-c-txt-cyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:55, html.var.auto .sf-c-txt-cyan\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:60, html.var.auto .sf-c-txt-cyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:65, html.var.auto .sf-c-txt-cyan\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:70, html.var.auto .sf-c-txt-cyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:75, html.var.auto .sf-c-txt-cyan\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:80, html.var.auto .sf-c-txt-cyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:85, html.var.auto .sf-c-txt-cyan\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:90, html.var.auto .sf-c-txt-cyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:95, html.var.auto .sf-c-txt-cyan\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:100, html.var.auto .sf-c-txt-cyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:dark, html.auto .sf-c-txt-cyan\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:0\:dark, html.auto .sf-c-txt-cyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:5\:dark, html.auto .sf-c-txt-cyan\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:10\:dark, html.auto .sf-c-txt-cyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:15\:dark, html.auto .sf-c-txt-cyan\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:20\:dark, html.auto .sf-c-txt-cyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:25\:dark, html.auto .sf-c-txt-cyan\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:30\:dark, html.auto .sf-c-txt-cyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:35\:dark, html.auto .sf-c-txt-cyan\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:40\:dark, html.auto .sf-c-txt-cyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:45\:dark, html.auto .sf-c-txt-cyan\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:50\:dark, html.auto .sf-c-txt-cyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:55\:dark, html.auto .sf-c-txt-cyan\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:60\:dark, html.auto .sf-c-txt-cyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:65\:dark, html.auto .sf-c-txt-cyan\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:70\:dark, html.auto .sf-c-txt-cyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:75\:dark, html.auto .sf-c-txt-cyan\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:80\:dark, html.auto .sf-c-txt-cyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:85\:dark, html.auto .sf-c-txt-cyan\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:90\:dark, html.auto .sf-c-txt-cyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:95\:dark, html.auto .sf-c-txt-cyan\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-cyan\:100\:dark, html.auto .sf-c-txt-cyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:dark, html.var.auto .sf-c-txt-cyan\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:0\:dark, html.var.auto .sf-c-txt-cyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:5\:dark, html.var.auto .sf-c-txt-cyan\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:10\:dark, html.var.auto .sf-c-txt-cyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:15\:dark, html.var.auto .sf-c-txt-cyan\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:20\:dark, html.var.auto .sf-c-txt-cyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:25\:dark, html.var.auto .sf-c-txt-cyan\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:30\:dark, html.var.auto .sf-c-txt-cyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:35\:dark, html.var.auto .sf-c-txt-cyan\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:40\:dark, html.var.auto .sf-c-txt-cyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:45\:dark, html.var.auto .sf-c-txt-cyan\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:50\:dark, html.var.auto .sf-c-txt-cyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:55\:dark, html.var.auto .sf-c-txt-cyan\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:60\:dark, html.var.auto .sf-c-txt-cyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:65\:dark, html.var.auto .sf-c-txt-cyan\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:70\:dark, html.var.auto .sf-c-txt-cyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:75\:dark, html.var.auto .sf-c-txt-cyan\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:80\:dark, html.var.auto .sf-c-txt-cyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:85\:dark, html.var.auto .sf-c-txt-cyan\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:90\:dark, html.var.auto .sf-c-txt-cyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:95\:dark, html.var.auto .sf-c-txt-cyan\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-cyan\:100\:dark, html.var.auto .sf-c-txt-cyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkblue.css b/src/colors/20/darkblue.css index 12adbc9..63a9bb9 100644 --- a/src/colors/20/darkblue.css +++ b/src/colors/20/darkblue.css @@ -1,4 +1,4 @@ -:root { +[class*='darkblue'] { --sf-c-darkblue: 240 100% 27%; --sf-c-darkblue-0: 240 100% 0%; --sf-c-darkblue-5: 240 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkblue\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkblue\:95\:dark, html.var.auto .sf-c-darkblue\:95\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkblue\:100\:dark, html.var.auto .sf-c-darkblue\:100\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue, html.auto .sf-c-txt-darkblue { color: hsl(240, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:0, html.auto .sf-c-txt-darkblue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:5, html.auto .sf-c-txt-darkblue\:5 { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:10, html.auto .sf-c-txt-darkblue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:15, html.auto .sf-c-txt-darkblue\:15 { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:20, html.auto .sf-c-txt-darkblue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:25, html.auto .sf-c-txt-darkblue\:25 { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:30, html.auto .sf-c-txt-darkblue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:35, html.auto .sf-c-txt-darkblue\:35 { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:40, html.auto .sf-c-txt-darkblue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:45, html.auto .sf-c-txt-darkblue\:45 { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:50, html.auto .sf-c-txt-darkblue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:55, html.auto .sf-c-txt-darkblue\:55 { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:60, html.auto .sf-c-txt-darkblue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:65, html.auto .sf-c-txt-darkblue\:65 { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:70, html.auto .sf-c-txt-darkblue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:75, html.auto .sf-c-txt-darkblue\:75 { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:80, html.auto .sf-c-txt-darkblue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:85, html.auto .sf-c-txt-darkblue\:85 { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:90, html.auto .sf-c-txt-darkblue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:95, html.auto .sf-c-txt-darkblue\:95 { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:100, html.auto .sf-c-txt-darkblue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue, html.var.auto .sf-c-txt-darkblue { color: hsl(240, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:0, html.var.auto .sf-c-txt-darkblue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:5, html.var.auto .sf-c-txt-darkblue\:5 { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:10, html.var.auto .sf-c-txt-darkblue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:15, html.var.auto .sf-c-txt-darkblue\:15 { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:20, html.var.auto .sf-c-txt-darkblue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:25, html.var.auto .sf-c-txt-darkblue\:25 { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:30, html.var.auto .sf-c-txt-darkblue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:35, html.var.auto .sf-c-txt-darkblue\:35 { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:40, html.var.auto .sf-c-txt-darkblue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:45, html.var.auto .sf-c-txt-darkblue\:45 { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:50, html.var.auto .sf-c-txt-darkblue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:55, html.var.auto .sf-c-txt-darkblue\:55 { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:60, html.var.auto .sf-c-txt-darkblue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:65, html.var.auto .sf-c-txt-darkblue\:65 { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:70, html.var.auto .sf-c-txt-darkblue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:75, html.var.auto .sf-c-txt-darkblue\:75 { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:80, html.var.auto .sf-c-txt-darkblue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:85, html.var.auto .sf-c-txt-darkblue\:85 { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:90, html.var.auto .sf-c-txt-darkblue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:95, html.var.auto .sf-c-txt-darkblue\:95 { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:100, html.var.auto .sf-c-txt-darkblue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:dark, html.auto .sf-c-txt-darkblue\:dark { color: hsl(240, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:0\:dark, html.auto .sf-c-txt-darkblue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:5\:dark, html.auto .sf-c-txt-darkblue\:5\:dark { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:10\:dark, html.auto .sf-c-txt-darkblue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:15\:dark, html.auto .sf-c-txt-darkblue\:15\:dark { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:20\:dark, html.auto .sf-c-txt-darkblue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:25\:dark, html.auto .sf-c-txt-darkblue\:25\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:30\:dark, html.auto .sf-c-txt-darkblue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:35\:dark, html.auto .sf-c-txt-darkblue\:35\:dark { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:40\:dark, html.auto .sf-c-txt-darkblue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:45\:dark, html.auto .sf-c-txt-darkblue\:45\:dark { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:50\:dark, html.auto .sf-c-txt-darkblue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:55\:dark, html.auto .sf-c-txt-darkblue\:55\:dark { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:60\:dark, html.auto .sf-c-txt-darkblue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:65\:dark, html.auto .sf-c-txt-darkblue\:65\:dark { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:70\:dark, html.auto .sf-c-txt-darkblue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:75\:dark, html.auto .sf-c-txt-darkblue\:75\:dark { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:80\:dark, html.auto .sf-c-txt-darkblue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:85\:dark, html.auto .sf-c-txt-darkblue\:85\:dark { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:90\:dark, html.auto .sf-c-txt-darkblue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:95\:dark, html.auto .sf-c-txt-darkblue\:95\:dark { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkblue\:100\:dark, html.auto .sf-c-txt-darkblue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:dark, html.var.auto .sf-c-txt-darkblue\:dark { color: hsl(240, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:0\:dark, html.var.auto .sf-c-txt-darkblue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:5\:dark, html.var.auto .sf-c-txt-darkblue\:5\:dark { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:10\:dark, html.var.auto .sf-c-txt-darkblue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:15\:dark, html.var.auto .sf-c-txt-darkblue\:15\:dark { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:20\:dark, html.var.auto .sf-c-txt-darkblue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:25\:dark, html.var.auto .sf-c-txt-darkblue\:25\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:30\:dark, html.var.auto .sf-c-txt-darkblue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:35\:dark, html.var.auto .sf-c-txt-darkblue\:35\:dark { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:40\:dark, html.var.auto .sf-c-txt-darkblue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:45\:dark, html.var.auto .sf-c-txt-darkblue\:45\:dark { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:50\:dark, html.var.auto .sf-c-txt-darkblue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:55\:dark, html.var.auto .sf-c-txt-darkblue\:55\:dark { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:60\:dark, html.var.auto .sf-c-txt-darkblue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:65\:dark, html.var.auto .sf-c-txt-darkblue\:65\:dark { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:70\:dark, html.var.auto .sf-c-txt-darkblue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:75\:dark, html.var.auto .sf-c-txt-darkblue\:75\:dark { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:80\:dark, html.var.auto .sf-c-txt-darkblue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:85\:dark, html.var.auto .sf-c-txt-darkblue\:85\:dark { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:90\:dark, html.var.auto .sf-c-txt-darkblue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:95\:dark, html.var.auto .sf-c-txt-darkblue\:95\:dark { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkblue\:100\:dark, html.var.auto .sf-c-txt-darkblue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkcyan.css b/src/colors/20/darkcyan.css index 0805741..dffab45 100644 --- a/src/colors/20/darkcyan.css +++ b/src/colors/20/darkcyan.css @@ -1,4 +1,4 @@ -:root { +[class*='darkcyan'] { --sf-c-darkcyan: 180 100% 27%; --sf-c-darkcyan-0: 180 100% 0%; --sf-c-darkcyan-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkcyan\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkcyan\:95\:dark, html.var.auto .sf-c-darkcyan\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkcyan\:100\:dark, html.var.auto .sf-c-darkcyan\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan, html.auto .sf-c-txt-darkcyan { color: hsl(180, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0, html.auto .sf-c-txt-darkcyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:5, html.auto .sf-c-txt-darkcyan\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10, html.auto .sf-c-txt-darkcyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:15, html.auto .sf-c-txt-darkcyan\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20, html.auto .sf-c-txt-darkcyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:25, html.auto .sf-c-txt-darkcyan\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30, html.auto .sf-c-txt-darkcyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:35, html.auto .sf-c-txt-darkcyan\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40, html.auto .sf-c-txt-darkcyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:45, html.auto .sf-c-txt-darkcyan\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50, html.auto .sf-c-txt-darkcyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:55, html.auto .sf-c-txt-darkcyan\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60, html.auto .sf-c-txt-darkcyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:65, html.auto .sf-c-txt-darkcyan\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70, html.auto .sf-c-txt-darkcyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:75, html.auto .sf-c-txt-darkcyan\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80, html.auto .sf-c-txt-darkcyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:85, html.auto .sf-c-txt-darkcyan\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90, html.auto .sf-c-txt-darkcyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:95, html.auto .sf-c-txt-darkcyan\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100, html.auto .sf-c-txt-darkcyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan, html.var.auto .sf-c-txt-darkcyan { color: hsl(180, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0, html.var.auto .sf-c-txt-darkcyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:5, html.var.auto .sf-c-txt-darkcyan\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10, html.var.auto .sf-c-txt-darkcyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:15, html.var.auto .sf-c-txt-darkcyan\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20, html.var.auto .sf-c-txt-darkcyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:25, html.var.auto .sf-c-txt-darkcyan\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30, html.var.auto .sf-c-txt-darkcyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:35, html.var.auto .sf-c-txt-darkcyan\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40, html.var.auto .sf-c-txt-darkcyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:45, html.var.auto .sf-c-txt-darkcyan\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50, html.var.auto .sf-c-txt-darkcyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:55, html.var.auto .sf-c-txt-darkcyan\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60, html.var.auto .sf-c-txt-darkcyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:65, html.var.auto .sf-c-txt-darkcyan\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70, html.var.auto .sf-c-txt-darkcyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:75, html.var.auto .sf-c-txt-darkcyan\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80, html.var.auto .sf-c-txt-darkcyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:85, html.var.auto .sf-c-txt-darkcyan\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90, html.var.auto .sf-c-txt-darkcyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:95, html.var.auto .sf-c-txt-darkcyan\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100, html.var.auto .sf-c-txt-darkcyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:dark, html.auto .sf-c-txt-darkcyan\:dark { color: hsl(180, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0\:dark, html.auto .sf-c-txt-darkcyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:5\:dark, html.auto .sf-c-txt-darkcyan\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10\:dark, html.auto .sf-c-txt-darkcyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:15\:dark, html.auto .sf-c-txt-darkcyan\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20\:dark, html.auto .sf-c-txt-darkcyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:25\:dark, html.auto .sf-c-txt-darkcyan\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30\:dark, html.auto .sf-c-txt-darkcyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:35\:dark, html.auto .sf-c-txt-darkcyan\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40\:dark, html.auto .sf-c-txt-darkcyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:45\:dark, html.auto .sf-c-txt-darkcyan\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50\:dark, html.auto .sf-c-txt-darkcyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:55\:dark, html.auto .sf-c-txt-darkcyan\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60\:dark, html.auto .sf-c-txt-darkcyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:65\:dark, html.auto .sf-c-txt-darkcyan\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70\:dark, html.auto .sf-c-txt-darkcyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:75\:dark, html.auto .sf-c-txt-darkcyan\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80\:dark, html.auto .sf-c-txt-darkcyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:85\:dark, html.auto .sf-c-txt-darkcyan\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90\:dark, html.auto .sf-c-txt-darkcyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:95\:dark, html.auto .sf-c-txt-darkcyan\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100\:dark, html.auto .sf-c-txt-darkcyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:dark, html.var.auto .sf-c-txt-darkcyan\:dark { color: hsl(180, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:0\:dark, html.var.auto .sf-c-txt-darkcyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:5\:dark, html.var.auto .sf-c-txt-darkcyan\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:10\:dark, html.var.auto .sf-c-txt-darkcyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:15\:dark, html.var.auto .sf-c-txt-darkcyan\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:20\:dark, html.var.auto .sf-c-txt-darkcyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:25\:dark, html.var.auto .sf-c-txt-darkcyan\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:30\:dark, html.var.auto .sf-c-txt-darkcyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:35\:dark, html.var.auto .sf-c-txt-darkcyan\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:40\:dark, html.var.auto .sf-c-txt-darkcyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:45\:dark, html.var.auto .sf-c-txt-darkcyan\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:50\:dark, html.var.auto .sf-c-txt-darkcyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:55\:dark, html.var.auto .sf-c-txt-darkcyan\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:60\:dark, html.var.auto .sf-c-txt-darkcyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:65\:dark, html.var.auto .sf-c-txt-darkcyan\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:70\:dark, html.var.auto .sf-c-txt-darkcyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:75\:dark, html.var.auto .sf-c-txt-darkcyan\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:80\:dark, html.var.auto .sf-c-txt-darkcyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:85\:dark, html.var.auto .sf-c-txt-darkcyan\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:90\:dark, html.var.auto .sf-c-txt-darkcyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:95\:dark, html.var.auto .sf-c-txt-darkcyan\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkcyan\:100\:dark, html.var.auto .sf-c-txt-darkcyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkgoldenrod.css b/src/colors/20/darkgoldenrod.css index 8384855..96fd52f 100644 --- a/src/colors/20/darkgoldenrod.css +++ b/src/colors/20/darkgoldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgoldenrod'] { --sf-c-darkgoldenrod: 43 89% 38%; --sf-c-darkgoldenrod-0: 43 89% 0%; --sf-c-darkgoldenrod-5: 43 89% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkgoldenrod\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkgoldenrod\:95\:dark, html.var.auto .sf-c-darkgoldenrod\:95\:dark { color: hsl(43, 89%, 95%); background: hsl(43, 89%, 5%) } html.var[data-theme='auto'] .sf-c-darkgoldenrod\:100\:dark, html.var.auto .sf-c-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 95%); background: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod, html.auto .sf-c-txt-darkgoldenrod { color: hsl(43, 89%, 38%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0, html.auto .sf-c-txt-darkgoldenrod\:0 { color: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:5, html.auto .sf-c-txt-darkgoldenrod\:5 { color: hsl(43, 89%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10, html.auto .sf-c-txt-darkgoldenrod\:10 { color: hsl(43, 89%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:15, html.auto .sf-c-txt-darkgoldenrod\:15 { color: hsl(43, 89%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20, html.auto .sf-c-txt-darkgoldenrod\:20 { color: hsl(43, 89%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:25, html.auto .sf-c-txt-darkgoldenrod\:25 { color: hsl(43, 89%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30, html.auto .sf-c-txt-darkgoldenrod\:30 { color: hsl(43, 89%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:35, html.auto .sf-c-txt-darkgoldenrod\:35 { color: hsl(43, 89%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40, html.auto .sf-c-txt-darkgoldenrod\:40 { color: hsl(43, 89%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:45, html.auto .sf-c-txt-darkgoldenrod\:45 { color: hsl(43, 89%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50, html.auto .sf-c-txt-darkgoldenrod\:50 { color: hsl(43, 89%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:55, html.auto .sf-c-txt-darkgoldenrod\:55 { color: hsl(43, 89%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60, html.auto .sf-c-txt-darkgoldenrod\:60 { color: hsl(43, 89%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:65, html.auto .sf-c-txt-darkgoldenrod\:65 { color: hsl(43, 89%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70, html.auto .sf-c-txt-darkgoldenrod\:70 { color: hsl(43, 89%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:75, html.auto .sf-c-txt-darkgoldenrod\:75 { color: hsl(43, 89%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80, html.auto .sf-c-txt-darkgoldenrod\:80 { color: hsl(43, 89%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:85, html.auto .sf-c-txt-darkgoldenrod\:85 { color: hsl(43, 89%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90, html.auto .sf-c-txt-darkgoldenrod\:90 { color: hsl(43, 89%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:95, html.auto .sf-c-txt-darkgoldenrod\:95 { color: hsl(43, 89%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100, html.auto .sf-c-txt-darkgoldenrod\:100 { color: hsl(43, 89%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod, html.var.auto .sf-c-txt-darkgoldenrod { color: hsl(43, 89%, 38%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0, html.var.auto .sf-c-txt-darkgoldenrod\:0 { color: hsl(43, 89%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:5, html.var.auto .sf-c-txt-darkgoldenrod\:5 { color: hsl(43, 89%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10, html.var.auto .sf-c-txt-darkgoldenrod\:10 { color: hsl(43, 89%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:15, html.var.auto .sf-c-txt-darkgoldenrod\:15 { color: hsl(43, 89%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20, html.var.auto .sf-c-txt-darkgoldenrod\:20 { color: hsl(43, 89%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:25, html.var.auto .sf-c-txt-darkgoldenrod\:25 { color: hsl(43, 89%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30, html.var.auto .sf-c-txt-darkgoldenrod\:30 { color: hsl(43, 89%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:35, html.var.auto .sf-c-txt-darkgoldenrod\:35 { color: hsl(43, 89%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40, html.var.auto .sf-c-txt-darkgoldenrod\:40 { color: hsl(43, 89%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:45, html.var.auto .sf-c-txt-darkgoldenrod\:45 { color: hsl(43, 89%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50, html.var.auto .sf-c-txt-darkgoldenrod\:50 { color: hsl(43, 89%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:55, html.var.auto .sf-c-txt-darkgoldenrod\:55 { color: hsl(43, 89%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60, html.var.auto .sf-c-txt-darkgoldenrod\:60 { color: hsl(43, 89%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:65, html.var.auto .sf-c-txt-darkgoldenrod\:65 { color: hsl(43, 89%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70, html.var.auto .sf-c-txt-darkgoldenrod\:70 { color: hsl(43, 89%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:75, html.var.auto .sf-c-txt-darkgoldenrod\:75 { color: hsl(43, 89%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80, html.var.auto .sf-c-txt-darkgoldenrod\:80 { color: hsl(43, 89%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:85, html.var.auto .sf-c-txt-darkgoldenrod\:85 { color: hsl(43, 89%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90, html.var.auto .sf-c-txt-darkgoldenrod\:90 { color: hsl(43, 89%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:95, html.var.auto .sf-c-txt-darkgoldenrod\:95 { color: hsl(43, 89%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100, html.var.auto .sf-c-txt-darkgoldenrod\:100 { color: hsl(43, 89%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:dark, html.auto .sf-c-txt-darkgoldenrod\:dark { color: hsl(43, 89%, 38%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0\:dark, html.auto .sf-c-txt-darkgoldenrod\:0\:dark { color: hsl(43, 89%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:5\:dark, html.auto .sf-c-txt-darkgoldenrod\:5\:dark { color: hsl(43, 89%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10\:dark, html.auto .sf-c-txt-darkgoldenrod\:10\:dark { color: hsl(43, 89%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:15\:dark, html.auto .sf-c-txt-darkgoldenrod\:15\:dark { color: hsl(43, 89%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20\:dark, html.auto .sf-c-txt-darkgoldenrod\:20\:dark { color: hsl(43, 89%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:25\:dark, html.auto .sf-c-txt-darkgoldenrod\:25\:dark { color: hsl(43, 89%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30\:dark, html.auto .sf-c-txt-darkgoldenrod\:30\:dark { color: hsl(43, 89%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:35\:dark, html.auto .sf-c-txt-darkgoldenrod\:35\:dark { color: hsl(43, 89%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40\:dark, html.auto .sf-c-txt-darkgoldenrod\:40\:dark { color: hsl(43, 89%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:45\:dark, html.auto .sf-c-txt-darkgoldenrod\:45\:dark { color: hsl(43, 89%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50\:dark, html.auto .sf-c-txt-darkgoldenrod\:50\:dark { color: hsl(43, 89%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:55\:dark, html.auto .sf-c-txt-darkgoldenrod\:55\:dark { color: hsl(43, 89%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60\:dark, html.auto .sf-c-txt-darkgoldenrod\:60\:dark { color: hsl(43, 89%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:65\:dark, html.auto .sf-c-txt-darkgoldenrod\:65\:dark { color: hsl(43, 89%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70\:dark, html.auto .sf-c-txt-darkgoldenrod\:70\:dark { color: hsl(43, 89%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:75\:dark, html.auto .sf-c-txt-darkgoldenrod\:75\:dark { color: hsl(43, 89%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80\:dark, html.auto .sf-c-txt-darkgoldenrod\:80\:dark { color: hsl(43, 89%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:85\:dark, html.auto .sf-c-txt-darkgoldenrod\:85\:dark { color: hsl(43, 89%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90\:dark, html.auto .sf-c-txt-darkgoldenrod\:90\:dark { color: hsl(43, 89%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:95\:dark, html.auto .sf-c-txt-darkgoldenrod\:95\:dark { color: hsl(43, 89%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100\:dark, html.auto .sf-c-txt-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:dark { color: hsl(43, 89%, 38%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:0\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:0\:dark { color: hsl(43, 89%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:5\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:5\:dark { color: hsl(43, 89%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:10\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:10\:dark { color: hsl(43, 89%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:15\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:15\:dark { color: hsl(43, 89%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:20\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:20\:dark { color: hsl(43, 89%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:25\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:25\:dark { color: hsl(43, 89%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:30\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:30\:dark { color: hsl(43, 89%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:35\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:35\:dark { color: hsl(43, 89%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:40\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:40\:dark { color: hsl(43, 89%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:45\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:45\:dark { color: hsl(43, 89%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:50\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:50\:dark { color: hsl(43, 89%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:55\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:55\:dark { color: hsl(43, 89%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:60\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:60\:dark { color: hsl(43, 89%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:65\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:65\:dark { color: hsl(43, 89%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:70\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:70\:dark { color: hsl(43, 89%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:75\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:75\:dark { color: hsl(43, 89%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:80\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:80\:dark { color: hsl(43, 89%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:85\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:85\:dark { color: hsl(43, 89%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:90\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:90\:dark { color: hsl(43, 89%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:95\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:95\:dark { color: hsl(43, 89%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgoldenrod\:100\:dark, html.var.auto .sf-c-txt-darkgoldenrod\:100\:dark { color: hsl(43, 89%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkgray.css b/src/colors/20/darkgray.css index 63a46d9..9c0c368 100644 --- a/src/colors/20/darkgray.css +++ b/src/colors/20/darkgray.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgray'] { --sf-c-darkgray: 0 0% 66%; --sf-c-darkgray-0: 0 0% 0%; --sf-c-darkgray-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkgray\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkgray\:95\:dark, html.var.auto .sf-c-darkgray\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-darkgray\:100\:dark, html.var.auto .sf-c-darkgray\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray, html.auto .sf-c-txt-darkgray { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:0, html.auto .sf-c-txt-darkgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:5, html.auto .sf-c-txt-darkgray\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:10, html.auto .sf-c-txt-darkgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:15, html.auto .sf-c-txt-darkgray\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:20, html.auto .sf-c-txt-darkgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:25, html.auto .sf-c-txt-darkgray\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:30, html.auto .sf-c-txt-darkgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:35, html.auto .sf-c-txt-darkgray\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:40, html.auto .sf-c-txt-darkgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:45, html.auto .sf-c-txt-darkgray\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:50, html.auto .sf-c-txt-darkgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:55, html.auto .sf-c-txt-darkgray\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:60, html.auto .sf-c-txt-darkgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:65, html.auto .sf-c-txt-darkgray\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:70, html.auto .sf-c-txt-darkgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:75, html.auto .sf-c-txt-darkgray\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:80, html.auto .sf-c-txt-darkgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:85, html.auto .sf-c-txt-darkgray\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:90, html.auto .sf-c-txt-darkgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:95, html.auto .sf-c-txt-darkgray\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:100, html.auto .sf-c-txt-darkgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray, html.var.auto .sf-c-txt-darkgray { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:0, html.var.auto .sf-c-txt-darkgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:5, html.var.auto .sf-c-txt-darkgray\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:10, html.var.auto .sf-c-txt-darkgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:15, html.var.auto .sf-c-txt-darkgray\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:20, html.var.auto .sf-c-txt-darkgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:25, html.var.auto .sf-c-txt-darkgray\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:30, html.var.auto .sf-c-txt-darkgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:35, html.var.auto .sf-c-txt-darkgray\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:40, html.var.auto .sf-c-txt-darkgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:45, html.var.auto .sf-c-txt-darkgray\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:50, html.var.auto .sf-c-txt-darkgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:55, html.var.auto .sf-c-txt-darkgray\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:60, html.var.auto .sf-c-txt-darkgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:65, html.var.auto .sf-c-txt-darkgray\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:70, html.var.auto .sf-c-txt-darkgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:75, html.var.auto .sf-c-txt-darkgray\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:80, html.var.auto .sf-c-txt-darkgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:85, html.var.auto .sf-c-txt-darkgray\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:90, html.var.auto .sf-c-txt-darkgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:95, html.var.auto .sf-c-txt-darkgray\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:100, html.var.auto .sf-c-txt-darkgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:dark, html.auto .sf-c-txt-darkgray\:dark { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:0\:dark, html.auto .sf-c-txt-darkgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:5\:dark, html.auto .sf-c-txt-darkgray\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:10\:dark, html.auto .sf-c-txt-darkgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:15\:dark, html.auto .sf-c-txt-darkgray\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:20\:dark, html.auto .sf-c-txt-darkgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:25\:dark, html.auto .sf-c-txt-darkgray\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:30\:dark, html.auto .sf-c-txt-darkgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:35\:dark, html.auto .sf-c-txt-darkgray\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:40\:dark, html.auto .sf-c-txt-darkgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:45\:dark, html.auto .sf-c-txt-darkgray\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:50\:dark, html.auto .sf-c-txt-darkgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:55\:dark, html.auto .sf-c-txt-darkgray\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:60\:dark, html.auto .sf-c-txt-darkgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:65\:dark, html.auto .sf-c-txt-darkgray\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:70\:dark, html.auto .sf-c-txt-darkgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:75\:dark, html.auto .sf-c-txt-darkgray\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:80\:dark, html.auto .sf-c-txt-darkgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:85\:dark, html.auto .sf-c-txt-darkgray\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:90\:dark, html.auto .sf-c-txt-darkgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:95\:dark, html.auto .sf-c-txt-darkgray\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgray\:100\:dark, html.auto .sf-c-txt-darkgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:dark, html.var.auto .sf-c-txt-darkgray\:dark { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:0\:dark, html.var.auto .sf-c-txt-darkgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:5\:dark, html.var.auto .sf-c-txt-darkgray\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:10\:dark, html.var.auto .sf-c-txt-darkgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:15\:dark, html.var.auto .sf-c-txt-darkgray\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:20\:dark, html.var.auto .sf-c-txt-darkgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:25\:dark, html.var.auto .sf-c-txt-darkgray\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:30\:dark, html.var.auto .sf-c-txt-darkgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:35\:dark, html.var.auto .sf-c-txt-darkgray\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:40\:dark, html.var.auto .sf-c-txt-darkgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:45\:dark, html.var.auto .sf-c-txt-darkgray\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:50\:dark, html.var.auto .sf-c-txt-darkgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:55\:dark, html.var.auto .sf-c-txt-darkgray\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:60\:dark, html.var.auto .sf-c-txt-darkgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:65\:dark, html.var.auto .sf-c-txt-darkgray\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:70\:dark, html.var.auto .sf-c-txt-darkgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:75\:dark, html.var.auto .sf-c-txt-darkgray\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:80\:dark, html.var.auto .sf-c-txt-darkgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:85\:dark, html.var.auto .sf-c-txt-darkgray\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:90\:dark, html.var.auto .sf-c-txt-darkgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:95\:dark, html.var.auto .sf-c-txt-darkgray\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgray\:100\:dark, html.var.auto .sf-c-txt-darkgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkgreen.css b/src/colors/20/darkgreen.css index 8738b41..1e26815 100644 --- a/src/colors/20/darkgreen.css +++ b/src/colors/20/darkgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgreen'] { --sf-c-darkgreen: 120 100% 20%; --sf-c-darkgreen-0: 120 100% 0%; --sf-c-darkgreen-5: 120 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkgreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-darkgreen\:95\:dark, html.var.auto .sf-c-darkgreen\:95\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkgreen\:100\:dark, html.var.auto .sf-c-darkgreen\:100\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen, html.auto .sf-c-txt-darkgreen { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0, html.auto .sf-c-txt-darkgreen\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:5, html.auto .sf-c-txt-darkgreen\:5 { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10, html.auto .sf-c-txt-darkgreen\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:15, html.auto .sf-c-txt-darkgreen\:15 { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20, html.auto .sf-c-txt-darkgreen\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:25, html.auto .sf-c-txt-darkgreen\:25 { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30, html.auto .sf-c-txt-darkgreen\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:35, html.auto .sf-c-txt-darkgreen\:35 { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40, html.auto .sf-c-txt-darkgreen\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:45, html.auto .sf-c-txt-darkgreen\:45 { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50, html.auto .sf-c-txt-darkgreen\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:55, html.auto .sf-c-txt-darkgreen\:55 { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60, html.auto .sf-c-txt-darkgreen\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:65, html.auto .sf-c-txt-darkgreen\:65 { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70, html.auto .sf-c-txt-darkgreen\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:75, html.auto .sf-c-txt-darkgreen\:75 { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80, html.auto .sf-c-txt-darkgreen\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:85, html.auto .sf-c-txt-darkgreen\:85 { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90, html.auto .sf-c-txt-darkgreen\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:95, html.auto .sf-c-txt-darkgreen\:95 { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100, html.auto .sf-c-txt-darkgreen\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen, html.var.auto .sf-c-txt-darkgreen { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0, html.var.auto .sf-c-txt-darkgreen\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:5, html.var.auto .sf-c-txt-darkgreen\:5 { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10, html.var.auto .sf-c-txt-darkgreen\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:15, html.var.auto .sf-c-txt-darkgreen\:15 { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20, html.var.auto .sf-c-txt-darkgreen\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:25, html.var.auto .sf-c-txt-darkgreen\:25 { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30, html.var.auto .sf-c-txt-darkgreen\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:35, html.var.auto .sf-c-txt-darkgreen\:35 { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40, html.var.auto .sf-c-txt-darkgreen\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:45, html.var.auto .sf-c-txt-darkgreen\:45 { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50, html.var.auto .sf-c-txt-darkgreen\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:55, html.var.auto .sf-c-txt-darkgreen\:55 { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60, html.var.auto .sf-c-txt-darkgreen\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:65, html.var.auto .sf-c-txt-darkgreen\:65 { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70, html.var.auto .sf-c-txt-darkgreen\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:75, html.var.auto .sf-c-txt-darkgreen\:75 { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80, html.var.auto .sf-c-txt-darkgreen\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:85, html.var.auto .sf-c-txt-darkgreen\:85 { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90, html.var.auto .sf-c-txt-darkgreen\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:95, html.var.auto .sf-c-txt-darkgreen\:95 { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100, html.var.auto .sf-c-txt-darkgreen\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:dark, html.auto .sf-c-txt-darkgreen\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0\:dark, html.auto .sf-c-txt-darkgreen\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:5\:dark, html.auto .sf-c-txt-darkgreen\:5\:dark { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10\:dark, html.auto .sf-c-txt-darkgreen\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:15\:dark, html.auto .sf-c-txt-darkgreen\:15\:dark { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20\:dark, html.auto .sf-c-txt-darkgreen\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:25\:dark, html.auto .sf-c-txt-darkgreen\:25\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30\:dark, html.auto .sf-c-txt-darkgreen\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:35\:dark, html.auto .sf-c-txt-darkgreen\:35\:dark { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40\:dark, html.auto .sf-c-txt-darkgreen\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:45\:dark, html.auto .sf-c-txt-darkgreen\:45\:dark { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50\:dark, html.auto .sf-c-txt-darkgreen\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:55\:dark, html.auto .sf-c-txt-darkgreen\:55\:dark { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60\:dark, html.auto .sf-c-txt-darkgreen\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:65\:dark, html.auto .sf-c-txt-darkgreen\:65\:dark { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70\:dark, html.auto .sf-c-txt-darkgreen\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:75\:dark, html.auto .sf-c-txt-darkgreen\:75\:dark { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80\:dark, html.auto .sf-c-txt-darkgreen\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:85\:dark, html.auto .sf-c-txt-darkgreen\:85\:dark { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90\:dark, html.auto .sf-c-txt-darkgreen\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:95\:dark, html.auto .sf-c-txt-darkgreen\:95\:dark { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100\:dark, html.auto .sf-c-txt-darkgreen\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:dark, html.var.auto .sf-c-txt-darkgreen\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:0\:dark, html.var.auto .sf-c-txt-darkgreen\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:5\:dark, html.var.auto .sf-c-txt-darkgreen\:5\:dark { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:10\:dark, html.var.auto .sf-c-txt-darkgreen\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:15\:dark, html.var.auto .sf-c-txt-darkgreen\:15\:dark { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:20\:dark, html.var.auto .sf-c-txt-darkgreen\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:25\:dark, html.var.auto .sf-c-txt-darkgreen\:25\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:30\:dark, html.var.auto .sf-c-txt-darkgreen\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:35\:dark, html.var.auto .sf-c-txt-darkgreen\:35\:dark { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:40\:dark, html.var.auto .sf-c-txt-darkgreen\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:45\:dark, html.var.auto .sf-c-txt-darkgreen\:45\:dark { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:50\:dark, html.var.auto .sf-c-txt-darkgreen\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:55\:dark, html.var.auto .sf-c-txt-darkgreen\:55\:dark { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:60\:dark, html.var.auto .sf-c-txt-darkgreen\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:65\:dark, html.var.auto .sf-c-txt-darkgreen\:65\:dark { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:70\:dark, html.var.auto .sf-c-txt-darkgreen\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:75\:dark, html.var.auto .sf-c-txt-darkgreen\:75\:dark { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:80\:dark, html.var.auto .sf-c-txt-darkgreen\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:85\:dark, html.var.auto .sf-c-txt-darkgreen\:85\:dark { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:90\:dark, html.var.auto .sf-c-txt-darkgreen\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:95\:dark, html.var.auto .sf-c-txt-darkgreen\:95\:dark { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgreen\:100\:dark, html.var.auto .sf-c-txt-darkgreen\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkgrey.css b/src/colors/20/darkgrey.css index 289b75a..b7c0605 100644 --- a/src/colors/20/darkgrey.css +++ b/src/colors/20/darkgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='darkgrey'] { --sf-c-darkgrey: 0 0% 66%; --sf-c-darkgrey-0: 0 0% 0%; --sf-c-darkgrey-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkgrey\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-darkgrey\:95\:dark, html.var.auto .sf-c-darkgrey\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-darkgrey\:100\:dark, html.var.auto .sf-c-darkgrey\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey, html.auto .sf-c-txt-darkgrey { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0, html.auto .sf-c-txt-darkgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:5, html.auto .sf-c-txt-darkgrey\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10, html.auto .sf-c-txt-darkgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:15, html.auto .sf-c-txt-darkgrey\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20, html.auto .sf-c-txt-darkgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:25, html.auto .sf-c-txt-darkgrey\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30, html.auto .sf-c-txt-darkgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:35, html.auto .sf-c-txt-darkgrey\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40, html.auto .sf-c-txt-darkgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:45, html.auto .sf-c-txt-darkgrey\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50, html.auto .sf-c-txt-darkgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:55, html.auto .sf-c-txt-darkgrey\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60, html.auto .sf-c-txt-darkgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:65, html.auto .sf-c-txt-darkgrey\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70, html.auto .sf-c-txt-darkgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:75, html.auto .sf-c-txt-darkgrey\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80, html.auto .sf-c-txt-darkgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:85, html.auto .sf-c-txt-darkgrey\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90, html.auto .sf-c-txt-darkgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:95, html.auto .sf-c-txt-darkgrey\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100, html.auto .sf-c-txt-darkgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey, html.var.auto .sf-c-txt-darkgrey { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0, html.var.auto .sf-c-txt-darkgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:5, html.var.auto .sf-c-txt-darkgrey\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10, html.var.auto .sf-c-txt-darkgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:15, html.var.auto .sf-c-txt-darkgrey\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20, html.var.auto .sf-c-txt-darkgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:25, html.var.auto .sf-c-txt-darkgrey\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30, html.var.auto .sf-c-txt-darkgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:35, html.var.auto .sf-c-txt-darkgrey\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40, html.var.auto .sf-c-txt-darkgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:45, html.var.auto .sf-c-txt-darkgrey\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50, html.var.auto .sf-c-txt-darkgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:55, html.var.auto .sf-c-txt-darkgrey\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60, html.var.auto .sf-c-txt-darkgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:65, html.var.auto .sf-c-txt-darkgrey\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70, html.var.auto .sf-c-txt-darkgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:75, html.var.auto .sf-c-txt-darkgrey\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80, html.var.auto .sf-c-txt-darkgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:85, html.var.auto .sf-c-txt-darkgrey\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90, html.var.auto .sf-c-txt-darkgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:95, html.var.auto .sf-c-txt-darkgrey\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100, html.var.auto .sf-c-txt-darkgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:dark, html.auto .sf-c-txt-darkgrey\:dark { color: hsl(0, 0%, 66%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0\:dark, html.auto .sf-c-txt-darkgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:5\:dark, html.auto .sf-c-txt-darkgrey\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10\:dark, html.auto .sf-c-txt-darkgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:15\:dark, html.auto .sf-c-txt-darkgrey\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20\:dark, html.auto .sf-c-txt-darkgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:25\:dark, html.auto .sf-c-txt-darkgrey\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30\:dark, html.auto .sf-c-txt-darkgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:35\:dark, html.auto .sf-c-txt-darkgrey\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40\:dark, html.auto .sf-c-txt-darkgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:45\:dark, html.auto .sf-c-txt-darkgrey\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50\:dark, html.auto .sf-c-txt-darkgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:55\:dark, html.auto .sf-c-txt-darkgrey\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60\:dark, html.auto .sf-c-txt-darkgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:65\:dark, html.auto .sf-c-txt-darkgrey\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70\:dark, html.auto .sf-c-txt-darkgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:75\:dark, html.auto .sf-c-txt-darkgrey\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80\:dark, html.auto .sf-c-txt-darkgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:85\:dark, html.auto .sf-c-txt-darkgrey\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90\:dark, html.auto .sf-c-txt-darkgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:95\:dark, html.auto .sf-c-txt-darkgrey\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100\:dark, html.auto .sf-c-txt-darkgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:dark, html.var.auto .sf-c-txt-darkgrey\:dark { color: hsl(0, 0%, 66%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:0\:dark, html.var.auto .sf-c-txt-darkgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:5\:dark, html.var.auto .sf-c-txt-darkgrey\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:10\:dark, html.var.auto .sf-c-txt-darkgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:15\:dark, html.var.auto .sf-c-txt-darkgrey\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:20\:dark, html.var.auto .sf-c-txt-darkgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:25\:dark, html.var.auto .sf-c-txt-darkgrey\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:30\:dark, html.var.auto .sf-c-txt-darkgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:35\:dark, html.var.auto .sf-c-txt-darkgrey\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:40\:dark, html.var.auto .sf-c-txt-darkgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:45\:dark, html.var.auto .sf-c-txt-darkgrey\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:50\:dark, html.var.auto .sf-c-txt-darkgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:55\:dark, html.var.auto .sf-c-txt-darkgrey\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:60\:dark, html.var.auto .sf-c-txt-darkgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:65\:dark, html.var.auto .sf-c-txt-darkgrey\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:70\:dark, html.var.auto .sf-c-txt-darkgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:75\:dark, html.var.auto .sf-c-txt-darkgrey\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:80\:dark, html.var.auto .sf-c-txt-darkgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:85\:dark, html.var.auto .sf-c-txt-darkgrey\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:90\:dark, html.var.auto .sf-c-txt-darkgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:95\:dark, html.var.auto .sf-c-txt-darkgrey\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkgrey\:100\:dark, html.var.auto .sf-c-txt-darkgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkkhaki.css b/src/colors/20/darkkhaki.css index 8c6b76b..225a9c9 100644 --- a/src/colors/20/darkkhaki.css +++ b/src/colors/20/darkkhaki.css @@ -1,4 +1,4 @@ -:root { +[class*='darkkhaki'] { --sf-c-darkkhaki: 56 38% 58%; --sf-c-darkkhaki-0: 56 38% 0%; --sf-c-darkkhaki-5: 56 38% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkkhaki\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-darkkhaki\:95\:dark, html.var.auto .sf-c-darkkhaki\:95\:dark { color: hsl(56, 38%, 95%); background: hsl(56, 38%, 5%) } html.var[data-theme='auto'] .sf-c-darkkhaki\:100\:dark, html.var.auto .sf-c-darkkhaki\:100\:dark { color: hsl(56, 38%, 95%); background: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki, html.auto .sf-c-txt-darkkhaki { color: hsl(56, 38%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0, html.auto .sf-c-txt-darkkhaki\:0 { color: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:5, html.auto .sf-c-txt-darkkhaki\:5 { color: hsl(56, 38%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10, html.auto .sf-c-txt-darkkhaki\:10 { color: hsl(56, 38%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:15, html.auto .sf-c-txt-darkkhaki\:15 { color: hsl(56, 38%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20, html.auto .sf-c-txt-darkkhaki\:20 { color: hsl(56, 38%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:25, html.auto .sf-c-txt-darkkhaki\:25 { color: hsl(56, 38%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30, html.auto .sf-c-txt-darkkhaki\:30 { color: hsl(56, 38%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:35, html.auto .sf-c-txt-darkkhaki\:35 { color: hsl(56, 38%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40, html.auto .sf-c-txt-darkkhaki\:40 { color: hsl(56, 38%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:45, html.auto .sf-c-txt-darkkhaki\:45 { color: hsl(56, 38%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50, html.auto .sf-c-txt-darkkhaki\:50 { color: hsl(56, 38%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:55, html.auto .sf-c-txt-darkkhaki\:55 { color: hsl(56, 38%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60, html.auto .sf-c-txt-darkkhaki\:60 { color: hsl(56, 38%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:65, html.auto .sf-c-txt-darkkhaki\:65 { color: hsl(56, 38%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70, html.auto .sf-c-txt-darkkhaki\:70 { color: hsl(56, 38%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:75, html.auto .sf-c-txt-darkkhaki\:75 { color: hsl(56, 38%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80, html.auto .sf-c-txt-darkkhaki\:80 { color: hsl(56, 38%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:85, html.auto .sf-c-txt-darkkhaki\:85 { color: hsl(56, 38%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90, html.auto .sf-c-txt-darkkhaki\:90 { color: hsl(56, 38%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:95, html.auto .sf-c-txt-darkkhaki\:95 { color: hsl(56, 38%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100, html.auto .sf-c-txt-darkkhaki\:100 { color: hsl(56, 38%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki, html.var.auto .sf-c-txt-darkkhaki { color: hsl(56, 38%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0, html.var.auto .sf-c-txt-darkkhaki\:0 { color: hsl(56, 38%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:5, html.var.auto .sf-c-txt-darkkhaki\:5 { color: hsl(56, 38%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10, html.var.auto .sf-c-txt-darkkhaki\:10 { color: hsl(56, 38%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:15, html.var.auto .sf-c-txt-darkkhaki\:15 { color: hsl(56, 38%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20, html.var.auto .sf-c-txt-darkkhaki\:20 { color: hsl(56, 38%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:25, html.var.auto .sf-c-txt-darkkhaki\:25 { color: hsl(56, 38%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30, html.var.auto .sf-c-txt-darkkhaki\:30 { color: hsl(56, 38%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:35, html.var.auto .sf-c-txt-darkkhaki\:35 { color: hsl(56, 38%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40, html.var.auto .sf-c-txt-darkkhaki\:40 { color: hsl(56, 38%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:45, html.var.auto .sf-c-txt-darkkhaki\:45 { color: hsl(56, 38%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50, html.var.auto .sf-c-txt-darkkhaki\:50 { color: hsl(56, 38%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:55, html.var.auto .sf-c-txt-darkkhaki\:55 { color: hsl(56, 38%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60, html.var.auto .sf-c-txt-darkkhaki\:60 { color: hsl(56, 38%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:65, html.var.auto .sf-c-txt-darkkhaki\:65 { color: hsl(56, 38%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70, html.var.auto .sf-c-txt-darkkhaki\:70 { color: hsl(56, 38%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:75, html.var.auto .sf-c-txt-darkkhaki\:75 { color: hsl(56, 38%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80, html.var.auto .sf-c-txt-darkkhaki\:80 { color: hsl(56, 38%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:85, html.var.auto .sf-c-txt-darkkhaki\:85 { color: hsl(56, 38%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90, html.var.auto .sf-c-txt-darkkhaki\:90 { color: hsl(56, 38%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:95, html.var.auto .sf-c-txt-darkkhaki\:95 { color: hsl(56, 38%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100, html.var.auto .sf-c-txt-darkkhaki\:100 { color: hsl(56, 38%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:dark, html.auto .sf-c-txt-darkkhaki\:dark { color: hsl(56, 38%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0\:dark, html.auto .sf-c-txt-darkkhaki\:0\:dark { color: hsl(56, 38%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:5\:dark, html.auto .sf-c-txt-darkkhaki\:5\:dark { color: hsl(56, 38%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10\:dark, html.auto .sf-c-txt-darkkhaki\:10\:dark { color: hsl(56, 38%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:15\:dark, html.auto .sf-c-txt-darkkhaki\:15\:dark { color: hsl(56, 38%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20\:dark, html.auto .sf-c-txt-darkkhaki\:20\:dark { color: hsl(56, 38%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:25\:dark, html.auto .sf-c-txt-darkkhaki\:25\:dark { color: hsl(56, 38%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30\:dark, html.auto .sf-c-txt-darkkhaki\:30\:dark { color: hsl(56, 38%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:35\:dark, html.auto .sf-c-txt-darkkhaki\:35\:dark { color: hsl(56, 38%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40\:dark, html.auto .sf-c-txt-darkkhaki\:40\:dark { color: hsl(56, 38%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:45\:dark, html.auto .sf-c-txt-darkkhaki\:45\:dark { color: hsl(56, 38%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50\:dark, html.auto .sf-c-txt-darkkhaki\:50\:dark { color: hsl(56, 38%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:55\:dark, html.auto .sf-c-txt-darkkhaki\:55\:dark { color: hsl(56, 38%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60\:dark, html.auto .sf-c-txt-darkkhaki\:60\:dark { color: hsl(56, 38%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:65\:dark, html.auto .sf-c-txt-darkkhaki\:65\:dark { color: hsl(56, 38%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70\:dark, html.auto .sf-c-txt-darkkhaki\:70\:dark { color: hsl(56, 38%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:75\:dark, html.auto .sf-c-txt-darkkhaki\:75\:dark { color: hsl(56, 38%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80\:dark, html.auto .sf-c-txt-darkkhaki\:80\:dark { color: hsl(56, 38%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:85\:dark, html.auto .sf-c-txt-darkkhaki\:85\:dark { color: hsl(56, 38%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90\:dark, html.auto .sf-c-txt-darkkhaki\:90\:dark { color: hsl(56, 38%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:95\:dark, html.auto .sf-c-txt-darkkhaki\:95\:dark { color: hsl(56, 38%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100\:dark, html.auto .sf-c-txt-darkkhaki\:100\:dark { color: hsl(56, 38%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:dark, html.var.auto .sf-c-txt-darkkhaki\:dark { color: hsl(56, 38%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:0\:dark, html.var.auto .sf-c-txt-darkkhaki\:0\:dark { color: hsl(56, 38%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:5\:dark, html.var.auto .sf-c-txt-darkkhaki\:5\:dark { color: hsl(56, 38%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:10\:dark, html.var.auto .sf-c-txt-darkkhaki\:10\:dark { color: hsl(56, 38%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:15\:dark, html.var.auto .sf-c-txt-darkkhaki\:15\:dark { color: hsl(56, 38%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:20\:dark, html.var.auto .sf-c-txt-darkkhaki\:20\:dark { color: hsl(56, 38%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:25\:dark, html.var.auto .sf-c-txt-darkkhaki\:25\:dark { color: hsl(56, 38%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:30\:dark, html.var.auto .sf-c-txt-darkkhaki\:30\:dark { color: hsl(56, 38%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:35\:dark, html.var.auto .sf-c-txt-darkkhaki\:35\:dark { color: hsl(56, 38%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:40\:dark, html.var.auto .sf-c-txt-darkkhaki\:40\:dark { color: hsl(56, 38%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:45\:dark, html.var.auto .sf-c-txt-darkkhaki\:45\:dark { color: hsl(56, 38%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:50\:dark, html.var.auto .sf-c-txt-darkkhaki\:50\:dark { color: hsl(56, 38%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:55\:dark, html.var.auto .sf-c-txt-darkkhaki\:55\:dark { color: hsl(56, 38%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:60\:dark, html.var.auto .sf-c-txt-darkkhaki\:60\:dark { color: hsl(56, 38%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:65\:dark, html.var.auto .sf-c-txt-darkkhaki\:65\:dark { color: hsl(56, 38%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:70\:dark, html.var.auto .sf-c-txt-darkkhaki\:70\:dark { color: hsl(56, 38%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:75\:dark, html.var.auto .sf-c-txt-darkkhaki\:75\:dark { color: hsl(56, 38%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:80\:dark, html.var.auto .sf-c-txt-darkkhaki\:80\:dark { color: hsl(56, 38%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:85\:dark, html.var.auto .sf-c-txt-darkkhaki\:85\:dark { color: hsl(56, 38%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:90\:dark, html.var.auto .sf-c-txt-darkkhaki\:90\:dark { color: hsl(56, 38%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:95\:dark, html.var.auto .sf-c-txt-darkkhaki\:95\:dark { color: hsl(56, 38%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkkhaki\:100\:dark, html.var.auto .sf-c-txt-darkkhaki\:100\:dark { color: hsl(56, 38%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkmagenta.css b/src/colors/20/darkmagenta.css index 43ffde3..cd14013 100644 --- a/src/colors/20/darkmagenta.css +++ b/src/colors/20/darkmagenta.css @@ -1,4 +1,4 @@ -:root { +[class*='darkmagenta'] { --sf-c-darkmagenta: 300 100% 27%; --sf-c-darkmagenta-0: 300 100% 0%; --sf-c-darkmagenta-5: 300 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkmagenta\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-darkmagenta\:95\:dark, html.var.auto .sf-c-darkmagenta\:95\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkmagenta\:100\:dark, html.var.auto .sf-c-darkmagenta\:100\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta, html.auto .sf-c-txt-darkmagenta { color: hsl(300, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0, html.auto .sf-c-txt-darkmagenta\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:5, html.auto .sf-c-txt-darkmagenta\:5 { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10, html.auto .sf-c-txt-darkmagenta\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:15, html.auto .sf-c-txt-darkmagenta\:15 { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20, html.auto .sf-c-txt-darkmagenta\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:25, html.auto .sf-c-txt-darkmagenta\:25 { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30, html.auto .sf-c-txt-darkmagenta\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:35, html.auto .sf-c-txt-darkmagenta\:35 { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40, html.auto .sf-c-txt-darkmagenta\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:45, html.auto .sf-c-txt-darkmagenta\:45 { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50, html.auto .sf-c-txt-darkmagenta\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:55, html.auto .sf-c-txt-darkmagenta\:55 { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60, html.auto .sf-c-txt-darkmagenta\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:65, html.auto .sf-c-txt-darkmagenta\:65 { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70, html.auto .sf-c-txt-darkmagenta\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:75, html.auto .sf-c-txt-darkmagenta\:75 { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80, html.auto .sf-c-txt-darkmagenta\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:85, html.auto .sf-c-txt-darkmagenta\:85 { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90, html.auto .sf-c-txt-darkmagenta\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:95, html.auto .sf-c-txt-darkmagenta\:95 { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100, html.auto .sf-c-txt-darkmagenta\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta, html.var.auto .sf-c-txt-darkmagenta { color: hsl(300, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0, html.var.auto .sf-c-txt-darkmagenta\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:5, html.var.auto .sf-c-txt-darkmagenta\:5 { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10, html.var.auto .sf-c-txt-darkmagenta\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:15, html.var.auto .sf-c-txt-darkmagenta\:15 { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20, html.var.auto .sf-c-txt-darkmagenta\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:25, html.var.auto .sf-c-txt-darkmagenta\:25 { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30, html.var.auto .sf-c-txt-darkmagenta\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:35, html.var.auto .sf-c-txt-darkmagenta\:35 { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40, html.var.auto .sf-c-txt-darkmagenta\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:45, html.var.auto .sf-c-txt-darkmagenta\:45 { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50, html.var.auto .sf-c-txt-darkmagenta\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:55, html.var.auto .sf-c-txt-darkmagenta\:55 { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60, html.var.auto .sf-c-txt-darkmagenta\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:65, html.var.auto .sf-c-txt-darkmagenta\:65 { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70, html.var.auto .sf-c-txt-darkmagenta\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:75, html.var.auto .sf-c-txt-darkmagenta\:75 { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80, html.var.auto .sf-c-txt-darkmagenta\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:85, html.var.auto .sf-c-txt-darkmagenta\:85 { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90, html.var.auto .sf-c-txt-darkmagenta\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:95, html.var.auto .sf-c-txt-darkmagenta\:95 { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100, html.var.auto .sf-c-txt-darkmagenta\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:dark, html.auto .sf-c-txt-darkmagenta\:dark { color: hsl(300, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0\:dark, html.auto .sf-c-txt-darkmagenta\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:5\:dark, html.auto .sf-c-txt-darkmagenta\:5\:dark { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10\:dark, html.auto .sf-c-txt-darkmagenta\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:15\:dark, html.auto .sf-c-txt-darkmagenta\:15\:dark { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20\:dark, html.auto .sf-c-txt-darkmagenta\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:25\:dark, html.auto .sf-c-txt-darkmagenta\:25\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30\:dark, html.auto .sf-c-txt-darkmagenta\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:35\:dark, html.auto .sf-c-txt-darkmagenta\:35\:dark { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40\:dark, html.auto .sf-c-txt-darkmagenta\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:45\:dark, html.auto .sf-c-txt-darkmagenta\:45\:dark { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50\:dark, html.auto .sf-c-txt-darkmagenta\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:55\:dark, html.auto .sf-c-txt-darkmagenta\:55\:dark { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60\:dark, html.auto .sf-c-txt-darkmagenta\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:65\:dark, html.auto .sf-c-txt-darkmagenta\:65\:dark { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70\:dark, html.auto .sf-c-txt-darkmagenta\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:75\:dark, html.auto .sf-c-txt-darkmagenta\:75\:dark { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80\:dark, html.auto .sf-c-txt-darkmagenta\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:85\:dark, html.auto .sf-c-txt-darkmagenta\:85\:dark { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90\:dark, html.auto .sf-c-txt-darkmagenta\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:95\:dark, html.auto .sf-c-txt-darkmagenta\:95\:dark { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100\:dark, html.auto .sf-c-txt-darkmagenta\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:dark, html.var.auto .sf-c-txt-darkmagenta\:dark { color: hsl(300, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:0\:dark, html.var.auto .sf-c-txt-darkmagenta\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:5\:dark, html.var.auto .sf-c-txt-darkmagenta\:5\:dark { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:10\:dark, html.var.auto .sf-c-txt-darkmagenta\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:15\:dark, html.var.auto .sf-c-txt-darkmagenta\:15\:dark { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:20\:dark, html.var.auto .sf-c-txt-darkmagenta\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:25\:dark, html.var.auto .sf-c-txt-darkmagenta\:25\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:30\:dark, html.var.auto .sf-c-txt-darkmagenta\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:35\:dark, html.var.auto .sf-c-txt-darkmagenta\:35\:dark { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:40\:dark, html.var.auto .sf-c-txt-darkmagenta\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:45\:dark, html.var.auto .sf-c-txt-darkmagenta\:45\:dark { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:50\:dark, html.var.auto .sf-c-txt-darkmagenta\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:55\:dark, html.var.auto .sf-c-txt-darkmagenta\:55\:dark { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:60\:dark, html.var.auto .sf-c-txt-darkmagenta\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:65\:dark, html.var.auto .sf-c-txt-darkmagenta\:65\:dark { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:70\:dark, html.var.auto .sf-c-txt-darkmagenta\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:75\:dark, html.var.auto .sf-c-txt-darkmagenta\:75\:dark { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:80\:dark, html.var.auto .sf-c-txt-darkmagenta\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:85\:dark, html.var.auto .sf-c-txt-darkmagenta\:85\:dark { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:90\:dark, html.var.auto .sf-c-txt-darkmagenta\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:95\:dark, html.var.auto .sf-c-txt-darkmagenta\:95\:dark { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkmagenta\:100\:dark, html.var.auto .sf-c-txt-darkmagenta\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkolivegreen.css b/src/colors/20/darkolivegreen.css index 8a7a04f..fb8d72c 100644 --- a/src/colors/20/darkolivegreen.css +++ b/src/colors/20/darkolivegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkolivegreen'] { --sf-c-darkolivegreen: 82 39% 30%; --sf-c-darkolivegreen-0: 82 39% 0%; --sf-c-darkolivegreen-5: 82 39% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkolivegreen\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-darkolivegreen\:95\:dark, html.var.auto .sf-c-darkolivegreen\:95\:dark { color: hsl(82, 39%, 95%); background: hsl(82, 39%, 5%) } html.var[data-theme='auto'] .sf-c-darkolivegreen\:100\:dark, html.var.auto .sf-c-darkolivegreen\:100\:dark { color: hsl(82, 39%, 95%); background: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen, html.auto .sf-c-txt-darkolivegreen { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0, html.auto .sf-c-txt-darkolivegreen\:0 { color: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:5, html.auto .sf-c-txt-darkolivegreen\:5 { color: hsl(82, 39%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10, html.auto .sf-c-txt-darkolivegreen\:10 { color: hsl(82, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:15, html.auto .sf-c-txt-darkolivegreen\:15 { color: hsl(82, 39%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20, html.auto .sf-c-txt-darkolivegreen\:20 { color: hsl(82, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:25, html.auto .sf-c-txt-darkolivegreen\:25 { color: hsl(82, 39%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30, html.auto .sf-c-txt-darkolivegreen\:30 { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:35, html.auto .sf-c-txt-darkolivegreen\:35 { color: hsl(82, 39%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40, html.auto .sf-c-txt-darkolivegreen\:40 { color: hsl(82, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:45, html.auto .sf-c-txt-darkolivegreen\:45 { color: hsl(82, 39%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50, html.auto .sf-c-txt-darkolivegreen\:50 { color: hsl(82, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:55, html.auto .sf-c-txt-darkolivegreen\:55 { color: hsl(82, 39%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60, html.auto .sf-c-txt-darkolivegreen\:60 { color: hsl(82, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:65, html.auto .sf-c-txt-darkolivegreen\:65 { color: hsl(82, 39%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70, html.auto .sf-c-txt-darkolivegreen\:70 { color: hsl(82, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:75, html.auto .sf-c-txt-darkolivegreen\:75 { color: hsl(82, 39%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80, html.auto .sf-c-txt-darkolivegreen\:80 { color: hsl(82, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:85, html.auto .sf-c-txt-darkolivegreen\:85 { color: hsl(82, 39%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90, html.auto .sf-c-txt-darkolivegreen\:90 { color: hsl(82, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:95, html.auto .sf-c-txt-darkolivegreen\:95 { color: hsl(82, 39%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100, html.auto .sf-c-txt-darkolivegreen\:100 { color: hsl(82, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen, html.var.auto .sf-c-txt-darkolivegreen { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0, html.var.auto .sf-c-txt-darkolivegreen\:0 { color: hsl(82, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:5, html.var.auto .sf-c-txt-darkolivegreen\:5 { color: hsl(82, 39%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10, html.var.auto .sf-c-txt-darkolivegreen\:10 { color: hsl(82, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:15, html.var.auto .sf-c-txt-darkolivegreen\:15 { color: hsl(82, 39%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20, html.var.auto .sf-c-txt-darkolivegreen\:20 { color: hsl(82, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:25, html.var.auto .sf-c-txt-darkolivegreen\:25 { color: hsl(82, 39%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30, html.var.auto .sf-c-txt-darkolivegreen\:30 { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:35, html.var.auto .sf-c-txt-darkolivegreen\:35 { color: hsl(82, 39%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40, html.var.auto .sf-c-txt-darkolivegreen\:40 { color: hsl(82, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:45, html.var.auto .sf-c-txt-darkolivegreen\:45 { color: hsl(82, 39%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50, html.var.auto .sf-c-txt-darkolivegreen\:50 { color: hsl(82, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:55, html.var.auto .sf-c-txt-darkolivegreen\:55 { color: hsl(82, 39%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60, html.var.auto .sf-c-txt-darkolivegreen\:60 { color: hsl(82, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:65, html.var.auto .sf-c-txt-darkolivegreen\:65 { color: hsl(82, 39%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70, html.var.auto .sf-c-txt-darkolivegreen\:70 { color: hsl(82, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:75, html.var.auto .sf-c-txt-darkolivegreen\:75 { color: hsl(82, 39%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80, html.var.auto .sf-c-txt-darkolivegreen\:80 { color: hsl(82, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:85, html.var.auto .sf-c-txt-darkolivegreen\:85 { color: hsl(82, 39%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90, html.var.auto .sf-c-txt-darkolivegreen\:90 { color: hsl(82, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:95, html.var.auto .sf-c-txt-darkolivegreen\:95 { color: hsl(82, 39%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100, html.var.auto .sf-c-txt-darkolivegreen\:100 { color: hsl(82, 39%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:dark, html.auto .sf-c-txt-darkolivegreen\:dark { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0\:dark, html.auto .sf-c-txt-darkolivegreen\:0\:dark { color: hsl(82, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:5\:dark, html.auto .sf-c-txt-darkolivegreen\:5\:dark { color: hsl(82, 39%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10\:dark, html.auto .sf-c-txt-darkolivegreen\:10\:dark { color: hsl(82, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:15\:dark, html.auto .sf-c-txt-darkolivegreen\:15\:dark { color: hsl(82, 39%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20\:dark, html.auto .sf-c-txt-darkolivegreen\:20\:dark { color: hsl(82, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:25\:dark, html.auto .sf-c-txt-darkolivegreen\:25\:dark { color: hsl(82, 39%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30\:dark, html.auto .sf-c-txt-darkolivegreen\:30\:dark { color: hsl(82, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:35\:dark, html.auto .sf-c-txt-darkolivegreen\:35\:dark { color: hsl(82, 39%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40\:dark, html.auto .sf-c-txt-darkolivegreen\:40\:dark { color: hsl(82, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:45\:dark, html.auto .sf-c-txt-darkolivegreen\:45\:dark { color: hsl(82, 39%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50\:dark, html.auto .sf-c-txt-darkolivegreen\:50\:dark { color: hsl(82, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:55\:dark, html.auto .sf-c-txt-darkolivegreen\:55\:dark { color: hsl(82, 39%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60\:dark, html.auto .sf-c-txt-darkolivegreen\:60\:dark { color: hsl(82, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:65\:dark, html.auto .sf-c-txt-darkolivegreen\:65\:dark { color: hsl(82, 39%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70\:dark, html.auto .sf-c-txt-darkolivegreen\:70\:dark { color: hsl(82, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:75\:dark, html.auto .sf-c-txt-darkolivegreen\:75\:dark { color: hsl(82, 39%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80\:dark, html.auto .sf-c-txt-darkolivegreen\:80\:dark { color: hsl(82, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:85\:dark, html.auto .sf-c-txt-darkolivegreen\:85\:dark { color: hsl(82, 39%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90\:dark, html.auto .sf-c-txt-darkolivegreen\:90\:dark { color: hsl(82, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:95\:dark, html.auto .sf-c-txt-darkolivegreen\:95\:dark { color: hsl(82, 39%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100\:dark, html.auto .sf-c-txt-darkolivegreen\:100\:dark { color: hsl(82, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:dark, html.var.auto .sf-c-txt-darkolivegreen\:dark { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:0\:dark, html.var.auto .sf-c-txt-darkolivegreen\:0\:dark { color: hsl(82, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:5\:dark, html.var.auto .sf-c-txt-darkolivegreen\:5\:dark { color: hsl(82, 39%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:10\:dark, html.var.auto .sf-c-txt-darkolivegreen\:10\:dark { color: hsl(82, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:15\:dark, html.var.auto .sf-c-txt-darkolivegreen\:15\:dark { color: hsl(82, 39%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:20\:dark, html.var.auto .sf-c-txt-darkolivegreen\:20\:dark { color: hsl(82, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:25\:dark, html.var.auto .sf-c-txt-darkolivegreen\:25\:dark { color: hsl(82, 39%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:30\:dark, html.var.auto .sf-c-txt-darkolivegreen\:30\:dark { color: hsl(82, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:35\:dark, html.var.auto .sf-c-txt-darkolivegreen\:35\:dark { color: hsl(82, 39%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:40\:dark, html.var.auto .sf-c-txt-darkolivegreen\:40\:dark { color: hsl(82, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:45\:dark, html.var.auto .sf-c-txt-darkolivegreen\:45\:dark { color: hsl(82, 39%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:50\:dark, html.var.auto .sf-c-txt-darkolivegreen\:50\:dark { color: hsl(82, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:55\:dark, html.var.auto .sf-c-txt-darkolivegreen\:55\:dark { color: hsl(82, 39%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:60\:dark, html.var.auto .sf-c-txt-darkolivegreen\:60\:dark { color: hsl(82, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:65\:dark, html.var.auto .sf-c-txt-darkolivegreen\:65\:dark { color: hsl(82, 39%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:70\:dark, html.var.auto .sf-c-txt-darkolivegreen\:70\:dark { color: hsl(82, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:75\:dark, html.var.auto .sf-c-txt-darkolivegreen\:75\:dark { color: hsl(82, 39%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:80\:dark, html.var.auto .sf-c-txt-darkolivegreen\:80\:dark { color: hsl(82, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:85\:dark, html.var.auto .sf-c-txt-darkolivegreen\:85\:dark { color: hsl(82, 39%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:90\:dark, html.var.auto .sf-c-txt-darkolivegreen\:90\:dark { color: hsl(82, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:95\:dark, html.var.auto .sf-c-txt-darkolivegreen\:95\:dark { color: hsl(82, 39%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkolivegreen\:100\:dark, html.var.auto .sf-c-txt-darkolivegreen\:100\:dark { color: hsl(82, 39%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkorange.css b/src/colors/20/darkorange.css index b353feb..9f76fdb 100644 --- a/src/colors/20/darkorange.css +++ b/src/colors/20/darkorange.css @@ -1,4 +1,4 @@ -:root { +[class*='darkorange'] { --sf-c-darkorange: 33 100% 50%; --sf-c-darkorange-0: 33 100% 0%; --sf-c-darkorange-5: 33 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkorange\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkorange\:95\:dark, html.var.auto .sf-c-darkorange\:95\:dark { color: hsl(33, 100%, 95%); background: hsl(33, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkorange\:100\:dark, html.var.auto .sf-c-darkorange\:100\:dark { color: hsl(33, 100%, 95%); background: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange, html.auto .sf-c-txt-darkorange { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:0, html.auto .sf-c-txt-darkorange\:0 { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:5, html.auto .sf-c-txt-darkorange\:5 { color: hsl(33, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:10, html.auto .sf-c-txt-darkorange\:10 { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:15, html.auto .sf-c-txt-darkorange\:15 { color: hsl(33, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:20, html.auto .sf-c-txt-darkorange\:20 { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:25, html.auto .sf-c-txt-darkorange\:25 { color: hsl(33, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:30, html.auto .sf-c-txt-darkorange\:30 { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:35, html.auto .sf-c-txt-darkorange\:35 { color: hsl(33, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:40, html.auto .sf-c-txt-darkorange\:40 { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:45, html.auto .sf-c-txt-darkorange\:45 { color: hsl(33, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:50, html.auto .sf-c-txt-darkorange\:50 { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:55, html.auto .sf-c-txt-darkorange\:55 { color: hsl(33, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:60, html.auto .sf-c-txt-darkorange\:60 { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:65, html.auto .sf-c-txt-darkorange\:65 { color: hsl(33, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:70, html.auto .sf-c-txt-darkorange\:70 { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:75, html.auto .sf-c-txt-darkorange\:75 { color: hsl(33, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:80, html.auto .sf-c-txt-darkorange\:80 { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:85, html.auto .sf-c-txt-darkorange\:85 { color: hsl(33, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:90, html.auto .sf-c-txt-darkorange\:90 { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:95, html.auto .sf-c-txt-darkorange\:95 { color: hsl(33, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:100, html.auto .sf-c-txt-darkorange\:100 { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange, html.var.auto .sf-c-txt-darkorange { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:0, html.var.auto .sf-c-txt-darkorange\:0 { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:5, html.var.auto .sf-c-txt-darkorange\:5 { color: hsl(33, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:10, html.var.auto .sf-c-txt-darkorange\:10 { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:15, html.var.auto .sf-c-txt-darkorange\:15 { color: hsl(33, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:20, html.var.auto .sf-c-txt-darkorange\:20 { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:25, html.var.auto .sf-c-txt-darkorange\:25 { color: hsl(33, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:30, html.var.auto .sf-c-txt-darkorange\:30 { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:35, html.var.auto .sf-c-txt-darkorange\:35 { color: hsl(33, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:40, html.var.auto .sf-c-txt-darkorange\:40 { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:45, html.var.auto .sf-c-txt-darkorange\:45 { color: hsl(33, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:50, html.var.auto .sf-c-txt-darkorange\:50 { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:55, html.var.auto .sf-c-txt-darkorange\:55 { color: hsl(33, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:60, html.var.auto .sf-c-txt-darkorange\:60 { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:65, html.var.auto .sf-c-txt-darkorange\:65 { color: hsl(33, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:70, html.var.auto .sf-c-txt-darkorange\:70 { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:75, html.var.auto .sf-c-txt-darkorange\:75 { color: hsl(33, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:80, html.var.auto .sf-c-txt-darkorange\:80 { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:85, html.var.auto .sf-c-txt-darkorange\:85 { color: hsl(33, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:90, html.var.auto .sf-c-txt-darkorange\:90 { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:95, html.var.auto .sf-c-txt-darkorange\:95 { color: hsl(33, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:100, html.var.auto .sf-c-txt-darkorange\:100 { color: hsl(33, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:dark, html.auto .sf-c-txt-darkorange\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:0\:dark, html.auto .sf-c-txt-darkorange\:0\:dark { color: hsl(33, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:5\:dark, html.auto .sf-c-txt-darkorange\:5\:dark { color: hsl(33, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:10\:dark, html.auto .sf-c-txt-darkorange\:10\:dark { color: hsl(33, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:15\:dark, html.auto .sf-c-txt-darkorange\:15\:dark { color: hsl(33, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:20\:dark, html.auto .sf-c-txt-darkorange\:20\:dark { color: hsl(33, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:25\:dark, html.auto .sf-c-txt-darkorange\:25\:dark { color: hsl(33, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:30\:dark, html.auto .sf-c-txt-darkorange\:30\:dark { color: hsl(33, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:35\:dark, html.auto .sf-c-txt-darkorange\:35\:dark { color: hsl(33, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:40\:dark, html.auto .sf-c-txt-darkorange\:40\:dark { color: hsl(33, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:45\:dark, html.auto .sf-c-txt-darkorange\:45\:dark { color: hsl(33, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:50\:dark, html.auto .sf-c-txt-darkorange\:50\:dark { color: hsl(33, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:55\:dark, html.auto .sf-c-txt-darkorange\:55\:dark { color: hsl(33, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:60\:dark, html.auto .sf-c-txt-darkorange\:60\:dark { color: hsl(33, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:65\:dark, html.auto .sf-c-txt-darkorange\:65\:dark { color: hsl(33, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:70\:dark, html.auto .sf-c-txt-darkorange\:70\:dark { color: hsl(33, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:75\:dark, html.auto .sf-c-txt-darkorange\:75\:dark { color: hsl(33, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:80\:dark, html.auto .sf-c-txt-darkorange\:80\:dark { color: hsl(33, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:85\:dark, html.auto .sf-c-txt-darkorange\:85\:dark { color: hsl(33, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:90\:dark, html.auto .sf-c-txt-darkorange\:90\:dark { color: hsl(33, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:95\:dark, html.auto .sf-c-txt-darkorange\:95\:dark { color: hsl(33, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkorange\:100\:dark, html.auto .sf-c-txt-darkorange\:100\:dark { color: hsl(33, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:dark, html.var.auto .sf-c-txt-darkorange\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:0\:dark, html.var.auto .sf-c-txt-darkorange\:0\:dark { color: hsl(33, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:5\:dark, html.var.auto .sf-c-txt-darkorange\:5\:dark { color: hsl(33, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:10\:dark, html.var.auto .sf-c-txt-darkorange\:10\:dark { color: hsl(33, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:15\:dark, html.var.auto .sf-c-txt-darkorange\:15\:dark { color: hsl(33, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:20\:dark, html.var.auto .sf-c-txt-darkorange\:20\:dark { color: hsl(33, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:25\:dark, html.var.auto .sf-c-txt-darkorange\:25\:dark { color: hsl(33, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:30\:dark, html.var.auto .sf-c-txt-darkorange\:30\:dark { color: hsl(33, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:35\:dark, html.var.auto .sf-c-txt-darkorange\:35\:dark { color: hsl(33, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:40\:dark, html.var.auto .sf-c-txt-darkorange\:40\:dark { color: hsl(33, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:45\:dark, html.var.auto .sf-c-txt-darkorange\:45\:dark { color: hsl(33, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:50\:dark, html.var.auto .sf-c-txt-darkorange\:50\:dark { color: hsl(33, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:55\:dark, html.var.auto .sf-c-txt-darkorange\:55\:dark { color: hsl(33, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:60\:dark, html.var.auto .sf-c-txt-darkorange\:60\:dark { color: hsl(33, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:65\:dark, html.var.auto .sf-c-txt-darkorange\:65\:dark { color: hsl(33, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:70\:dark, html.var.auto .sf-c-txt-darkorange\:70\:dark { color: hsl(33, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:75\:dark, html.var.auto .sf-c-txt-darkorange\:75\:dark { color: hsl(33, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:80\:dark, html.var.auto .sf-c-txt-darkorange\:80\:dark { color: hsl(33, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:85\:dark, html.var.auto .sf-c-txt-darkorange\:85\:dark { color: hsl(33, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:90\:dark, html.var.auto .sf-c-txt-darkorange\:90\:dark { color: hsl(33, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:95\:dark, html.var.auto .sf-c-txt-darkorange\:95\:dark { color: hsl(33, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkorange\:100\:dark, html.var.auto .sf-c-txt-darkorange\:100\:dark { color: hsl(33, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkorchid.css b/src/colors/20/darkorchid.css index 359f7e2..33d4df0 100644 --- a/src/colors/20/darkorchid.css +++ b/src/colors/20/darkorchid.css @@ -1,4 +1,4 @@ -:root { +[class*='darkorchid'] { --sf-c-darkorchid: 280 61% 50%; --sf-c-darkorchid-0: 280 61% 0%; --sf-c-darkorchid-5: 280 61% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkorchid\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkorchid\:95\:dark, html.var.auto .sf-c-darkorchid\:95\:dark { color: hsl(280, 61%, 95%); background: hsl(280, 61%, 5%) } html.var[data-theme='auto'] .sf-c-darkorchid\:100\:dark, html.var.auto .sf-c-darkorchid\:100\:dark { color: hsl(280, 61%, 95%); background: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid, html.auto .sf-c-txt-darkorchid { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0, html.auto .sf-c-txt-darkorchid\:0 { color: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:5, html.auto .sf-c-txt-darkorchid\:5 { color: hsl(280, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10, html.auto .sf-c-txt-darkorchid\:10 { color: hsl(280, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:15, html.auto .sf-c-txt-darkorchid\:15 { color: hsl(280, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20, html.auto .sf-c-txt-darkorchid\:20 { color: hsl(280, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:25, html.auto .sf-c-txt-darkorchid\:25 { color: hsl(280, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30, html.auto .sf-c-txt-darkorchid\:30 { color: hsl(280, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:35, html.auto .sf-c-txt-darkorchid\:35 { color: hsl(280, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40, html.auto .sf-c-txt-darkorchid\:40 { color: hsl(280, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:45, html.auto .sf-c-txt-darkorchid\:45 { color: hsl(280, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50, html.auto .sf-c-txt-darkorchid\:50 { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:55, html.auto .sf-c-txt-darkorchid\:55 { color: hsl(280, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60, html.auto .sf-c-txt-darkorchid\:60 { color: hsl(280, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:65, html.auto .sf-c-txt-darkorchid\:65 { color: hsl(280, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70, html.auto .sf-c-txt-darkorchid\:70 { color: hsl(280, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:75, html.auto .sf-c-txt-darkorchid\:75 { color: hsl(280, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80, html.auto .sf-c-txt-darkorchid\:80 { color: hsl(280, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:85, html.auto .sf-c-txt-darkorchid\:85 { color: hsl(280, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90, html.auto .sf-c-txt-darkorchid\:90 { color: hsl(280, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:95, html.auto .sf-c-txt-darkorchid\:95 { color: hsl(280, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100, html.auto .sf-c-txt-darkorchid\:100 { color: hsl(280, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid, html.var.auto .sf-c-txt-darkorchid { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0, html.var.auto .sf-c-txt-darkorchid\:0 { color: hsl(280, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:5, html.var.auto .sf-c-txt-darkorchid\:5 { color: hsl(280, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10, html.var.auto .sf-c-txt-darkorchid\:10 { color: hsl(280, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:15, html.var.auto .sf-c-txt-darkorchid\:15 { color: hsl(280, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20, html.var.auto .sf-c-txt-darkorchid\:20 { color: hsl(280, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:25, html.var.auto .sf-c-txt-darkorchid\:25 { color: hsl(280, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30, html.var.auto .sf-c-txt-darkorchid\:30 { color: hsl(280, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:35, html.var.auto .sf-c-txt-darkorchid\:35 { color: hsl(280, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40, html.var.auto .sf-c-txt-darkorchid\:40 { color: hsl(280, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:45, html.var.auto .sf-c-txt-darkorchid\:45 { color: hsl(280, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50, html.var.auto .sf-c-txt-darkorchid\:50 { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:55, html.var.auto .sf-c-txt-darkorchid\:55 { color: hsl(280, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60, html.var.auto .sf-c-txt-darkorchid\:60 { color: hsl(280, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:65, html.var.auto .sf-c-txt-darkorchid\:65 { color: hsl(280, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70, html.var.auto .sf-c-txt-darkorchid\:70 { color: hsl(280, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:75, html.var.auto .sf-c-txt-darkorchid\:75 { color: hsl(280, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80, html.var.auto .sf-c-txt-darkorchid\:80 { color: hsl(280, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:85, html.var.auto .sf-c-txt-darkorchid\:85 { color: hsl(280, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90, html.var.auto .sf-c-txt-darkorchid\:90 { color: hsl(280, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:95, html.var.auto .sf-c-txt-darkorchid\:95 { color: hsl(280, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100, html.var.auto .sf-c-txt-darkorchid\:100 { color: hsl(280, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:dark, html.auto .sf-c-txt-darkorchid\:dark { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0\:dark, html.auto .sf-c-txt-darkorchid\:0\:dark { color: hsl(280, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:5\:dark, html.auto .sf-c-txt-darkorchid\:5\:dark { color: hsl(280, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10\:dark, html.auto .sf-c-txt-darkorchid\:10\:dark { color: hsl(280, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:15\:dark, html.auto .sf-c-txt-darkorchid\:15\:dark { color: hsl(280, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20\:dark, html.auto .sf-c-txt-darkorchid\:20\:dark { color: hsl(280, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:25\:dark, html.auto .sf-c-txt-darkorchid\:25\:dark { color: hsl(280, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30\:dark, html.auto .sf-c-txt-darkorchid\:30\:dark { color: hsl(280, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:35\:dark, html.auto .sf-c-txt-darkorchid\:35\:dark { color: hsl(280, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40\:dark, html.auto .sf-c-txt-darkorchid\:40\:dark { color: hsl(280, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:45\:dark, html.auto .sf-c-txt-darkorchid\:45\:dark { color: hsl(280, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50\:dark, html.auto .sf-c-txt-darkorchid\:50\:dark { color: hsl(280, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:55\:dark, html.auto .sf-c-txt-darkorchid\:55\:dark { color: hsl(280, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60\:dark, html.auto .sf-c-txt-darkorchid\:60\:dark { color: hsl(280, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:65\:dark, html.auto .sf-c-txt-darkorchid\:65\:dark { color: hsl(280, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70\:dark, html.auto .sf-c-txt-darkorchid\:70\:dark { color: hsl(280, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:75\:dark, html.auto .sf-c-txt-darkorchid\:75\:dark { color: hsl(280, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80\:dark, html.auto .sf-c-txt-darkorchid\:80\:dark { color: hsl(280, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:85\:dark, html.auto .sf-c-txt-darkorchid\:85\:dark { color: hsl(280, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90\:dark, html.auto .sf-c-txt-darkorchid\:90\:dark { color: hsl(280, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:95\:dark, html.auto .sf-c-txt-darkorchid\:95\:dark { color: hsl(280, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100\:dark, html.auto .sf-c-txt-darkorchid\:100\:dark { color: hsl(280, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:dark, html.var.auto .sf-c-txt-darkorchid\:dark { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:0\:dark, html.var.auto .sf-c-txt-darkorchid\:0\:dark { color: hsl(280, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:5\:dark, html.var.auto .sf-c-txt-darkorchid\:5\:dark { color: hsl(280, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:10\:dark, html.var.auto .sf-c-txt-darkorchid\:10\:dark { color: hsl(280, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:15\:dark, html.var.auto .sf-c-txt-darkorchid\:15\:dark { color: hsl(280, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:20\:dark, html.var.auto .sf-c-txt-darkorchid\:20\:dark { color: hsl(280, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:25\:dark, html.var.auto .sf-c-txt-darkorchid\:25\:dark { color: hsl(280, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:30\:dark, html.var.auto .sf-c-txt-darkorchid\:30\:dark { color: hsl(280, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:35\:dark, html.var.auto .sf-c-txt-darkorchid\:35\:dark { color: hsl(280, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:40\:dark, html.var.auto .sf-c-txt-darkorchid\:40\:dark { color: hsl(280, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:45\:dark, html.var.auto .sf-c-txt-darkorchid\:45\:dark { color: hsl(280, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:50\:dark, html.var.auto .sf-c-txt-darkorchid\:50\:dark { color: hsl(280, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:55\:dark, html.var.auto .sf-c-txt-darkorchid\:55\:dark { color: hsl(280, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:60\:dark, html.var.auto .sf-c-txt-darkorchid\:60\:dark { color: hsl(280, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:65\:dark, html.var.auto .sf-c-txt-darkorchid\:65\:dark { color: hsl(280, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:70\:dark, html.var.auto .sf-c-txt-darkorchid\:70\:dark { color: hsl(280, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:75\:dark, html.var.auto .sf-c-txt-darkorchid\:75\:dark { color: hsl(280, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:80\:dark, html.var.auto .sf-c-txt-darkorchid\:80\:dark { color: hsl(280, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:85\:dark, html.var.auto .sf-c-txt-darkorchid\:85\:dark { color: hsl(280, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:90\:dark, html.var.auto .sf-c-txt-darkorchid\:90\:dark { color: hsl(280, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:95\:dark, html.var.auto .sf-c-txt-darkorchid\:95\:dark { color: hsl(280, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkorchid\:100\:dark, html.var.auto .sf-c-txt-darkorchid\:100\:dark { color: hsl(280, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkred.css b/src/colors/20/darkred.css index f9c9df5..c5bcbf9 100644 --- a/src/colors/20/darkred.css +++ b/src/colors/20/darkred.css @@ -1,4 +1,4 @@ -:root { +[class*='darkred'] { --sf-c-darkred: 0 100% 27%; --sf-c-darkred-0: 0 100% 0%; --sf-c-darkred-5: 0 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkred\:100\:dark, html.dark .sf-c-txt-da html.var[data-theme='auto'] .sf-c-darkred\:95\:dark, html.var.auto .sf-c-darkred\:95\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkred\:100\:dark, html.var.auto .sf-c-darkred\:100\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred, html.auto .sf-c-txt-darkred { color: hsl(0, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:0, html.auto .sf-c-txt-darkred\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:5, html.auto .sf-c-txt-darkred\:5 { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:10, html.auto .sf-c-txt-darkred\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:15, html.auto .sf-c-txt-darkred\:15 { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:20, html.auto .sf-c-txt-darkred\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:25, html.auto .sf-c-txt-darkred\:25 { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:30, html.auto .sf-c-txt-darkred\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:35, html.auto .sf-c-txt-darkred\:35 { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:40, html.auto .sf-c-txt-darkred\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:45, html.auto .sf-c-txt-darkred\:45 { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:50, html.auto .sf-c-txt-darkred\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:55, html.auto .sf-c-txt-darkred\:55 { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:60, html.auto .sf-c-txt-darkred\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:65, html.auto .sf-c-txt-darkred\:65 { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:70, html.auto .sf-c-txt-darkred\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:75, html.auto .sf-c-txt-darkred\:75 { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:80, html.auto .sf-c-txt-darkred\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:85, html.auto .sf-c-txt-darkred\:85 { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:90, html.auto .sf-c-txt-darkred\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:95, html.auto .sf-c-txt-darkred\:95 { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:100, html.auto .sf-c-txt-darkred\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkred, html.var.auto .sf-c-txt-darkred { color: hsl(0, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:0, html.var.auto .sf-c-txt-darkred\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:5, html.var.auto .sf-c-txt-darkred\:5 { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:10, html.var.auto .sf-c-txt-darkred\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:15, html.var.auto .sf-c-txt-darkred\:15 { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:20, html.var.auto .sf-c-txt-darkred\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:25, html.var.auto .sf-c-txt-darkred\:25 { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:30, html.var.auto .sf-c-txt-darkred\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:35, html.var.auto .sf-c-txt-darkred\:35 { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:40, html.var.auto .sf-c-txt-darkred\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:45, html.var.auto .sf-c-txt-darkred\:45 { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:50, html.var.auto .sf-c-txt-darkred\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:55, html.var.auto .sf-c-txt-darkred\:55 { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:60, html.var.auto .sf-c-txt-darkred\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:65, html.var.auto .sf-c-txt-darkred\:65 { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:70, html.var.auto .sf-c-txt-darkred\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:75, html.var.auto .sf-c-txt-darkred\:75 { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:80, html.var.auto .sf-c-txt-darkred\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:85, html.var.auto .sf-c-txt-darkred\:85 { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:90, html.var.auto .sf-c-txt-darkred\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:95, html.var.auto .sf-c-txt-darkred\:95 { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:100, html.var.auto .sf-c-txt-darkred\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:dark, html.auto .sf-c-txt-darkred\:dark { color: hsl(0, 100%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:0\:dark, html.auto .sf-c-txt-darkred\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:5\:dark, html.auto .sf-c-txt-darkred\:5\:dark { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:10\:dark, html.auto .sf-c-txt-darkred\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:15\:dark, html.auto .sf-c-txt-darkred\:15\:dark { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:20\:dark, html.auto .sf-c-txt-darkred\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:25\:dark, html.auto .sf-c-txt-darkred\:25\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:30\:dark, html.auto .sf-c-txt-darkred\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:35\:dark, html.auto .sf-c-txt-darkred\:35\:dark { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:40\:dark, html.auto .sf-c-txt-darkred\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:45\:dark, html.auto .sf-c-txt-darkred\:45\:dark { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:50\:dark, html.auto .sf-c-txt-darkred\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:55\:dark, html.auto .sf-c-txt-darkred\:55\:dark { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:60\:dark, html.auto .sf-c-txt-darkred\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:65\:dark, html.auto .sf-c-txt-darkred\:65\:dark { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:70\:dark, html.auto .sf-c-txt-darkred\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:75\:dark, html.auto .sf-c-txt-darkred\:75\:dark { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:80\:dark, html.auto .sf-c-txt-darkred\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:85\:dark, html.auto .sf-c-txt-darkred\:85\:dark { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:90\:dark, html.auto .sf-c-txt-darkred\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:95\:dark, html.auto .sf-c-txt-darkred\:95\:dark { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkred\:100\:dark, html.auto .sf-c-txt-darkred\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:dark, html.var.auto .sf-c-txt-darkred\:dark { color: hsl(0, 100%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:0\:dark, html.var.auto .sf-c-txt-darkred\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:5\:dark, html.var.auto .sf-c-txt-darkred\:5\:dark { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:10\:dark, html.var.auto .sf-c-txt-darkred\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:15\:dark, html.var.auto .sf-c-txt-darkred\:15\:dark { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:20\:dark, html.var.auto .sf-c-txt-darkred\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:25\:dark, html.var.auto .sf-c-txt-darkred\:25\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:30\:dark, html.var.auto .sf-c-txt-darkred\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:35\:dark, html.var.auto .sf-c-txt-darkred\:35\:dark { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:40\:dark, html.var.auto .sf-c-txt-darkred\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:45\:dark, html.var.auto .sf-c-txt-darkred\:45\:dark { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:50\:dark, html.var.auto .sf-c-txt-darkred\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:55\:dark, html.var.auto .sf-c-txt-darkred\:55\:dark { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:60\:dark, html.var.auto .sf-c-txt-darkred\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:65\:dark, html.var.auto .sf-c-txt-darkred\:65\:dark { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:70\:dark, html.var.auto .sf-c-txt-darkred\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:75\:dark, html.var.auto .sf-c-txt-darkred\:75\:dark { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:80\:dark, html.var.auto .sf-c-txt-darkred\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:85\:dark, html.var.auto .sf-c-txt-darkred\:85\:dark { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:90\:dark, html.var.auto .sf-c-txt-darkred\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:95\:dark, html.var.auto .sf-c-txt-darkred\:95\:dark { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkred\:100\:dark, html.var.auto .sf-c-txt-darkred\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darksalmon.css b/src/colors/20/darksalmon.css index 801bfe7..612a76c 100644 --- a/src/colors/20/darksalmon.css +++ b/src/colors/20/darksalmon.css @@ -1,4 +1,4 @@ -:root { +[class*='darksalmon'] { --sf-c-darksalmon: 15 72% 70%; --sf-c-darksalmon-0: 15 72% 0%; --sf-c-darksalmon-5: 15 72% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darksalmon\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darksalmon\:95\:dark, html.var.auto .sf-c-darksalmon\:95\:dark { color: hsl(15, 72%, 95%); background: hsl(15, 72%, 5%) } html.var[data-theme='auto'] .sf-c-darksalmon\:100\:dark, html.var.auto .sf-c-darksalmon\:100\:dark { color: hsl(15, 72%, 95%); background: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon, html.auto .sf-c-txt-darksalmon { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0, html.auto .sf-c-txt-darksalmon\:0 { color: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:5, html.auto .sf-c-txt-darksalmon\:5 { color: hsl(15, 72%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10, html.auto .sf-c-txt-darksalmon\:10 { color: hsl(15, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:15, html.auto .sf-c-txt-darksalmon\:15 { color: hsl(15, 72%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20, html.auto .sf-c-txt-darksalmon\:20 { color: hsl(15, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:25, html.auto .sf-c-txt-darksalmon\:25 { color: hsl(15, 72%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30, html.auto .sf-c-txt-darksalmon\:30 { color: hsl(15, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:35, html.auto .sf-c-txt-darksalmon\:35 { color: hsl(15, 72%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40, html.auto .sf-c-txt-darksalmon\:40 { color: hsl(15, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:45, html.auto .sf-c-txt-darksalmon\:45 { color: hsl(15, 72%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50, html.auto .sf-c-txt-darksalmon\:50 { color: hsl(15, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:55, html.auto .sf-c-txt-darksalmon\:55 { color: hsl(15, 72%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60, html.auto .sf-c-txt-darksalmon\:60 { color: hsl(15, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:65, html.auto .sf-c-txt-darksalmon\:65 { color: hsl(15, 72%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70, html.auto .sf-c-txt-darksalmon\:70 { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:75, html.auto .sf-c-txt-darksalmon\:75 { color: hsl(15, 72%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80, html.auto .sf-c-txt-darksalmon\:80 { color: hsl(15, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:85, html.auto .sf-c-txt-darksalmon\:85 { color: hsl(15, 72%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90, html.auto .sf-c-txt-darksalmon\:90 { color: hsl(15, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:95, html.auto .sf-c-txt-darksalmon\:95 { color: hsl(15, 72%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100, html.auto .sf-c-txt-darksalmon\:100 { color: hsl(15, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon, html.var.auto .sf-c-txt-darksalmon { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0, html.var.auto .sf-c-txt-darksalmon\:0 { color: hsl(15, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:5, html.var.auto .sf-c-txt-darksalmon\:5 { color: hsl(15, 72%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10, html.var.auto .sf-c-txt-darksalmon\:10 { color: hsl(15, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:15, html.var.auto .sf-c-txt-darksalmon\:15 { color: hsl(15, 72%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20, html.var.auto .sf-c-txt-darksalmon\:20 { color: hsl(15, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:25, html.var.auto .sf-c-txt-darksalmon\:25 { color: hsl(15, 72%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30, html.var.auto .sf-c-txt-darksalmon\:30 { color: hsl(15, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:35, html.var.auto .sf-c-txt-darksalmon\:35 { color: hsl(15, 72%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40, html.var.auto .sf-c-txt-darksalmon\:40 { color: hsl(15, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:45, html.var.auto .sf-c-txt-darksalmon\:45 { color: hsl(15, 72%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50, html.var.auto .sf-c-txt-darksalmon\:50 { color: hsl(15, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:55, html.var.auto .sf-c-txt-darksalmon\:55 { color: hsl(15, 72%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60, html.var.auto .sf-c-txt-darksalmon\:60 { color: hsl(15, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:65, html.var.auto .sf-c-txt-darksalmon\:65 { color: hsl(15, 72%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70, html.var.auto .sf-c-txt-darksalmon\:70 { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:75, html.var.auto .sf-c-txt-darksalmon\:75 { color: hsl(15, 72%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80, html.var.auto .sf-c-txt-darksalmon\:80 { color: hsl(15, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:85, html.var.auto .sf-c-txt-darksalmon\:85 { color: hsl(15, 72%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90, html.var.auto .sf-c-txt-darksalmon\:90 { color: hsl(15, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:95, html.var.auto .sf-c-txt-darksalmon\:95 { color: hsl(15, 72%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100, html.var.auto .sf-c-txt-darksalmon\:100 { color: hsl(15, 72%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:dark, html.auto .sf-c-txt-darksalmon\:dark { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0\:dark, html.auto .sf-c-txt-darksalmon\:0\:dark { color: hsl(15, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:5\:dark, html.auto .sf-c-txt-darksalmon\:5\:dark { color: hsl(15, 72%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10\:dark, html.auto .sf-c-txt-darksalmon\:10\:dark { color: hsl(15, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:15\:dark, html.auto .sf-c-txt-darksalmon\:15\:dark { color: hsl(15, 72%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20\:dark, html.auto .sf-c-txt-darksalmon\:20\:dark { color: hsl(15, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:25\:dark, html.auto .sf-c-txt-darksalmon\:25\:dark { color: hsl(15, 72%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30\:dark, html.auto .sf-c-txt-darksalmon\:30\:dark { color: hsl(15, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:35\:dark, html.auto .sf-c-txt-darksalmon\:35\:dark { color: hsl(15, 72%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40\:dark, html.auto .sf-c-txt-darksalmon\:40\:dark { color: hsl(15, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:45\:dark, html.auto .sf-c-txt-darksalmon\:45\:dark { color: hsl(15, 72%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50\:dark, html.auto .sf-c-txt-darksalmon\:50\:dark { color: hsl(15, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:55\:dark, html.auto .sf-c-txt-darksalmon\:55\:dark { color: hsl(15, 72%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60\:dark, html.auto .sf-c-txt-darksalmon\:60\:dark { color: hsl(15, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:65\:dark, html.auto .sf-c-txt-darksalmon\:65\:dark { color: hsl(15, 72%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70\:dark, html.auto .sf-c-txt-darksalmon\:70\:dark { color: hsl(15, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:75\:dark, html.auto .sf-c-txt-darksalmon\:75\:dark { color: hsl(15, 72%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80\:dark, html.auto .sf-c-txt-darksalmon\:80\:dark { color: hsl(15, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:85\:dark, html.auto .sf-c-txt-darksalmon\:85\:dark { color: hsl(15, 72%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90\:dark, html.auto .sf-c-txt-darksalmon\:90\:dark { color: hsl(15, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:95\:dark, html.auto .sf-c-txt-darksalmon\:95\:dark { color: hsl(15, 72%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100\:dark, html.auto .sf-c-txt-darksalmon\:100\:dark { color: hsl(15, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:dark, html.var.auto .sf-c-txt-darksalmon\:dark { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:0\:dark, html.var.auto .sf-c-txt-darksalmon\:0\:dark { color: hsl(15, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:5\:dark, html.var.auto .sf-c-txt-darksalmon\:5\:dark { color: hsl(15, 72%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:10\:dark, html.var.auto .sf-c-txt-darksalmon\:10\:dark { color: hsl(15, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:15\:dark, html.var.auto .sf-c-txt-darksalmon\:15\:dark { color: hsl(15, 72%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:20\:dark, html.var.auto .sf-c-txt-darksalmon\:20\:dark { color: hsl(15, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:25\:dark, html.var.auto .sf-c-txt-darksalmon\:25\:dark { color: hsl(15, 72%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:30\:dark, html.var.auto .sf-c-txt-darksalmon\:30\:dark { color: hsl(15, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:35\:dark, html.var.auto .sf-c-txt-darksalmon\:35\:dark { color: hsl(15, 72%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:40\:dark, html.var.auto .sf-c-txt-darksalmon\:40\:dark { color: hsl(15, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:45\:dark, html.var.auto .sf-c-txt-darksalmon\:45\:dark { color: hsl(15, 72%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:50\:dark, html.var.auto .sf-c-txt-darksalmon\:50\:dark { color: hsl(15, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:55\:dark, html.var.auto .sf-c-txt-darksalmon\:55\:dark { color: hsl(15, 72%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:60\:dark, html.var.auto .sf-c-txt-darksalmon\:60\:dark { color: hsl(15, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:65\:dark, html.var.auto .sf-c-txt-darksalmon\:65\:dark { color: hsl(15, 72%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:70\:dark, html.var.auto .sf-c-txt-darksalmon\:70\:dark { color: hsl(15, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:75\:dark, html.var.auto .sf-c-txt-darksalmon\:75\:dark { color: hsl(15, 72%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:80\:dark, html.var.auto .sf-c-txt-darksalmon\:80\:dark { color: hsl(15, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:85\:dark, html.var.auto .sf-c-txt-darksalmon\:85\:dark { color: hsl(15, 72%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:90\:dark, html.var.auto .sf-c-txt-darksalmon\:90\:dark { color: hsl(15, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:95\:dark, html.var.auto .sf-c-txt-darksalmon\:95\:dark { color: hsl(15, 72%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darksalmon\:100\:dark, html.var.auto .sf-c-txt-darksalmon\:100\:dark { color: hsl(15, 72%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkseagreen.css b/src/colors/20/darkseagreen.css index 8658302..7236d37 100644 --- a/src/colors/20/darkseagreen.css +++ b/src/colors/20/darkseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='darkseagreen'] { --sf-c-darkseagreen: 120 25% 65%; --sf-c-darkseagreen-0: 120 25% 0%; --sf-c-darkseagreen-5: 120 25% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkseagreen\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-darkseagreen\:95\:dark, html.var.auto .sf-c-darkseagreen\:95\:dark { color: hsl(120, 25%, 95%); background: hsl(120, 25%, 5%) } html.var[data-theme='auto'] .sf-c-darkseagreen\:100\:dark, html.var.auto .sf-c-darkseagreen\:100\:dark { color: hsl(120, 25%, 95%); background: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen, html.auto .sf-c-txt-darkseagreen { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0, html.auto .sf-c-txt-darkseagreen\:0 { color: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:5, html.auto .sf-c-txt-darkseagreen\:5 { color: hsl(120, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10, html.auto .sf-c-txt-darkseagreen\:10 { color: hsl(120, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:15, html.auto .sf-c-txt-darkseagreen\:15 { color: hsl(120, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20, html.auto .sf-c-txt-darkseagreen\:20 { color: hsl(120, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:25, html.auto .sf-c-txt-darkseagreen\:25 { color: hsl(120, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30, html.auto .sf-c-txt-darkseagreen\:30 { color: hsl(120, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:35, html.auto .sf-c-txt-darkseagreen\:35 { color: hsl(120, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40, html.auto .sf-c-txt-darkseagreen\:40 { color: hsl(120, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:45, html.auto .sf-c-txt-darkseagreen\:45 { color: hsl(120, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50, html.auto .sf-c-txt-darkseagreen\:50 { color: hsl(120, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:55, html.auto .sf-c-txt-darkseagreen\:55 { color: hsl(120, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60, html.auto .sf-c-txt-darkseagreen\:60 { color: hsl(120, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:65, html.auto .sf-c-txt-darkseagreen\:65 { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70, html.auto .sf-c-txt-darkseagreen\:70 { color: hsl(120, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:75, html.auto .sf-c-txt-darkseagreen\:75 { color: hsl(120, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80, html.auto .sf-c-txt-darkseagreen\:80 { color: hsl(120, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:85, html.auto .sf-c-txt-darkseagreen\:85 { color: hsl(120, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90, html.auto .sf-c-txt-darkseagreen\:90 { color: hsl(120, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:95, html.auto .sf-c-txt-darkseagreen\:95 { color: hsl(120, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100, html.auto .sf-c-txt-darkseagreen\:100 { color: hsl(120, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen, html.var.auto .sf-c-txt-darkseagreen { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0, html.var.auto .sf-c-txt-darkseagreen\:0 { color: hsl(120, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:5, html.var.auto .sf-c-txt-darkseagreen\:5 { color: hsl(120, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10, html.var.auto .sf-c-txt-darkseagreen\:10 { color: hsl(120, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:15, html.var.auto .sf-c-txt-darkseagreen\:15 { color: hsl(120, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20, html.var.auto .sf-c-txt-darkseagreen\:20 { color: hsl(120, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:25, html.var.auto .sf-c-txt-darkseagreen\:25 { color: hsl(120, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30, html.var.auto .sf-c-txt-darkseagreen\:30 { color: hsl(120, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:35, html.var.auto .sf-c-txt-darkseagreen\:35 { color: hsl(120, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40, html.var.auto .sf-c-txt-darkseagreen\:40 { color: hsl(120, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:45, html.var.auto .sf-c-txt-darkseagreen\:45 { color: hsl(120, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50, html.var.auto .sf-c-txt-darkseagreen\:50 { color: hsl(120, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:55, html.var.auto .sf-c-txt-darkseagreen\:55 { color: hsl(120, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60, html.var.auto .sf-c-txt-darkseagreen\:60 { color: hsl(120, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:65, html.var.auto .sf-c-txt-darkseagreen\:65 { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70, html.var.auto .sf-c-txt-darkseagreen\:70 { color: hsl(120, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:75, html.var.auto .sf-c-txt-darkseagreen\:75 { color: hsl(120, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80, html.var.auto .sf-c-txt-darkseagreen\:80 { color: hsl(120, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:85, html.var.auto .sf-c-txt-darkseagreen\:85 { color: hsl(120, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90, html.var.auto .sf-c-txt-darkseagreen\:90 { color: hsl(120, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:95, html.var.auto .sf-c-txt-darkseagreen\:95 { color: hsl(120, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100, html.var.auto .sf-c-txt-darkseagreen\:100 { color: hsl(120, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:dark, html.auto .sf-c-txt-darkseagreen\:dark { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0\:dark, html.auto .sf-c-txt-darkseagreen\:0\:dark { color: hsl(120, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:5\:dark, html.auto .sf-c-txt-darkseagreen\:5\:dark { color: hsl(120, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10\:dark, html.auto .sf-c-txt-darkseagreen\:10\:dark { color: hsl(120, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:15\:dark, html.auto .sf-c-txt-darkseagreen\:15\:dark { color: hsl(120, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20\:dark, html.auto .sf-c-txt-darkseagreen\:20\:dark { color: hsl(120, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:25\:dark, html.auto .sf-c-txt-darkseagreen\:25\:dark { color: hsl(120, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30\:dark, html.auto .sf-c-txt-darkseagreen\:30\:dark { color: hsl(120, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:35\:dark, html.auto .sf-c-txt-darkseagreen\:35\:dark { color: hsl(120, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40\:dark, html.auto .sf-c-txt-darkseagreen\:40\:dark { color: hsl(120, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:45\:dark, html.auto .sf-c-txt-darkseagreen\:45\:dark { color: hsl(120, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50\:dark, html.auto .sf-c-txt-darkseagreen\:50\:dark { color: hsl(120, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:55\:dark, html.auto .sf-c-txt-darkseagreen\:55\:dark { color: hsl(120, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60\:dark, html.auto .sf-c-txt-darkseagreen\:60\:dark { color: hsl(120, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:65\:dark, html.auto .sf-c-txt-darkseagreen\:65\:dark { color: hsl(120, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70\:dark, html.auto .sf-c-txt-darkseagreen\:70\:dark { color: hsl(120, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:75\:dark, html.auto .sf-c-txt-darkseagreen\:75\:dark { color: hsl(120, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80\:dark, html.auto .sf-c-txt-darkseagreen\:80\:dark { color: hsl(120, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:85\:dark, html.auto .sf-c-txt-darkseagreen\:85\:dark { color: hsl(120, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90\:dark, html.auto .sf-c-txt-darkseagreen\:90\:dark { color: hsl(120, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:95\:dark, html.auto .sf-c-txt-darkseagreen\:95\:dark { color: hsl(120, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100\:dark, html.auto .sf-c-txt-darkseagreen\:100\:dark { color: hsl(120, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:dark, html.var.auto .sf-c-txt-darkseagreen\:dark { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:0\:dark, html.var.auto .sf-c-txt-darkseagreen\:0\:dark { color: hsl(120, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:5\:dark, html.var.auto .sf-c-txt-darkseagreen\:5\:dark { color: hsl(120, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:10\:dark, html.var.auto .sf-c-txt-darkseagreen\:10\:dark { color: hsl(120, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:15\:dark, html.var.auto .sf-c-txt-darkseagreen\:15\:dark { color: hsl(120, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:20\:dark, html.var.auto .sf-c-txt-darkseagreen\:20\:dark { color: hsl(120, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:25\:dark, html.var.auto .sf-c-txt-darkseagreen\:25\:dark { color: hsl(120, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:30\:dark, html.var.auto .sf-c-txt-darkseagreen\:30\:dark { color: hsl(120, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:35\:dark, html.var.auto .sf-c-txt-darkseagreen\:35\:dark { color: hsl(120, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:40\:dark, html.var.auto .sf-c-txt-darkseagreen\:40\:dark { color: hsl(120, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:45\:dark, html.var.auto .sf-c-txt-darkseagreen\:45\:dark { color: hsl(120, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:50\:dark, html.var.auto .sf-c-txt-darkseagreen\:50\:dark { color: hsl(120, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:55\:dark, html.var.auto .sf-c-txt-darkseagreen\:55\:dark { color: hsl(120, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:60\:dark, html.var.auto .sf-c-txt-darkseagreen\:60\:dark { color: hsl(120, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:65\:dark, html.var.auto .sf-c-txt-darkseagreen\:65\:dark { color: hsl(120, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:70\:dark, html.var.auto .sf-c-txt-darkseagreen\:70\:dark { color: hsl(120, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:75\:dark, html.var.auto .sf-c-txt-darkseagreen\:75\:dark { color: hsl(120, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:80\:dark, html.var.auto .sf-c-txt-darkseagreen\:80\:dark { color: hsl(120, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:85\:dark, html.var.auto .sf-c-txt-darkseagreen\:85\:dark { color: hsl(120, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:90\:dark, html.var.auto .sf-c-txt-darkseagreen\:90\:dark { color: hsl(120, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:95\:dark, html.var.auto .sf-c-txt-darkseagreen\:95\:dark { color: hsl(120, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkseagreen\:100\:dark, html.var.auto .sf-c-txt-darkseagreen\:100\:dark { color: hsl(120, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkslateblue.css b/src/colors/20/darkslateblue.css index 4384553..45739aa 100644 --- a/src/colors/20/darkslateblue.css +++ b/src/colors/20/darkslateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslateblue'] { --sf-c-darkslateblue: 248 39% 39%; --sf-c-darkslateblue-0: 248 39% 0%; --sf-c-darkslateblue-5: 248 39% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkslateblue\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslateblue\:95\:dark, html.var.auto .sf-c-darkslateblue\:95\:dark { color: hsl(248, 39%, 95%); background: hsl(248, 39%, 5%) } html.var[data-theme='auto'] .sf-c-darkslateblue\:100\:dark, html.var.auto .sf-c-darkslateblue\:100\:dark { color: hsl(248, 39%, 95%); background: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue, html.auto .sf-c-txt-darkslateblue { color: hsl(248, 39%, 39%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0, html.auto .sf-c-txt-darkslateblue\:0 { color: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:5, html.auto .sf-c-txt-darkslateblue\:5 { color: hsl(248, 39%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10, html.auto .sf-c-txt-darkslateblue\:10 { color: hsl(248, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:15, html.auto .sf-c-txt-darkslateblue\:15 { color: hsl(248, 39%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20, html.auto .sf-c-txt-darkslateblue\:20 { color: hsl(248, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:25, html.auto .sf-c-txt-darkslateblue\:25 { color: hsl(248, 39%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30, html.auto .sf-c-txt-darkslateblue\:30 { color: hsl(248, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:35, html.auto .sf-c-txt-darkslateblue\:35 { color: hsl(248, 39%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40, html.auto .sf-c-txt-darkslateblue\:40 { color: hsl(248, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:45, html.auto .sf-c-txt-darkslateblue\:45 { color: hsl(248, 39%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50, html.auto .sf-c-txt-darkslateblue\:50 { color: hsl(248, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:55, html.auto .sf-c-txt-darkslateblue\:55 { color: hsl(248, 39%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60, html.auto .sf-c-txt-darkslateblue\:60 { color: hsl(248, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:65, html.auto .sf-c-txt-darkslateblue\:65 { color: hsl(248, 39%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70, html.auto .sf-c-txt-darkslateblue\:70 { color: hsl(248, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:75, html.auto .sf-c-txt-darkslateblue\:75 { color: hsl(248, 39%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80, html.auto .sf-c-txt-darkslateblue\:80 { color: hsl(248, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:85, html.auto .sf-c-txt-darkslateblue\:85 { color: hsl(248, 39%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90, html.auto .sf-c-txt-darkslateblue\:90 { color: hsl(248, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:95, html.auto .sf-c-txt-darkslateblue\:95 { color: hsl(248, 39%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100, html.auto .sf-c-txt-darkslateblue\:100 { color: hsl(248, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue, html.var.auto .sf-c-txt-darkslateblue { color: hsl(248, 39%, 39%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0, html.var.auto .sf-c-txt-darkslateblue\:0 { color: hsl(248, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:5, html.var.auto .sf-c-txt-darkslateblue\:5 { color: hsl(248, 39%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10, html.var.auto .sf-c-txt-darkslateblue\:10 { color: hsl(248, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:15, html.var.auto .sf-c-txt-darkslateblue\:15 { color: hsl(248, 39%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20, html.var.auto .sf-c-txt-darkslateblue\:20 { color: hsl(248, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:25, html.var.auto .sf-c-txt-darkslateblue\:25 { color: hsl(248, 39%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30, html.var.auto .sf-c-txt-darkslateblue\:30 { color: hsl(248, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:35, html.var.auto .sf-c-txt-darkslateblue\:35 { color: hsl(248, 39%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40, html.var.auto .sf-c-txt-darkslateblue\:40 { color: hsl(248, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:45, html.var.auto .sf-c-txt-darkslateblue\:45 { color: hsl(248, 39%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50, html.var.auto .sf-c-txt-darkslateblue\:50 { color: hsl(248, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:55, html.var.auto .sf-c-txt-darkslateblue\:55 { color: hsl(248, 39%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60, html.var.auto .sf-c-txt-darkslateblue\:60 { color: hsl(248, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:65, html.var.auto .sf-c-txt-darkslateblue\:65 { color: hsl(248, 39%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70, html.var.auto .sf-c-txt-darkslateblue\:70 { color: hsl(248, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:75, html.var.auto .sf-c-txt-darkslateblue\:75 { color: hsl(248, 39%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80, html.var.auto .sf-c-txt-darkslateblue\:80 { color: hsl(248, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:85, html.var.auto .sf-c-txt-darkslateblue\:85 { color: hsl(248, 39%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90, html.var.auto .sf-c-txt-darkslateblue\:90 { color: hsl(248, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:95, html.var.auto .sf-c-txt-darkslateblue\:95 { color: hsl(248, 39%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100, html.var.auto .sf-c-txt-darkslateblue\:100 { color: hsl(248, 39%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:dark, html.auto .sf-c-txt-darkslateblue\:dark { color: hsl(248, 39%, 39%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0\:dark, html.auto .sf-c-txt-darkslateblue\:0\:dark { color: hsl(248, 39%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:5\:dark, html.auto .sf-c-txt-darkslateblue\:5\:dark { color: hsl(248, 39%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10\:dark, html.auto .sf-c-txt-darkslateblue\:10\:dark { color: hsl(248, 39%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:15\:dark, html.auto .sf-c-txt-darkslateblue\:15\:dark { color: hsl(248, 39%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20\:dark, html.auto .sf-c-txt-darkslateblue\:20\:dark { color: hsl(248, 39%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:25\:dark, html.auto .sf-c-txt-darkslateblue\:25\:dark { color: hsl(248, 39%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30\:dark, html.auto .sf-c-txt-darkslateblue\:30\:dark { color: hsl(248, 39%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:35\:dark, html.auto .sf-c-txt-darkslateblue\:35\:dark { color: hsl(248, 39%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40\:dark, html.auto .sf-c-txt-darkslateblue\:40\:dark { color: hsl(248, 39%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:45\:dark, html.auto .sf-c-txt-darkslateblue\:45\:dark { color: hsl(248, 39%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50\:dark, html.auto .sf-c-txt-darkslateblue\:50\:dark { color: hsl(248, 39%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:55\:dark, html.auto .sf-c-txt-darkslateblue\:55\:dark { color: hsl(248, 39%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60\:dark, html.auto .sf-c-txt-darkslateblue\:60\:dark { color: hsl(248, 39%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:65\:dark, html.auto .sf-c-txt-darkslateblue\:65\:dark { color: hsl(248, 39%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70\:dark, html.auto .sf-c-txt-darkslateblue\:70\:dark { color: hsl(248, 39%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:75\:dark, html.auto .sf-c-txt-darkslateblue\:75\:dark { color: hsl(248, 39%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80\:dark, html.auto .sf-c-txt-darkslateblue\:80\:dark { color: hsl(248, 39%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:85\:dark, html.auto .sf-c-txt-darkslateblue\:85\:dark { color: hsl(248, 39%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90\:dark, html.auto .sf-c-txt-darkslateblue\:90\:dark { color: hsl(248, 39%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:95\:dark, html.auto .sf-c-txt-darkslateblue\:95\:dark { color: hsl(248, 39%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100\:dark, html.auto .sf-c-txt-darkslateblue\:100\:dark { color: hsl(248, 39%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:dark, html.var.auto .sf-c-txt-darkslateblue\:dark { color: hsl(248, 39%, 39%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:0\:dark, html.var.auto .sf-c-txt-darkslateblue\:0\:dark { color: hsl(248, 39%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:5\:dark, html.var.auto .sf-c-txt-darkslateblue\:5\:dark { color: hsl(248, 39%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:10\:dark, html.var.auto .sf-c-txt-darkslateblue\:10\:dark { color: hsl(248, 39%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:15\:dark, html.var.auto .sf-c-txt-darkslateblue\:15\:dark { color: hsl(248, 39%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:20\:dark, html.var.auto .sf-c-txt-darkslateblue\:20\:dark { color: hsl(248, 39%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:25\:dark, html.var.auto .sf-c-txt-darkslateblue\:25\:dark { color: hsl(248, 39%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:30\:dark, html.var.auto .sf-c-txt-darkslateblue\:30\:dark { color: hsl(248, 39%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:35\:dark, html.var.auto .sf-c-txt-darkslateblue\:35\:dark { color: hsl(248, 39%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:40\:dark, html.var.auto .sf-c-txt-darkslateblue\:40\:dark { color: hsl(248, 39%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:45\:dark, html.var.auto .sf-c-txt-darkslateblue\:45\:dark { color: hsl(248, 39%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:50\:dark, html.var.auto .sf-c-txt-darkslateblue\:50\:dark { color: hsl(248, 39%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:55\:dark, html.var.auto .sf-c-txt-darkslateblue\:55\:dark { color: hsl(248, 39%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:60\:dark, html.var.auto .sf-c-txt-darkslateblue\:60\:dark { color: hsl(248, 39%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:65\:dark, html.var.auto .sf-c-txt-darkslateblue\:65\:dark { color: hsl(248, 39%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:70\:dark, html.var.auto .sf-c-txt-darkslateblue\:70\:dark { color: hsl(248, 39%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:75\:dark, html.var.auto .sf-c-txt-darkslateblue\:75\:dark { color: hsl(248, 39%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:80\:dark, html.var.auto .sf-c-txt-darkslateblue\:80\:dark { color: hsl(248, 39%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:85\:dark, html.var.auto .sf-c-txt-darkslateblue\:85\:dark { color: hsl(248, 39%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:90\:dark, html.var.auto .sf-c-txt-darkslateblue\:90\:dark { color: hsl(248, 39%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:95\:dark, html.var.auto .sf-c-txt-darkslateblue\:95\:dark { color: hsl(248, 39%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslateblue\:100\:dark, html.var.auto .sf-c-txt-darkslateblue\:100\:dark { color: hsl(248, 39%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkslategray.css b/src/colors/20/darkslategray.css index 1047286..2c89cbc 100644 --- a/src/colors/20/darkslategray.css +++ b/src/colors/20/darkslategray.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslategray'] { --sf-c-darkslategray: 180 25% 25%; --sf-c-darkslategray-0: 180 25% 0%; --sf-c-darkslategray-5: 180 25% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkslategray\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslategray\:95\:dark, html.var.auto .sf-c-darkslategray\:95\:dark { color: hsl(180, 25%, 95%); background: hsl(180, 25%, 5%) } html.var[data-theme='auto'] .sf-c-darkslategray\:100\:dark, html.var.auto .sf-c-darkslategray\:100\:dark { color: hsl(180, 25%, 95%); background: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray, html.auto .sf-c-txt-darkslategray { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0, html.auto .sf-c-txt-darkslategray\:0 { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:5, html.auto .sf-c-txt-darkslategray\:5 { color: hsl(180, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10, html.auto .sf-c-txt-darkslategray\:10 { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:15, html.auto .sf-c-txt-darkslategray\:15 { color: hsl(180, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20, html.auto .sf-c-txt-darkslategray\:20 { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:25, html.auto .sf-c-txt-darkslategray\:25 { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30, html.auto .sf-c-txt-darkslategray\:30 { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:35, html.auto .sf-c-txt-darkslategray\:35 { color: hsl(180, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40, html.auto .sf-c-txt-darkslategray\:40 { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:45, html.auto .sf-c-txt-darkslategray\:45 { color: hsl(180, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50, html.auto .sf-c-txt-darkslategray\:50 { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:55, html.auto .sf-c-txt-darkslategray\:55 { color: hsl(180, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60, html.auto .sf-c-txt-darkslategray\:60 { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:65, html.auto .sf-c-txt-darkslategray\:65 { color: hsl(180, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70, html.auto .sf-c-txt-darkslategray\:70 { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:75, html.auto .sf-c-txt-darkslategray\:75 { color: hsl(180, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80, html.auto .sf-c-txt-darkslategray\:80 { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:85, html.auto .sf-c-txt-darkslategray\:85 { color: hsl(180, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90, html.auto .sf-c-txt-darkslategray\:90 { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:95, html.auto .sf-c-txt-darkslategray\:95 { color: hsl(180, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100, html.auto .sf-c-txt-darkslategray\:100 { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray, html.var.auto .sf-c-txt-darkslategray { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0, html.var.auto .sf-c-txt-darkslategray\:0 { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:5, html.var.auto .sf-c-txt-darkslategray\:5 { color: hsl(180, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10, html.var.auto .sf-c-txt-darkslategray\:10 { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:15, html.var.auto .sf-c-txt-darkslategray\:15 { color: hsl(180, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20, html.var.auto .sf-c-txt-darkslategray\:20 { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:25, html.var.auto .sf-c-txt-darkslategray\:25 { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30, html.var.auto .sf-c-txt-darkslategray\:30 { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:35, html.var.auto .sf-c-txt-darkslategray\:35 { color: hsl(180, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40, html.var.auto .sf-c-txt-darkslategray\:40 { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:45, html.var.auto .sf-c-txt-darkslategray\:45 { color: hsl(180, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50, html.var.auto .sf-c-txt-darkslategray\:50 { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:55, html.var.auto .sf-c-txt-darkslategray\:55 { color: hsl(180, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60, html.var.auto .sf-c-txt-darkslategray\:60 { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:65, html.var.auto .sf-c-txt-darkslategray\:65 { color: hsl(180, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70, html.var.auto .sf-c-txt-darkslategray\:70 { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:75, html.var.auto .sf-c-txt-darkslategray\:75 { color: hsl(180, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80, html.var.auto .sf-c-txt-darkslategray\:80 { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:85, html.var.auto .sf-c-txt-darkslategray\:85 { color: hsl(180, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90, html.var.auto .sf-c-txt-darkslategray\:90 { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:95, html.var.auto .sf-c-txt-darkslategray\:95 { color: hsl(180, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100, html.var.auto .sf-c-txt-darkslategray\:100 { color: hsl(180, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:dark, html.auto .sf-c-txt-darkslategray\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0\:dark, html.auto .sf-c-txt-darkslategray\:0\:dark { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:5\:dark, html.auto .sf-c-txt-darkslategray\:5\:dark { color: hsl(180, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10\:dark, html.auto .sf-c-txt-darkslategray\:10\:dark { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:15\:dark, html.auto .sf-c-txt-darkslategray\:15\:dark { color: hsl(180, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20\:dark, html.auto .sf-c-txt-darkslategray\:20\:dark { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:25\:dark, html.auto .sf-c-txt-darkslategray\:25\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30\:dark, html.auto .sf-c-txt-darkslategray\:30\:dark { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:35\:dark, html.auto .sf-c-txt-darkslategray\:35\:dark { color: hsl(180, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40\:dark, html.auto .sf-c-txt-darkslategray\:40\:dark { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:45\:dark, html.auto .sf-c-txt-darkslategray\:45\:dark { color: hsl(180, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50\:dark, html.auto .sf-c-txt-darkslategray\:50\:dark { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:55\:dark, html.auto .sf-c-txt-darkslategray\:55\:dark { color: hsl(180, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60\:dark, html.auto .sf-c-txt-darkslategray\:60\:dark { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:65\:dark, html.auto .sf-c-txt-darkslategray\:65\:dark { color: hsl(180, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70\:dark, html.auto .sf-c-txt-darkslategray\:70\:dark { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:75\:dark, html.auto .sf-c-txt-darkslategray\:75\:dark { color: hsl(180, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80\:dark, html.auto .sf-c-txt-darkslategray\:80\:dark { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:85\:dark, html.auto .sf-c-txt-darkslategray\:85\:dark { color: hsl(180, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90\:dark, html.auto .sf-c-txt-darkslategray\:90\:dark { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:95\:dark, html.auto .sf-c-txt-darkslategray\:95\:dark { color: hsl(180, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100\:dark, html.auto .sf-c-txt-darkslategray\:100\:dark { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:dark, html.var.auto .sf-c-txt-darkslategray\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:0\:dark, html.var.auto .sf-c-txt-darkslategray\:0\:dark { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:5\:dark, html.var.auto .sf-c-txt-darkslategray\:5\:dark { color: hsl(180, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:10\:dark, html.var.auto .sf-c-txt-darkslategray\:10\:dark { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:15\:dark, html.var.auto .sf-c-txt-darkslategray\:15\:dark { color: hsl(180, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:20\:dark, html.var.auto .sf-c-txt-darkslategray\:20\:dark { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:25\:dark, html.var.auto .sf-c-txt-darkslategray\:25\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:30\:dark, html.var.auto .sf-c-txt-darkslategray\:30\:dark { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:35\:dark, html.var.auto .sf-c-txt-darkslategray\:35\:dark { color: hsl(180, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:40\:dark, html.var.auto .sf-c-txt-darkslategray\:40\:dark { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:45\:dark, html.var.auto .sf-c-txt-darkslategray\:45\:dark { color: hsl(180, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:50\:dark, html.var.auto .sf-c-txt-darkslategray\:50\:dark { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:55\:dark, html.var.auto .sf-c-txt-darkslategray\:55\:dark { color: hsl(180, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:60\:dark, html.var.auto .sf-c-txt-darkslategray\:60\:dark { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:65\:dark, html.var.auto .sf-c-txt-darkslategray\:65\:dark { color: hsl(180, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:70\:dark, html.var.auto .sf-c-txt-darkslategray\:70\:dark { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:75\:dark, html.var.auto .sf-c-txt-darkslategray\:75\:dark { color: hsl(180, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:80\:dark, html.var.auto .sf-c-txt-darkslategray\:80\:dark { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:85\:dark, html.var.auto .sf-c-txt-darkslategray\:85\:dark { color: hsl(180, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:90\:dark, html.var.auto .sf-c-txt-darkslategray\:90\:dark { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:95\:dark, html.var.auto .sf-c-txt-darkslategray\:95\:dark { color: hsl(180, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategray\:100\:dark, html.var.auto .sf-c-txt-darkslategray\:100\:dark { color: hsl(180, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkslategrey.css b/src/colors/20/darkslategrey.css index bbd437d..0467a35 100644 --- a/src/colors/20/darkslategrey.css +++ b/src/colors/20/darkslategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='darkslategrey'] { --sf-c-darkslategrey: 180 25% 25%; --sf-c-darkslategrey-0: 180 25% 0%; --sf-c-darkslategrey-5: 180 25% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkslategrey\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkslategrey\:95\:dark, html.var.auto .sf-c-darkslategrey\:95\:dark { color: hsl(180, 25%, 95%); background: hsl(180, 25%, 5%) } html.var[data-theme='auto'] .sf-c-darkslategrey\:100\:dark, html.var.auto .sf-c-darkslategrey\:100\:dark { color: hsl(180, 25%, 95%); background: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey, html.auto .sf-c-txt-darkslategrey { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0, html.auto .sf-c-txt-darkslategrey\:0 { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:5, html.auto .sf-c-txt-darkslategrey\:5 { color: hsl(180, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10, html.auto .sf-c-txt-darkslategrey\:10 { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:15, html.auto .sf-c-txt-darkslategrey\:15 { color: hsl(180, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20, html.auto .sf-c-txt-darkslategrey\:20 { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:25, html.auto .sf-c-txt-darkslategrey\:25 { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30, html.auto .sf-c-txt-darkslategrey\:30 { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:35, html.auto .sf-c-txt-darkslategrey\:35 { color: hsl(180, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40, html.auto .sf-c-txt-darkslategrey\:40 { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:45, html.auto .sf-c-txt-darkslategrey\:45 { color: hsl(180, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50, html.auto .sf-c-txt-darkslategrey\:50 { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:55, html.auto .sf-c-txt-darkslategrey\:55 { color: hsl(180, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60, html.auto .sf-c-txt-darkslategrey\:60 { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:65, html.auto .sf-c-txt-darkslategrey\:65 { color: hsl(180, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70, html.auto .sf-c-txt-darkslategrey\:70 { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:75, html.auto .sf-c-txt-darkslategrey\:75 { color: hsl(180, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80, html.auto .sf-c-txt-darkslategrey\:80 { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:85, html.auto .sf-c-txt-darkslategrey\:85 { color: hsl(180, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90, html.auto .sf-c-txt-darkslategrey\:90 { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:95, html.auto .sf-c-txt-darkslategrey\:95 { color: hsl(180, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100, html.auto .sf-c-txt-darkslategrey\:100 { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey, html.var.auto .sf-c-txt-darkslategrey { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0, html.var.auto .sf-c-txt-darkslategrey\:0 { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:5, html.var.auto .sf-c-txt-darkslategrey\:5 { color: hsl(180, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10, html.var.auto .sf-c-txt-darkslategrey\:10 { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:15, html.var.auto .sf-c-txt-darkslategrey\:15 { color: hsl(180, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20, html.var.auto .sf-c-txt-darkslategrey\:20 { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:25, html.var.auto .sf-c-txt-darkslategrey\:25 { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30, html.var.auto .sf-c-txt-darkslategrey\:30 { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:35, html.var.auto .sf-c-txt-darkslategrey\:35 { color: hsl(180, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40, html.var.auto .sf-c-txt-darkslategrey\:40 { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:45, html.var.auto .sf-c-txt-darkslategrey\:45 { color: hsl(180, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50, html.var.auto .sf-c-txt-darkslategrey\:50 { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:55, html.var.auto .sf-c-txt-darkslategrey\:55 { color: hsl(180, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60, html.var.auto .sf-c-txt-darkslategrey\:60 { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:65, html.var.auto .sf-c-txt-darkslategrey\:65 { color: hsl(180, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70, html.var.auto .sf-c-txt-darkslategrey\:70 { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:75, html.var.auto .sf-c-txt-darkslategrey\:75 { color: hsl(180, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80, html.var.auto .sf-c-txt-darkslategrey\:80 { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:85, html.var.auto .sf-c-txt-darkslategrey\:85 { color: hsl(180, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90, html.var.auto .sf-c-txt-darkslategrey\:90 { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:95, html.var.auto .sf-c-txt-darkslategrey\:95 { color: hsl(180, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100, html.var.auto .sf-c-txt-darkslategrey\:100 { color: hsl(180, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:dark, html.auto .sf-c-txt-darkslategrey\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0\:dark, html.auto .sf-c-txt-darkslategrey\:0\:dark { color: hsl(180, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:5\:dark, html.auto .sf-c-txt-darkslategrey\:5\:dark { color: hsl(180, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10\:dark, html.auto .sf-c-txt-darkslategrey\:10\:dark { color: hsl(180, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:15\:dark, html.auto .sf-c-txt-darkslategrey\:15\:dark { color: hsl(180, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20\:dark, html.auto .sf-c-txt-darkslategrey\:20\:dark { color: hsl(180, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:25\:dark, html.auto .sf-c-txt-darkslategrey\:25\:dark { color: hsl(180, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30\:dark, html.auto .sf-c-txt-darkslategrey\:30\:dark { color: hsl(180, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:35\:dark, html.auto .sf-c-txt-darkslategrey\:35\:dark { color: hsl(180, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40\:dark, html.auto .sf-c-txt-darkslategrey\:40\:dark { color: hsl(180, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:45\:dark, html.auto .sf-c-txt-darkslategrey\:45\:dark { color: hsl(180, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50\:dark, html.auto .sf-c-txt-darkslategrey\:50\:dark { color: hsl(180, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:55\:dark, html.auto .sf-c-txt-darkslategrey\:55\:dark { color: hsl(180, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60\:dark, html.auto .sf-c-txt-darkslategrey\:60\:dark { color: hsl(180, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:65\:dark, html.auto .sf-c-txt-darkslategrey\:65\:dark { color: hsl(180, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70\:dark, html.auto .sf-c-txt-darkslategrey\:70\:dark { color: hsl(180, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:75\:dark, html.auto .sf-c-txt-darkslategrey\:75\:dark { color: hsl(180, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80\:dark, html.auto .sf-c-txt-darkslategrey\:80\:dark { color: hsl(180, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:85\:dark, html.auto .sf-c-txt-darkslategrey\:85\:dark { color: hsl(180, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90\:dark, html.auto .sf-c-txt-darkslategrey\:90\:dark { color: hsl(180, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:95\:dark, html.auto .sf-c-txt-darkslategrey\:95\:dark { color: hsl(180, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100\:dark, html.auto .sf-c-txt-darkslategrey\:100\:dark { color: hsl(180, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:dark, html.var.auto .sf-c-txt-darkslategrey\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:0\:dark, html.var.auto .sf-c-txt-darkslategrey\:0\:dark { color: hsl(180, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:5\:dark, html.var.auto .sf-c-txt-darkslategrey\:5\:dark { color: hsl(180, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:10\:dark, html.var.auto .sf-c-txt-darkslategrey\:10\:dark { color: hsl(180, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:15\:dark, html.var.auto .sf-c-txt-darkslategrey\:15\:dark { color: hsl(180, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:20\:dark, html.var.auto .sf-c-txt-darkslategrey\:20\:dark { color: hsl(180, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:25\:dark, html.var.auto .sf-c-txt-darkslategrey\:25\:dark { color: hsl(180, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:30\:dark, html.var.auto .sf-c-txt-darkslategrey\:30\:dark { color: hsl(180, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:35\:dark, html.var.auto .sf-c-txt-darkslategrey\:35\:dark { color: hsl(180, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:40\:dark, html.var.auto .sf-c-txt-darkslategrey\:40\:dark { color: hsl(180, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:45\:dark, html.var.auto .sf-c-txt-darkslategrey\:45\:dark { color: hsl(180, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:50\:dark, html.var.auto .sf-c-txt-darkslategrey\:50\:dark { color: hsl(180, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:55\:dark, html.var.auto .sf-c-txt-darkslategrey\:55\:dark { color: hsl(180, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:60\:dark, html.var.auto .sf-c-txt-darkslategrey\:60\:dark { color: hsl(180, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:65\:dark, html.var.auto .sf-c-txt-darkslategrey\:65\:dark { color: hsl(180, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:70\:dark, html.var.auto .sf-c-txt-darkslategrey\:70\:dark { color: hsl(180, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:75\:dark, html.var.auto .sf-c-txt-darkslategrey\:75\:dark { color: hsl(180, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:80\:dark, html.var.auto .sf-c-txt-darkslategrey\:80\:dark { color: hsl(180, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:85\:dark, html.var.auto .sf-c-txt-darkslategrey\:85\:dark { color: hsl(180, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:90\:dark, html.var.auto .sf-c-txt-darkslategrey\:90\:dark { color: hsl(180, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:95\:dark, html.var.auto .sf-c-txt-darkslategrey\:95\:dark { color: hsl(180, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkslategrey\:100\:dark, html.var.auto .sf-c-txt-darkslategrey\:100\:dark { color: hsl(180, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkturquoise.css b/src/colors/20/darkturquoise.css index a2fd28b..cafe0b2 100644 --- a/src/colors/20/darkturquoise.css +++ b/src/colors/20/darkturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='darkturquoise'] { --sf-c-darkturquoise: 181 100% 41%; --sf-c-darkturquoise-0: 181 100% 0%; --sf-c-darkturquoise-5: 181 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkturquoise\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-darkturquoise\:95\:dark, html.var.auto .sf-c-darkturquoise\:95\:dark { color: hsl(181, 100%, 95%); background: hsl(181, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkturquoise\:100\:dark, html.var.auto .sf-c-darkturquoise\:100\:dark { color: hsl(181, 100%, 95%); background: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise, html.auto .sf-c-txt-darkturquoise { color: hsl(181, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0, html.auto .sf-c-txt-darkturquoise\:0 { color: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:5, html.auto .sf-c-txt-darkturquoise\:5 { color: hsl(181, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10, html.auto .sf-c-txt-darkturquoise\:10 { color: hsl(181, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:15, html.auto .sf-c-txt-darkturquoise\:15 { color: hsl(181, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20, html.auto .sf-c-txt-darkturquoise\:20 { color: hsl(181, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:25, html.auto .sf-c-txt-darkturquoise\:25 { color: hsl(181, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30, html.auto .sf-c-txt-darkturquoise\:30 { color: hsl(181, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:35, html.auto .sf-c-txt-darkturquoise\:35 { color: hsl(181, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40, html.auto .sf-c-txt-darkturquoise\:40 { color: hsl(181, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:45, html.auto .sf-c-txt-darkturquoise\:45 { color: hsl(181, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50, html.auto .sf-c-txt-darkturquoise\:50 { color: hsl(181, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:55, html.auto .sf-c-txt-darkturquoise\:55 { color: hsl(181, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60, html.auto .sf-c-txt-darkturquoise\:60 { color: hsl(181, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:65, html.auto .sf-c-txt-darkturquoise\:65 { color: hsl(181, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70, html.auto .sf-c-txt-darkturquoise\:70 { color: hsl(181, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:75, html.auto .sf-c-txt-darkturquoise\:75 { color: hsl(181, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80, html.auto .sf-c-txt-darkturquoise\:80 { color: hsl(181, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:85, html.auto .sf-c-txt-darkturquoise\:85 { color: hsl(181, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90, html.auto .sf-c-txt-darkturquoise\:90 { color: hsl(181, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:95, html.auto .sf-c-txt-darkturquoise\:95 { color: hsl(181, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100, html.auto .sf-c-txt-darkturquoise\:100 { color: hsl(181, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise, html.var.auto .sf-c-txt-darkturquoise { color: hsl(181, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0, html.var.auto .sf-c-txt-darkturquoise\:0 { color: hsl(181, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:5, html.var.auto .sf-c-txt-darkturquoise\:5 { color: hsl(181, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10, html.var.auto .sf-c-txt-darkturquoise\:10 { color: hsl(181, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:15, html.var.auto .sf-c-txt-darkturquoise\:15 { color: hsl(181, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20, html.var.auto .sf-c-txt-darkturquoise\:20 { color: hsl(181, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:25, html.var.auto .sf-c-txt-darkturquoise\:25 { color: hsl(181, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30, html.var.auto .sf-c-txt-darkturquoise\:30 { color: hsl(181, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:35, html.var.auto .sf-c-txt-darkturquoise\:35 { color: hsl(181, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40, html.var.auto .sf-c-txt-darkturquoise\:40 { color: hsl(181, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:45, html.var.auto .sf-c-txt-darkturquoise\:45 { color: hsl(181, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50, html.var.auto .sf-c-txt-darkturquoise\:50 { color: hsl(181, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:55, html.var.auto .sf-c-txt-darkturquoise\:55 { color: hsl(181, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60, html.var.auto .sf-c-txt-darkturquoise\:60 { color: hsl(181, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:65, html.var.auto .sf-c-txt-darkturquoise\:65 { color: hsl(181, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70, html.var.auto .sf-c-txt-darkturquoise\:70 { color: hsl(181, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:75, html.var.auto .sf-c-txt-darkturquoise\:75 { color: hsl(181, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80, html.var.auto .sf-c-txt-darkturquoise\:80 { color: hsl(181, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:85, html.var.auto .sf-c-txt-darkturquoise\:85 { color: hsl(181, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90, html.var.auto .sf-c-txt-darkturquoise\:90 { color: hsl(181, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:95, html.var.auto .sf-c-txt-darkturquoise\:95 { color: hsl(181, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100, html.var.auto .sf-c-txt-darkturquoise\:100 { color: hsl(181, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:dark, html.auto .sf-c-txt-darkturquoise\:dark { color: hsl(181, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0\:dark, html.auto .sf-c-txt-darkturquoise\:0\:dark { color: hsl(181, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:5\:dark, html.auto .sf-c-txt-darkturquoise\:5\:dark { color: hsl(181, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10\:dark, html.auto .sf-c-txt-darkturquoise\:10\:dark { color: hsl(181, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:15\:dark, html.auto .sf-c-txt-darkturquoise\:15\:dark { color: hsl(181, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20\:dark, html.auto .sf-c-txt-darkturquoise\:20\:dark { color: hsl(181, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:25\:dark, html.auto .sf-c-txt-darkturquoise\:25\:dark { color: hsl(181, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30\:dark, html.auto .sf-c-txt-darkturquoise\:30\:dark { color: hsl(181, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:35\:dark, html.auto .sf-c-txt-darkturquoise\:35\:dark { color: hsl(181, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40\:dark, html.auto .sf-c-txt-darkturquoise\:40\:dark { color: hsl(181, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:45\:dark, html.auto .sf-c-txt-darkturquoise\:45\:dark { color: hsl(181, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50\:dark, html.auto .sf-c-txt-darkturquoise\:50\:dark { color: hsl(181, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:55\:dark, html.auto .sf-c-txt-darkturquoise\:55\:dark { color: hsl(181, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60\:dark, html.auto .sf-c-txt-darkturquoise\:60\:dark { color: hsl(181, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:65\:dark, html.auto .sf-c-txt-darkturquoise\:65\:dark { color: hsl(181, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70\:dark, html.auto .sf-c-txt-darkturquoise\:70\:dark { color: hsl(181, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:75\:dark, html.auto .sf-c-txt-darkturquoise\:75\:dark { color: hsl(181, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80\:dark, html.auto .sf-c-txt-darkturquoise\:80\:dark { color: hsl(181, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:85\:dark, html.auto .sf-c-txt-darkturquoise\:85\:dark { color: hsl(181, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90\:dark, html.auto .sf-c-txt-darkturquoise\:90\:dark { color: hsl(181, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:95\:dark, html.auto .sf-c-txt-darkturquoise\:95\:dark { color: hsl(181, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100\:dark, html.auto .sf-c-txt-darkturquoise\:100\:dark { color: hsl(181, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:dark, html.var.auto .sf-c-txt-darkturquoise\:dark { color: hsl(181, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:0\:dark, html.var.auto .sf-c-txt-darkturquoise\:0\:dark { color: hsl(181, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:5\:dark, html.var.auto .sf-c-txt-darkturquoise\:5\:dark { color: hsl(181, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:10\:dark, html.var.auto .sf-c-txt-darkturquoise\:10\:dark { color: hsl(181, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:15\:dark, html.var.auto .sf-c-txt-darkturquoise\:15\:dark { color: hsl(181, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:20\:dark, html.var.auto .sf-c-txt-darkturquoise\:20\:dark { color: hsl(181, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:25\:dark, html.var.auto .sf-c-txt-darkturquoise\:25\:dark { color: hsl(181, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:30\:dark, html.var.auto .sf-c-txt-darkturquoise\:30\:dark { color: hsl(181, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:35\:dark, html.var.auto .sf-c-txt-darkturquoise\:35\:dark { color: hsl(181, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:40\:dark, html.var.auto .sf-c-txt-darkturquoise\:40\:dark { color: hsl(181, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:45\:dark, html.var.auto .sf-c-txt-darkturquoise\:45\:dark { color: hsl(181, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:50\:dark, html.var.auto .sf-c-txt-darkturquoise\:50\:dark { color: hsl(181, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:55\:dark, html.var.auto .sf-c-txt-darkturquoise\:55\:dark { color: hsl(181, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:60\:dark, html.var.auto .sf-c-txt-darkturquoise\:60\:dark { color: hsl(181, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:65\:dark, html.var.auto .sf-c-txt-darkturquoise\:65\:dark { color: hsl(181, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:70\:dark, html.var.auto .sf-c-txt-darkturquoise\:70\:dark { color: hsl(181, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:75\:dark, html.var.auto .sf-c-txt-darkturquoise\:75\:dark { color: hsl(181, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:80\:dark, html.var.auto .sf-c-txt-darkturquoise\:80\:dark { color: hsl(181, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:85\:dark, html.var.auto .sf-c-txt-darkturquoise\:85\:dark { color: hsl(181, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:90\:dark, html.var.auto .sf-c-txt-darkturquoise\:90\:dark { color: hsl(181, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:95\:dark, html.var.auto .sf-c-txt-darkturquoise\:95\:dark { color: hsl(181, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkturquoise\:100\:dark, html.var.auto .sf-c-txt-darkturquoise\:100\:dark { color: hsl(181, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/darkviolet.css b/src/colors/20/darkviolet.css index 4997704..4a92815 100644 --- a/src/colors/20/darkviolet.css +++ b/src/colors/20/darkviolet.css @@ -1,4 +1,4 @@ -:root { +[class*='darkviolet'] { --sf-c-darkviolet: 282 100% 41%; --sf-c-darkviolet-0: 282 100% 0%; --sf-c-darkviolet-5: 282 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-darkviolet\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-darkviolet\:95\:dark, html.var.auto .sf-c-darkviolet\:95\:dark { color: hsl(282, 100%, 95%); background: hsl(282, 100%, 5%) } html.var[data-theme='auto'] .sf-c-darkviolet\:100\:dark, html.var.auto .sf-c-darkviolet\:100\:dark { color: hsl(282, 100%, 95%); background: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet, html.auto .sf-c-txt-darkviolet { color: hsl(282, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0, html.auto .sf-c-txt-darkviolet\:0 { color: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:5, html.auto .sf-c-txt-darkviolet\:5 { color: hsl(282, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10, html.auto .sf-c-txt-darkviolet\:10 { color: hsl(282, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:15, html.auto .sf-c-txt-darkviolet\:15 { color: hsl(282, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20, html.auto .sf-c-txt-darkviolet\:20 { color: hsl(282, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:25, html.auto .sf-c-txt-darkviolet\:25 { color: hsl(282, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30, html.auto .sf-c-txt-darkviolet\:30 { color: hsl(282, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:35, html.auto .sf-c-txt-darkviolet\:35 { color: hsl(282, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40, html.auto .sf-c-txt-darkviolet\:40 { color: hsl(282, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:45, html.auto .sf-c-txt-darkviolet\:45 { color: hsl(282, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50, html.auto .sf-c-txt-darkviolet\:50 { color: hsl(282, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:55, html.auto .sf-c-txt-darkviolet\:55 { color: hsl(282, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60, html.auto .sf-c-txt-darkviolet\:60 { color: hsl(282, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:65, html.auto .sf-c-txt-darkviolet\:65 { color: hsl(282, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70, html.auto .sf-c-txt-darkviolet\:70 { color: hsl(282, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:75, html.auto .sf-c-txt-darkviolet\:75 { color: hsl(282, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80, html.auto .sf-c-txt-darkviolet\:80 { color: hsl(282, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:85, html.auto .sf-c-txt-darkviolet\:85 { color: hsl(282, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90, html.auto .sf-c-txt-darkviolet\:90 { color: hsl(282, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:95, html.auto .sf-c-txt-darkviolet\:95 { color: hsl(282, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100, html.auto .sf-c-txt-darkviolet\:100 { color: hsl(282, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet, html.var.auto .sf-c-txt-darkviolet { color: hsl(282, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0, html.var.auto .sf-c-txt-darkviolet\:0 { color: hsl(282, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:5, html.var.auto .sf-c-txt-darkviolet\:5 { color: hsl(282, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10, html.var.auto .sf-c-txt-darkviolet\:10 { color: hsl(282, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:15, html.var.auto .sf-c-txt-darkviolet\:15 { color: hsl(282, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20, html.var.auto .sf-c-txt-darkviolet\:20 { color: hsl(282, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:25, html.var.auto .sf-c-txt-darkviolet\:25 { color: hsl(282, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30, html.var.auto .sf-c-txt-darkviolet\:30 { color: hsl(282, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:35, html.var.auto .sf-c-txt-darkviolet\:35 { color: hsl(282, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40, html.var.auto .sf-c-txt-darkviolet\:40 { color: hsl(282, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:45, html.var.auto .sf-c-txt-darkviolet\:45 { color: hsl(282, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50, html.var.auto .sf-c-txt-darkviolet\:50 { color: hsl(282, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:55, html.var.auto .sf-c-txt-darkviolet\:55 { color: hsl(282, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60, html.var.auto .sf-c-txt-darkviolet\:60 { color: hsl(282, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:65, html.var.auto .sf-c-txt-darkviolet\:65 { color: hsl(282, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70, html.var.auto .sf-c-txt-darkviolet\:70 { color: hsl(282, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:75, html.var.auto .sf-c-txt-darkviolet\:75 { color: hsl(282, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80, html.var.auto .sf-c-txt-darkviolet\:80 { color: hsl(282, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:85, html.var.auto .sf-c-txt-darkviolet\:85 { color: hsl(282, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90, html.var.auto .sf-c-txt-darkviolet\:90 { color: hsl(282, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:95, html.var.auto .sf-c-txt-darkviolet\:95 { color: hsl(282, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100, html.var.auto .sf-c-txt-darkviolet\:100 { color: hsl(282, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:dark, html.auto .sf-c-txt-darkviolet\:dark { color: hsl(282, 100%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0\:dark, html.auto .sf-c-txt-darkviolet\:0\:dark { color: hsl(282, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:5\:dark, html.auto .sf-c-txt-darkviolet\:5\:dark { color: hsl(282, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10\:dark, html.auto .sf-c-txt-darkviolet\:10\:dark { color: hsl(282, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:15\:dark, html.auto .sf-c-txt-darkviolet\:15\:dark { color: hsl(282, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20\:dark, html.auto .sf-c-txt-darkviolet\:20\:dark { color: hsl(282, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:25\:dark, html.auto .sf-c-txt-darkviolet\:25\:dark { color: hsl(282, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30\:dark, html.auto .sf-c-txt-darkviolet\:30\:dark { color: hsl(282, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:35\:dark, html.auto .sf-c-txt-darkviolet\:35\:dark { color: hsl(282, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40\:dark, html.auto .sf-c-txt-darkviolet\:40\:dark { color: hsl(282, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:45\:dark, html.auto .sf-c-txt-darkviolet\:45\:dark { color: hsl(282, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50\:dark, html.auto .sf-c-txt-darkviolet\:50\:dark { color: hsl(282, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:55\:dark, html.auto .sf-c-txt-darkviolet\:55\:dark { color: hsl(282, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60\:dark, html.auto .sf-c-txt-darkviolet\:60\:dark { color: hsl(282, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:65\:dark, html.auto .sf-c-txt-darkviolet\:65\:dark { color: hsl(282, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70\:dark, html.auto .sf-c-txt-darkviolet\:70\:dark { color: hsl(282, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:75\:dark, html.auto .sf-c-txt-darkviolet\:75\:dark { color: hsl(282, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80\:dark, html.auto .sf-c-txt-darkviolet\:80\:dark { color: hsl(282, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:85\:dark, html.auto .sf-c-txt-darkviolet\:85\:dark { color: hsl(282, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90\:dark, html.auto .sf-c-txt-darkviolet\:90\:dark { color: hsl(282, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:95\:dark, html.auto .sf-c-txt-darkviolet\:95\:dark { color: hsl(282, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100\:dark, html.auto .sf-c-txt-darkviolet\:100\:dark { color: hsl(282, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:dark, html.var.auto .sf-c-txt-darkviolet\:dark { color: hsl(282, 100%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:0\:dark, html.var.auto .sf-c-txt-darkviolet\:0\:dark { color: hsl(282, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:5\:dark, html.var.auto .sf-c-txt-darkviolet\:5\:dark { color: hsl(282, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:10\:dark, html.var.auto .sf-c-txt-darkviolet\:10\:dark { color: hsl(282, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:15\:dark, html.var.auto .sf-c-txt-darkviolet\:15\:dark { color: hsl(282, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:20\:dark, html.var.auto .sf-c-txt-darkviolet\:20\:dark { color: hsl(282, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:25\:dark, html.var.auto .sf-c-txt-darkviolet\:25\:dark { color: hsl(282, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:30\:dark, html.var.auto .sf-c-txt-darkviolet\:30\:dark { color: hsl(282, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:35\:dark, html.var.auto .sf-c-txt-darkviolet\:35\:dark { color: hsl(282, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:40\:dark, html.var.auto .sf-c-txt-darkviolet\:40\:dark { color: hsl(282, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:45\:dark, html.var.auto .sf-c-txt-darkviolet\:45\:dark { color: hsl(282, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:50\:dark, html.var.auto .sf-c-txt-darkviolet\:50\:dark { color: hsl(282, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:55\:dark, html.var.auto .sf-c-txt-darkviolet\:55\:dark { color: hsl(282, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:60\:dark, html.var.auto .sf-c-txt-darkviolet\:60\:dark { color: hsl(282, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:65\:dark, html.var.auto .sf-c-txt-darkviolet\:65\:dark { color: hsl(282, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:70\:dark, html.var.auto .sf-c-txt-darkviolet\:70\:dark { color: hsl(282, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:75\:dark, html.var.auto .sf-c-txt-darkviolet\:75\:dark { color: hsl(282, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:80\:dark, html.var.auto .sf-c-txt-darkviolet\:80\:dark { color: hsl(282, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:85\:dark, html.var.auto .sf-c-txt-darkviolet\:85\:dark { color: hsl(282, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:90\:dark, html.var.auto .sf-c-txt-darkviolet\:90\:dark { color: hsl(282, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:95\:dark, html.var.auto .sf-c-txt-darkviolet\:95\:dark { color: hsl(282, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-darkviolet\:100\:dark, html.var.auto .sf-c-txt-darkviolet\:100\:dark { color: hsl(282, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/deeppink.css b/src/colors/20/deeppink.css index 6629659..ae0f80c 100644 --- a/src/colors/20/deeppink.css +++ b/src/colors/20/deeppink.css @@ -1,4 +1,4 @@ -:root { +[class*='deeppink'] { --sf-c-deeppink: 328 100% 54%; --sf-c-deeppink-0: 328 100% 0%; --sf-c-deeppink-5: 328 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-deeppink\:100\:dark, html.dark .sf-c-txt-d html.var[data-theme='auto'] .sf-c-deeppink\:95\:dark, html.var.auto .sf-c-deeppink\:95\:dark { color: hsl(328, 100%, 95%); background: hsl(328, 100%, 5%) } html.var[data-theme='auto'] .sf-c-deeppink\:100\:dark, html.var.auto .sf-c-deeppink\:100\:dark { color: hsl(328, 100%, 95%); background: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink, html.auto .sf-c-txt-deeppink { color: hsl(328, 100%, 54%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:0, html.auto .sf-c-txt-deeppink\:0 { color: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:5, html.auto .sf-c-txt-deeppink\:5 { color: hsl(328, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:10, html.auto .sf-c-txt-deeppink\:10 { color: hsl(328, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:15, html.auto .sf-c-txt-deeppink\:15 { color: hsl(328, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:20, html.auto .sf-c-txt-deeppink\:20 { color: hsl(328, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:25, html.auto .sf-c-txt-deeppink\:25 { color: hsl(328, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:30, html.auto .sf-c-txt-deeppink\:30 { color: hsl(328, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:35, html.auto .sf-c-txt-deeppink\:35 { color: hsl(328, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:40, html.auto .sf-c-txt-deeppink\:40 { color: hsl(328, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:45, html.auto .sf-c-txt-deeppink\:45 { color: hsl(328, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:50, html.auto .sf-c-txt-deeppink\:50 { color: hsl(328, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:55, html.auto .sf-c-txt-deeppink\:55 { color: hsl(328, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:60, html.auto .sf-c-txt-deeppink\:60 { color: hsl(328, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:65, html.auto .sf-c-txt-deeppink\:65 { color: hsl(328, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:70, html.auto .sf-c-txt-deeppink\:70 { color: hsl(328, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:75, html.auto .sf-c-txt-deeppink\:75 { color: hsl(328, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:80, html.auto .sf-c-txt-deeppink\:80 { color: hsl(328, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:85, html.auto .sf-c-txt-deeppink\:85 { color: hsl(328, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:90, html.auto .sf-c-txt-deeppink\:90 { color: hsl(328, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:95, html.auto .sf-c-txt-deeppink\:95 { color: hsl(328, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:100, html.auto .sf-c-txt-deeppink\:100 { color: hsl(328, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink, html.var.auto .sf-c-txt-deeppink { color: hsl(328, 100%, 54%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:0, html.var.auto .sf-c-txt-deeppink\:0 { color: hsl(328, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:5, html.var.auto .sf-c-txt-deeppink\:5 { color: hsl(328, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:10, html.var.auto .sf-c-txt-deeppink\:10 { color: hsl(328, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:15, html.var.auto .sf-c-txt-deeppink\:15 { color: hsl(328, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:20, html.var.auto .sf-c-txt-deeppink\:20 { color: hsl(328, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:25, html.var.auto .sf-c-txt-deeppink\:25 { color: hsl(328, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:30, html.var.auto .sf-c-txt-deeppink\:30 { color: hsl(328, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:35, html.var.auto .sf-c-txt-deeppink\:35 { color: hsl(328, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:40, html.var.auto .sf-c-txt-deeppink\:40 { color: hsl(328, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:45, html.var.auto .sf-c-txt-deeppink\:45 { color: hsl(328, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:50, html.var.auto .sf-c-txt-deeppink\:50 { color: hsl(328, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:55, html.var.auto .sf-c-txt-deeppink\:55 { color: hsl(328, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:60, html.var.auto .sf-c-txt-deeppink\:60 { color: hsl(328, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:65, html.var.auto .sf-c-txt-deeppink\:65 { color: hsl(328, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:70, html.var.auto .sf-c-txt-deeppink\:70 { color: hsl(328, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:75, html.var.auto .sf-c-txt-deeppink\:75 { color: hsl(328, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:80, html.var.auto .sf-c-txt-deeppink\:80 { color: hsl(328, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:85, html.var.auto .sf-c-txt-deeppink\:85 { color: hsl(328, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:90, html.var.auto .sf-c-txt-deeppink\:90 { color: hsl(328, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:95, html.var.auto .sf-c-txt-deeppink\:95 { color: hsl(328, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:100, html.var.auto .sf-c-txt-deeppink\:100 { color: hsl(328, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:dark, html.auto .sf-c-txt-deeppink\:dark { color: hsl(328, 100%, 54%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:0\:dark, html.auto .sf-c-txt-deeppink\:0\:dark { color: hsl(328, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:5\:dark, html.auto .sf-c-txt-deeppink\:5\:dark { color: hsl(328, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:10\:dark, html.auto .sf-c-txt-deeppink\:10\:dark { color: hsl(328, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:15\:dark, html.auto .sf-c-txt-deeppink\:15\:dark { color: hsl(328, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:20\:dark, html.auto .sf-c-txt-deeppink\:20\:dark { color: hsl(328, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:25\:dark, html.auto .sf-c-txt-deeppink\:25\:dark { color: hsl(328, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:30\:dark, html.auto .sf-c-txt-deeppink\:30\:dark { color: hsl(328, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:35\:dark, html.auto .sf-c-txt-deeppink\:35\:dark { color: hsl(328, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:40\:dark, html.auto .sf-c-txt-deeppink\:40\:dark { color: hsl(328, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:45\:dark, html.auto .sf-c-txt-deeppink\:45\:dark { color: hsl(328, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:50\:dark, html.auto .sf-c-txt-deeppink\:50\:dark { color: hsl(328, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:55\:dark, html.auto .sf-c-txt-deeppink\:55\:dark { color: hsl(328, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:60\:dark, html.auto .sf-c-txt-deeppink\:60\:dark { color: hsl(328, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:65\:dark, html.auto .sf-c-txt-deeppink\:65\:dark { color: hsl(328, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:70\:dark, html.auto .sf-c-txt-deeppink\:70\:dark { color: hsl(328, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:75\:dark, html.auto .sf-c-txt-deeppink\:75\:dark { color: hsl(328, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:80\:dark, html.auto .sf-c-txt-deeppink\:80\:dark { color: hsl(328, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:85\:dark, html.auto .sf-c-txt-deeppink\:85\:dark { color: hsl(328, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:90\:dark, html.auto .sf-c-txt-deeppink\:90\:dark { color: hsl(328, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:95\:dark, html.auto .sf-c-txt-deeppink\:95\:dark { color: hsl(328, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-deeppink\:100\:dark, html.auto .sf-c-txt-deeppink\:100\:dark { color: hsl(328, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:dark, html.var.auto .sf-c-txt-deeppink\:dark { color: hsl(328, 100%, 54%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:0\:dark, html.var.auto .sf-c-txt-deeppink\:0\:dark { color: hsl(328, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:5\:dark, html.var.auto .sf-c-txt-deeppink\:5\:dark { color: hsl(328, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:10\:dark, html.var.auto .sf-c-txt-deeppink\:10\:dark { color: hsl(328, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:15\:dark, html.var.auto .sf-c-txt-deeppink\:15\:dark { color: hsl(328, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:20\:dark, html.var.auto .sf-c-txt-deeppink\:20\:dark { color: hsl(328, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:25\:dark, html.var.auto .sf-c-txt-deeppink\:25\:dark { color: hsl(328, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:30\:dark, html.var.auto .sf-c-txt-deeppink\:30\:dark { color: hsl(328, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:35\:dark, html.var.auto .sf-c-txt-deeppink\:35\:dark { color: hsl(328, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:40\:dark, html.var.auto .sf-c-txt-deeppink\:40\:dark { color: hsl(328, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:45\:dark, html.var.auto .sf-c-txt-deeppink\:45\:dark { color: hsl(328, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:50\:dark, html.var.auto .sf-c-txt-deeppink\:50\:dark { color: hsl(328, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:55\:dark, html.var.auto .sf-c-txt-deeppink\:55\:dark { color: hsl(328, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:60\:dark, html.var.auto .sf-c-txt-deeppink\:60\:dark { color: hsl(328, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:65\:dark, html.var.auto .sf-c-txt-deeppink\:65\:dark { color: hsl(328, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:70\:dark, html.var.auto .sf-c-txt-deeppink\:70\:dark { color: hsl(328, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:75\:dark, html.var.auto .sf-c-txt-deeppink\:75\:dark { color: hsl(328, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:80\:dark, html.var.auto .sf-c-txt-deeppink\:80\:dark { color: hsl(328, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:85\:dark, html.var.auto .sf-c-txt-deeppink\:85\:dark { color: hsl(328, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:90\:dark, html.var.auto .sf-c-txt-deeppink\:90\:dark { color: hsl(328, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:95\:dark, html.var.auto .sf-c-txt-deeppink\:95\:dark { color: hsl(328, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-deeppink\:100\:dark, html.var.auto .sf-c-txt-deeppink\:100\:dark { color: hsl(328, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/deepskyblue.css b/src/colors/20/deepskyblue.css index e09fb35..8c30a1e 100644 --- a/src/colors/20/deepskyblue.css +++ b/src/colors/20/deepskyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='deepskyblue'] { --sf-c-deepskyblue: 195 100% 50%; --sf-c-deepskyblue-0: 195 100% 0%; --sf-c-deepskyblue-5: 195 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-deepskyblue\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-deepskyblue\:95\:dark, html.var.auto .sf-c-deepskyblue\:95\:dark { color: hsl(195, 100%, 95%); background: hsl(195, 100%, 5%) } html.var[data-theme='auto'] .sf-c-deepskyblue\:100\:dark, html.var.auto .sf-c-deepskyblue\:100\:dark { color: hsl(195, 100%, 95%); background: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue, html.auto .sf-c-txt-deepskyblue { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0, html.auto .sf-c-txt-deepskyblue\:0 { color: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:5, html.auto .sf-c-txt-deepskyblue\:5 { color: hsl(195, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10, html.auto .sf-c-txt-deepskyblue\:10 { color: hsl(195, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:15, html.auto .sf-c-txt-deepskyblue\:15 { color: hsl(195, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20, html.auto .sf-c-txt-deepskyblue\:20 { color: hsl(195, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:25, html.auto .sf-c-txt-deepskyblue\:25 { color: hsl(195, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30, html.auto .sf-c-txt-deepskyblue\:30 { color: hsl(195, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:35, html.auto .sf-c-txt-deepskyblue\:35 { color: hsl(195, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40, html.auto .sf-c-txt-deepskyblue\:40 { color: hsl(195, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:45, html.auto .sf-c-txt-deepskyblue\:45 { color: hsl(195, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50, html.auto .sf-c-txt-deepskyblue\:50 { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:55, html.auto .sf-c-txt-deepskyblue\:55 { color: hsl(195, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60, html.auto .sf-c-txt-deepskyblue\:60 { color: hsl(195, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:65, html.auto .sf-c-txt-deepskyblue\:65 { color: hsl(195, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70, html.auto .sf-c-txt-deepskyblue\:70 { color: hsl(195, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:75, html.auto .sf-c-txt-deepskyblue\:75 { color: hsl(195, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80, html.auto .sf-c-txt-deepskyblue\:80 { color: hsl(195, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:85, html.auto .sf-c-txt-deepskyblue\:85 { color: hsl(195, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90, html.auto .sf-c-txt-deepskyblue\:90 { color: hsl(195, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:95, html.auto .sf-c-txt-deepskyblue\:95 { color: hsl(195, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100, html.auto .sf-c-txt-deepskyblue\:100 { color: hsl(195, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue, html.var.auto .sf-c-txt-deepskyblue { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0, html.var.auto .sf-c-txt-deepskyblue\:0 { color: hsl(195, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:5, html.var.auto .sf-c-txt-deepskyblue\:5 { color: hsl(195, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10, html.var.auto .sf-c-txt-deepskyblue\:10 { color: hsl(195, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:15, html.var.auto .sf-c-txt-deepskyblue\:15 { color: hsl(195, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20, html.var.auto .sf-c-txt-deepskyblue\:20 { color: hsl(195, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:25, html.var.auto .sf-c-txt-deepskyblue\:25 { color: hsl(195, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30, html.var.auto .sf-c-txt-deepskyblue\:30 { color: hsl(195, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:35, html.var.auto .sf-c-txt-deepskyblue\:35 { color: hsl(195, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40, html.var.auto .sf-c-txt-deepskyblue\:40 { color: hsl(195, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:45, html.var.auto .sf-c-txt-deepskyblue\:45 { color: hsl(195, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50, html.var.auto .sf-c-txt-deepskyblue\:50 { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:55, html.var.auto .sf-c-txt-deepskyblue\:55 { color: hsl(195, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60, html.var.auto .sf-c-txt-deepskyblue\:60 { color: hsl(195, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:65, html.var.auto .sf-c-txt-deepskyblue\:65 { color: hsl(195, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70, html.var.auto .sf-c-txt-deepskyblue\:70 { color: hsl(195, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:75, html.var.auto .sf-c-txt-deepskyblue\:75 { color: hsl(195, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80, html.var.auto .sf-c-txt-deepskyblue\:80 { color: hsl(195, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:85, html.var.auto .sf-c-txt-deepskyblue\:85 { color: hsl(195, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90, html.var.auto .sf-c-txt-deepskyblue\:90 { color: hsl(195, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:95, html.var.auto .sf-c-txt-deepskyblue\:95 { color: hsl(195, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100, html.var.auto .sf-c-txt-deepskyblue\:100 { color: hsl(195, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:dark, html.auto .sf-c-txt-deepskyblue\:dark { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0\:dark, html.auto .sf-c-txt-deepskyblue\:0\:dark { color: hsl(195, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:5\:dark, html.auto .sf-c-txt-deepskyblue\:5\:dark { color: hsl(195, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10\:dark, html.auto .sf-c-txt-deepskyblue\:10\:dark { color: hsl(195, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:15\:dark, html.auto .sf-c-txt-deepskyblue\:15\:dark { color: hsl(195, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20\:dark, html.auto .sf-c-txt-deepskyblue\:20\:dark { color: hsl(195, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:25\:dark, html.auto .sf-c-txt-deepskyblue\:25\:dark { color: hsl(195, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30\:dark, html.auto .sf-c-txt-deepskyblue\:30\:dark { color: hsl(195, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:35\:dark, html.auto .sf-c-txt-deepskyblue\:35\:dark { color: hsl(195, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40\:dark, html.auto .sf-c-txt-deepskyblue\:40\:dark { color: hsl(195, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:45\:dark, html.auto .sf-c-txt-deepskyblue\:45\:dark { color: hsl(195, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50\:dark, html.auto .sf-c-txt-deepskyblue\:50\:dark { color: hsl(195, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:55\:dark, html.auto .sf-c-txt-deepskyblue\:55\:dark { color: hsl(195, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60\:dark, html.auto .sf-c-txt-deepskyblue\:60\:dark { color: hsl(195, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:65\:dark, html.auto .sf-c-txt-deepskyblue\:65\:dark { color: hsl(195, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70\:dark, html.auto .sf-c-txt-deepskyblue\:70\:dark { color: hsl(195, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:75\:dark, html.auto .sf-c-txt-deepskyblue\:75\:dark { color: hsl(195, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80\:dark, html.auto .sf-c-txt-deepskyblue\:80\:dark { color: hsl(195, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:85\:dark, html.auto .sf-c-txt-deepskyblue\:85\:dark { color: hsl(195, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90\:dark, html.auto .sf-c-txt-deepskyblue\:90\:dark { color: hsl(195, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:95\:dark, html.auto .sf-c-txt-deepskyblue\:95\:dark { color: hsl(195, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100\:dark, html.auto .sf-c-txt-deepskyblue\:100\:dark { color: hsl(195, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:dark, html.var.auto .sf-c-txt-deepskyblue\:dark { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:0\:dark, html.var.auto .sf-c-txt-deepskyblue\:0\:dark { color: hsl(195, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:5\:dark, html.var.auto .sf-c-txt-deepskyblue\:5\:dark { color: hsl(195, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:10\:dark, html.var.auto .sf-c-txt-deepskyblue\:10\:dark { color: hsl(195, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:15\:dark, html.var.auto .sf-c-txt-deepskyblue\:15\:dark { color: hsl(195, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:20\:dark, html.var.auto .sf-c-txt-deepskyblue\:20\:dark { color: hsl(195, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:25\:dark, html.var.auto .sf-c-txt-deepskyblue\:25\:dark { color: hsl(195, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:30\:dark, html.var.auto .sf-c-txt-deepskyblue\:30\:dark { color: hsl(195, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:35\:dark, html.var.auto .sf-c-txt-deepskyblue\:35\:dark { color: hsl(195, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:40\:dark, html.var.auto .sf-c-txt-deepskyblue\:40\:dark { color: hsl(195, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:45\:dark, html.var.auto .sf-c-txt-deepskyblue\:45\:dark { color: hsl(195, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:50\:dark, html.var.auto .sf-c-txt-deepskyblue\:50\:dark { color: hsl(195, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:55\:dark, html.var.auto .sf-c-txt-deepskyblue\:55\:dark { color: hsl(195, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:60\:dark, html.var.auto .sf-c-txt-deepskyblue\:60\:dark { color: hsl(195, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:65\:dark, html.var.auto .sf-c-txt-deepskyblue\:65\:dark { color: hsl(195, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:70\:dark, html.var.auto .sf-c-txt-deepskyblue\:70\:dark { color: hsl(195, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:75\:dark, html.var.auto .sf-c-txt-deepskyblue\:75\:dark { color: hsl(195, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:80\:dark, html.var.auto .sf-c-txt-deepskyblue\:80\:dark { color: hsl(195, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:85\:dark, html.var.auto .sf-c-txt-deepskyblue\:85\:dark { color: hsl(195, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:90\:dark, html.var.auto .sf-c-txt-deepskyblue\:90\:dark { color: hsl(195, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:95\:dark, html.var.auto .sf-c-txt-deepskyblue\:95\:dark { color: hsl(195, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-deepskyblue\:100\:dark, html.var.auto .sf-c-txt-deepskyblue\:100\:dark { color: hsl(195, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/dimgray.css b/src/colors/20/dimgray.css index 34de7e3..1af9872 100644 --- a/src/colors/20/dimgray.css +++ b/src/colors/20/dimgray.css @@ -1,4 +1,4 @@ -:root { +[class*='dimgray'] { --sf-c-dimgray: 0 0% 41%; --sf-c-dimgray-0: 0 0% 0%; --sf-c-dimgray-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-dimgray\:100\:dark, html.dark .sf-c-txt-di html.var[data-theme='auto'] .sf-c-dimgray\:95\:dark, html.var.auto .sf-c-dimgray\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-dimgray\:100\:dark, html.var.auto .sf-c-dimgray\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray, html.auto .sf-c-txt-dimgray { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:0, html.auto .sf-c-txt-dimgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:5, html.auto .sf-c-txt-dimgray\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:10, html.auto .sf-c-txt-dimgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:15, html.auto .sf-c-txt-dimgray\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:20, html.auto .sf-c-txt-dimgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:25, html.auto .sf-c-txt-dimgray\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:30, html.auto .sf-c-txt-dimgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:35, html.auto .sf-c-txt-dimgray\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:40, html.auto .sf-c-txt-dimgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:45, html.auto .sf-c-txt-dimgray\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:50, html.auto .sf-c-txt-dimgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:55, html.auto .sf-c-txt-dimgray\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:60, html.auto .sf-c-txt-dimgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:65, html.auto .sf-c-txt-dimgray\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:70, html.auto .sf-c-txt-dimgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:75, html.auto .sf-c-txt-dimgray\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:80, html.auto .sf-c-txt-dimgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:85, html.auto .sf-c-txt-dimgray\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:90, html.auto .sf-c-txt-dimgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:95, html.auto .sf-c-txt-dimgray\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:100, html.auto .sf-c-txt-dimgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray, html.var.auto .sf-c-txt-dimgray { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:0, html.var.auto .sf-c-txt-dimgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:5, html.var.auto .sf-c-txt-dimgray\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:10, html.var.auto .sf-c-txt-dimgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:15, html.var.auto .sf-c-txt-dimgray\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:20, html.var.auto .sf-c-txt-dimgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:25, html.var.auto .sf-c-txt-dimgray\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:30, html.var.auto .sf-c-txt-dimgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:35, html.var.auto .sf-c-txt-dimgray\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:40, html.var.auto .sf-c-txt-dimgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:45, html.var.auto .sf-c-txt-dimgray\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:50, html.var.auto .sf-c-txt-dimgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:55, html.var.auto .sf-c-txt-dimgray\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:60, html.var.auto .sf-c-txt-dimgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:65, html.var.auto .sf-c-txt-dimgray\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:70, html.var.auto .sf-c-txt-dimgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:75, html.var.auto .sf-c-txt-dimgray\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:80, html.var.auto .sf-c-txt-dimgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:85, html.var.auto .sf-c-txt-dimgray\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:90, html.var.auto .sf-c-txt-dimgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:95, html.var.auto .sf-c-txt-dimgray\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:100, html.var.auto .sf-c-txt-dimgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:dark, html.auto .sf-c-txt-dimgray\:dark { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:0\:dark, html.auto .sf-c-txt-dimgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:5\:dark, html.auto .sf-c-txt-dimgray\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:10\:dark, html.auto .sf-c-txt-dimgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:15\:dark, html.auto .sf-c-txt-dimgray\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:20\:dark, html.auto .sf-c-txt-dimgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:25\:dark, html.auto .sf-c-txt-dimgray\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:30\:dark, html.auto .sf-c-txt-dimgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:35\:dark, html.auto .sf-c-txt-dimgray\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:40\:dark, html.auto .sf-c-txt-dimgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:45\:dark, html.auto .sf-c-txt-dimgray\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:50\:dark, html.auto .sf-c-txt-dimgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:55\:dark, html.auto .sf-c-txt-dimgray\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:60\:dark, html.auto .sf-c-txt-dimgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:65\:dark, html.auto .sf-c-txt-dimgray\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:70\:dark, html.auto .sf-c-txt-dimgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:75\:dark, html.auto .sf-c-txt-dimgray\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:80\:dark, html.auto .sf-c-txt-dimgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:85\:dark, html.auto .sf-c-txt-dimgray\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:90\:dark, html.auto .sf-c-txt-dimgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:95\:dark, html.auto .sf-c-txt-dimgray\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dimgray\:100\:dark, html.auto .sf-c-txt-dimgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:dark, html.var.auto .sf-c-txt-dimgray\:dark { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:0\:dark, html.var.auto .sf-c-txt-dimgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:5\:dark, html.var.auto .sf-c-txt-dimgray\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:10\:dark, html.var.auto .sf-c-txt-dimgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:15\:dark, html.var.auto .sf-c-txt-dimgray\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:20\:dark, html.var.auto .sf-c-txt-dimgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:25\:dark, html.var.auto .sf-c-txt-dimgray\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:30\:dark, html.var.auto .sf-c-txt-dimgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:35\:dark, html.var.auto .sf-c-txt-dimgray\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:40\:dark, html.var.auto .sf-c-txt-dimgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:45\:dark, html.var.auto .sf-c-txt-dimgray\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:50\:dark, html.var.auto .sf-c-txt-dimgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:55\:dark, html.var.auto .sf-c-txt-dimgray\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:60\:dark, html.var.auto .sf-c-txt-dimgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:65\:dark, html.var.auto .sf-c-txt-dimgray\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:70\:dark, html.var.auto .sf-c-txt-dimgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:75\:dark, html.var.auto .sf-c-txt-dimgray\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:80\:dark, html.var.auto .sf-c-txt-dimgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:85\:dark, html.var.auto .sf-c-txt-dimgray\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:90\:dark, html.var.auto .sf-c-txt-dimgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:95\:dark, html.var.auto .sf-c-txt-dimgray\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dimgray\:100\:dark, html.var.auto .sf-c-txt-dimgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/dimgrey.css b/src/colors/20/dimgrey.css index d58d628..7253557 100644 --- a/src/colors/20/dimgrey.css +++ b/src/colors/20/dimgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='dimgrey'] { --sf-c-dimgrey: 0 0% 41%; --sf-c-dimgrey-0: 0 0% 0%; --sf-c-dimgrey-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-dimgrey\:100\:dark, html.dark .sf-c-txt-di html.var[data-theme='auto'] .sf-c-dimgrey\:95\:dark, html.var.auto .sf-c-dimgrey\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-dimgrey\:100\:dark, html.var.auto .sf-c-dimgrey\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey, html.auto .sf-c-txt-dimgrey { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0, html.auto .sf-c-txt-dimgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:5, html.auto .sf-c-txt-dimgrey\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10, html.auto .sf-c-txt-dimgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:15, html.auto .sf-c-txt-dimgrey\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20, html.auto .sf-c-txt-dimgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:25, html.auto .sf-c-txt-dimgrey\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30, html.auto .sf-c-txt-dimgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:35, html.auto .sf-c-txt-dimgrey\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40, html.auto .sf-c-txt-dimgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:45, html.auto .sf-c-txt-dimgrey\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50, html.auto .sf-c-txt-dimgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:55, html.auto .sf-c-txt-dimgrey\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60, html.auto .sf-c-txt-dimgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:65, html.auto .sf-c-txt-dimgrey\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70, html.auto .sf-c-txt-dimgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:75, html.auto .sf-c-txt-dimgrey\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80, html.auto .sf-c-txt-dimgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:85, html.auto .sf-c-txt-dimgrey\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90, html.auto .sf-c-txt-dimgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:95, html.auto .sf-c-txt-dimgrey\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100, html.auto .sf-c-txt-dimgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey, html.var.auto .sf-c-txt-dimgrey { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0, html.var.auto .sf-c-txt-dimgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:5, html.var.auto .sf-c-txt-dimgrey\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10, html.var.auto .sf-c-txt-dimgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:15, html.var.auto .sf-c-txt-dimgrey\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20, html.var.auto .sf-c-txt-dimgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:25, html.var.auto .sf-c-txt-dimgrey\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30, html.var.auto .sf-c-txt-dimgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:35, html.var.auto .sf-c-txt-dimgrey\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40, html.var.auto .sf-c-txt-dimgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:45, html.var.auto .sf-c-txt-dimgrey\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50, html.var.auto .sf-c-txt-dimgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:55, html.var.auto .sf-c-txt-dimgrey\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60, html.var.auto .sf-c-txt-dimgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:65, html.var.auto .sf-c-txt-dimgrey\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70, html.var.auto .sf-c-txt-dimgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:75, html.var.auto .sf-c-txt-dimgrey\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80, html.var.auto .sf-c-txt-dimgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:85, html.var.auto .sf-c-txt-dimgrey\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90, html.var.auto .sf-c-txt-dimgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:95, html.var.auto .sf-c-txt-dimgrey\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100, html.var.auto .sf-c-txt-dimgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:dark, html.auto .sf-c-txt-dimgrey\:dark { color: hsl(0, 0%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0\:dark, html.auto .sf-c-txt-dimgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:5\:dark, html.auto .sf-c-txt-dimgrey\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10\:dark, html.auto .sf-c-txt-dimgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:15\:dark, html.auto .sf-c-txt-dimgrey\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20\:dark, html.auto .sf-c-txt-dimgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:25\:dark, html.auto .sf-c-txt-dimgrey\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30\:dark, html.auto .sf-c-txt-dimgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:35\:dark, html.auto .sf-c-txt-dimgrey\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40\:dark, html.auto .sf-c-txt-dimgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:45\:dark, html.auto .sf-c-txt-dimgrey\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50\:dark, html.auto .sf-c-txt-dimgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:55\:dark, html.auto .sf-c-txt-dimgrey\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60\:dark, html.auto .sf-c-txt-dimgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:65\:dark, html.auto .sf-c-txt-dimgrey\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70\:dark, html.auto .sf-c-txt-dimgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:75\:dark, html.auto .sf-c-txt-dimgrey\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80\:dark, html.auto .sf-c-txt-dimgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:85\:dark, html.auto .sf-c-txt-dimgrey\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90\:dark, html.auto .sf-c-txt-dimgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:95\:dark, html.auto .sf-c-txt-dimgrey\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100\:dark, html.auto .sf-c-txt-dimgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:dark, html.var.auto .sf-c-txt-dimgrey\:dark { color: hsl(0, 0%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:0\:dark, html.var.auto .sf-c-txt-dimgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:5\:dark, html.var.auto .sf-c-txt-dimgrey\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:10\:dark, html.var.auto .sf-c-txt-dimgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:15\:dark, html.var.auto .sf-c-txt-dimgrey\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:20\:dark, html.var.auto .sf-c-txt-dimgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:25\:dark, html.var.auto .sf-c-txt-dimgrey\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:30\:dark, html.var.auto .sf-c-txt-dimgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:35\:dark, html.var.auto .sf-c-txt-dimgrey\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:40\:dark, html.var.auto .sf-c-txt-dimgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:45\:dark, html.var.auto .sf-c-txt-dimgrey\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:50\:dark, html.var.auto .sf-c-txt-dimgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:55\:dark, html.var.auto .sf-c-txt-dimgrey\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:60\:dark, html.var.auto .sf-c-txt-dimgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:65\:dark, html.var.auto .sf-c-txt-dimgrey\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:70\:dark, html.var.auto .sf-c-txt-dimgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:75\:dark, html.var.auto .sf-c-txt-dimgrey\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:80\:dark, html.var.auto .sf-c-txt-dimgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:85\:dark, html.var.auto .sf-c-txt-dimgrey\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:90\:dark, html.var.auto .sf-c-txt-dimgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:95\:dark, html.var.auto .sf-c-txt-dimgrey\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dimgrey\:100\:dark, html.var.auto .sf-c-txt-dimgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/dodgerblue.css b/src/colors/20/dodgerblue.css index 4014c30..db62e2a 100644 --- a/src/colors/20/dodgerblue.css +++ b/src/colors/20/dodgerblue.css @@ -1,4 +1,4 @@ -:root { +[class*='dodgerblue'] { --sf-c-dodgerblue: 210 100% 56%; --sf-c-dodgerblue-0: 210 100% 0%; --sf-c-dodgerblue-5: 210 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-dodgerblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-dodgerblue\:95\:dark, html.var.auto .sf-c-dodgerblue\:95\:dark { color: hsl(210, 100%, 95%); background: hsl(210, 100%, 5%) } html.var[data-theme='auto'] .sf-c-dodgerblue\:100\:dark, html.var.auto .sf-c-dodgerblue\:100\:dark { color: hsl(210, 100%, 95%); background: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue, html.auto .sf-c-txt-dodgerblue { color: hsl(210, 100%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0, html.auto .sf-c-txt-dodgerblue\:0 { color: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:5, html.auto .sf-c-txt-dodgerblue\:5 { color: hsl(210, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10, html.auto .sf-c-txt-dodgerblue\:10 { color: hsl(210, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:15, html.auto .sf-c-txt-dodgerblue\:15 { color: hsl(210, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20, html.auto .sf-c-txt-dodgerblue\:20 { color: hsl(210, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:25, html.auto .sf-c-txt-dodgerblue\:25 { color: hsl(210, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30, html.auto .sf-c-txt-dodgerblue\:30 { color: hsl(210, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:35, html.auto .sf-c-txt-dodgerblue\:35 { color: hsl(210, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40, html.auto .sf-c-txt-dodgerblue\:40 { color: hsl(210, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:45, html.auto .sf-c-txt-dodgerblue\:45 { color: hsl(210, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50, html.auto .sf-c-txt-dodgerblue\:50 { color: hsl(210, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:55, html.auto .sf-c-txt-dodgerblue\:55 { color: hsl(210, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60, html.auto .sf-c-txt-dodgerblue\:60 { color: hsl(210, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:65, html.auto .sf-c-txt-dodgerblue\:65 { color: hsl(210, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70, html.auto .sf-c-txt-dodgerblue\:70 { color: hsl(210, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:75, html.auto .sf-c-txt-dodgerblue\:75 { color: hsl(210, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80, html.auto .sf-c-txt-dodgerblue\:80 { color: hsl(210, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:85, html.auto .sf-c-txt-dodgerblue\:85 { color: hsl(210, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90, html.auto .sf-c-txt-dodgerblue\:90 { color: hsl(210, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:95, html.auto .sf-c-txt-dodgerblue\:95 { color: hsl(210, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100, html.auto .sf-c-txt-dodgerblue\:100 { color: hsl(210, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue, html.var.auto .sf-c-txt-dodgerblue { color: hsl(210, 100%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0, html.var.auto .sf-c-txt-dodgerblue\:0 { color: hsl(210, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:5, html.var.auto .sf-c-txt-dodgerblue\:5 { color: hsl(210, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10, html.var.auto .sf-c-txt-dodgerblue\:10 { color: hsl(210, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:15, html.var.auto .sf-c-txt-dodgerblue\:15 { color: hsl(210, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20, html.var.auto .sf-c-txt-dodgerblue\:20 { color: hsl(210, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:25, html.var.auto .sf-c-txt-dodgerblue\:25 { color: hsl(210, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30, html.var.auto .sf-c-txt-dodgerblue\:30 { color: hsl(210, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:35, html.var.auto .sf-c-txt-dodgerblue\:35 { color: hsl(210, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40, html.var.auto .sf-c-txt-dodgerblue\:40 { color: hsl(210, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:45, html.var.auto .sf-c-txt-dodgerblue\:45 { color: hsl(210, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50, html.var.auto .sf-c-txt-dodgerblue\:50 { color: hsl(210, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:55, html.var.auto .sf-c-txt-dodgerblue\:55 { color: hsl(210, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60, html.var.auto .sf-c-txt-dodgerblue\:60 { color: hsl(210, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:65, html.var.auto .sf-c-txt-dodgerblue\:65 { color: hsl(210, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70, html.var.auto .sf-c-txt-dodgerblue\:70 { color: hsl(210, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:75, html.var.auto .sf-c-txt-dodgerblue\:75 { color: hsl(210, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80, html.var.auto .sf-c-txt-dodgerblue\:80 { color: hsl(210, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:85, html.var.auto .sf-c-txt-dodgerblue\:85 { color: hsl(210, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90, html.var.auto .sf-c-txt-dodgerblue\:90 { color: hsl(210, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:95, html.var.auto .sf-c-txt-dodgerblue\:95 { color: hsl(210, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100, html.var.auto .sf-c-txt-dodgerblue\:100 { color: hsl(210, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:dark, html.auto .sf-c-txt-dodgerblue\:dark { color: hsl(210, 100%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0\:dark, html.auto .sf-c-txt-dodgerblue\:0\:dark { color: hsl(210, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:5\:dark, html.auto .sf-c-txt-dodgerblue\:5\:dark { color: hsl(210, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10\:dark, html.auto .sf-c-txt-dodgerblue\:10\:dark { color: hsl(210, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:15\:dark, html.auto .sf-c-txt-dodgerblue\:15\:dark { color: hsl(210, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20\:dark, html.auto .sf-c-txt-dodgerblue\:20\:dark { color: hsl(210, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:25\:dark, html.auto .sf-c-txt-dodgerblue\:25\:dark { color: hsl(210, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30\:dark, html.auto .sf-c-txt-dodgerblue\:30\:dark { color: hsl(210, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:35\:dark, html.auto .sf-c-txt-dodgerblue\:35\:dark { color: hsl(210, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40\:dark, html.auto .sf-c-txt-dodgerblue\:40\:dark { color: hsl(210, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:45\:dark, html.auto .sf-c-txt-dodgerblue\:45\:dark { color: hsl(210, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50\:dark, html.auto .sf-c-txt-dodgerblue\:50\:dark { color: hsl(210, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:55\:dark, html.auto .sf-c-txt-dodgerblue\:55\:dark { color: hsl(210, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60\:dark, html.auto .sf-c-txt-dodgerblue\:60\:dark { color: hsl(210, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:65\:dark, html.auto .sf-c-txt-dodgerblue\:65\:dark { color: hsl(210, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70\:dark, html.auto .sf-c-txt-dodgerblue\:70\:dark { color: hsl(210, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:75\:dark, html.auto .sf-c-txt-dodgerblue\:75\:dark { color: hsl(210, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80\:dark, html.auto .sf-c-txt-dodgerblue\:80\:dark { color: hsl(210, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:85\:dark, html.auto .sf-c-txt-dodgerblue\:85\:dark { color: hsl(210, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90\:dark, html.auto .sf-c-txt-dodgerblue\:90\:dark { color: hsl(210, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:95\:dark, html.auto .sf-c-txt-dodgerblue\:95\:dark { color: hsl(210, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100\:dark, html.auto .sf-c-txt-dodgerblue\:100\:dark { color: hsl(210, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:dark, html.var.auto .sf-c-txt-dodgerblue\:dark { color: hsl(210, 100%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:0\:dark, html.var.auto .sf-c-txt-dodgerblue\:0\:dark { color: hsl(210, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:5\:dark, html.var.auto .sf-c-txt-dodgerblue\:5\:dark { color: hsl(210, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:10\:dark, html.var.auto .sf-c-txt-dodgerblue\:10\:dark { color: hsl(210, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:15\:dark, html.var.auto .sf-c-txt-dodgerblue\:15\:dark { color: hsl(210, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:20\:dark, html.var.auto .sf-c-txt-dodgerblue\:20\:dark { color: hsl(210, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:25\:dark, html.var.auto .sf-c-txt-dodgerblue\:25\:dark { color: hsl(210, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:30\:dark, html.var.auto .sf-c-txt-dodgerblue\:30\:dark { color: hsl(210, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:35\:dark, html.var.auto .sf-c-txt-dodgerblue\:35\:dark { color: hsl(210, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:40\:dark, html.var.auto .sf-c-txt-dodgerblue\:40\:dark { color: hsl(210, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:45\:dark, html.var.auto .sf-c-txt-dodgerblue\:45\:dark { color: hsl(210, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:50\:dark, html.var.auto .sf-c-txt-dodgerblue\:50\:dark { color: hsl(210, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:55\:dark, html.var.auto .sf-c-txt-dodgerblue\:55\:dark { color: hsl(210, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:60\:dark, html.var.auto .sf-c-txt-dodgerblue\:60\:dark { color: hsl(210, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:65\:dark, html.var.auto .sf-c-txt-dodgerblue\:65\:dark { color: hsl(210, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:70\:dark, html.var.auto .sf-c-txt-dodgerblue\:70\:dark { color: hsl(210, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:75\:dark, html.var.auto .sf-c-txt-dodgerblue\:75\:dark { color: hsl(210, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:80\:dark, html.var.auto .sf-c-txt-dodgerblue\:80\:dark { color: hsl(210, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:85\:dark, html.var.auto .sf-c-txt-dodgerblue\:85\:dark { color: hsl(210, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:90\:dark, html.var.auto .sf-c-txt-dodgerblue\:90\:dark { color: hsl(210, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:95\:dark, html.var.auto .sf-c-txt-dodgerblue\:95\:dark { color: hsl(210, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-dodgerblue\:100\:dark, html.var.auto .sf-c-txt-dodgerblue\:100\:dark { color: hsl(210, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/firebrick.css b/src/colors/20/firebrick.css index d7f4b05..c3fd1d1 100644 --- a/src/colors/20/firebrick.css +++ b/src/colors/20/firebrick.css @@ -1,4 +1,4 @@ -:root { +[class*='firebrick'] { --sf-c-firebrick: 0 68% 42%; --sf-c-firebrick-0: 0 68% 0%; --sf-c-firebrick-5: 0 68% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-firebrick\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-firebrick\:95\:dark, html.var.auto .sf-c-firebrick\:95\:dark { color: hsl(0, 68%, 95%); background: hsl(0, 68%, 5%) } html.var[data-theme='auto'] .sf-c-firebrick\:100\:dark, html.var.auto .sf-c-firebrick\:100\:dark { color: hsl(0, 68%, 95%); background: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick, html.auto .sf-c-txt-firebrick { color: hsl(0, 68%, 42%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:0, html.auto .sf-c-txt-firebrick\:0 { color: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:5, html.auto .sf-c-txt-firebrick\:5 { color: hsl(0, 68%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:10, html.auto .sf-c-txt-firebrick\:10 { color: hsl(0, 68%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:15, html.auto .sf-c-txt-firebrick\:15 { color: hsl(0, 68%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:20, html.auto .sf-c-txt-firebrick\:20 { color: hsl(0, 68%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:25, html.auto .sf-c-txt-firebrick\:25 { color: hsl(0, 68%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:30, html.auto .sf-c-txt-firebrick\:30 { color: hsl(0, 68%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:35, html.auto .sf-c-txt-firebrick\:35 { color: hsl(0, 68%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:40, html.auto .sf-c-txt-firebrick\:40 { color: hsl(0, 68%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:45, html.auto .sf-c-txt-firebrick\:45 { color: hsl(0, 68%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:50, html.auto .sf-c-txt-firebrick\:50 { color: hsl(0, 68%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:55, html.auto .sf-c-txt-firebrick\:55 { color: hsl(0, 68%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:60, html.auto .sf-c-txt-firebrick\:60 { color: hsl(0, 68%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:65, html.auto .sf-c-txt-firebrick\:65 { color: hsl(0, 68%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:70, html.auto .sf-c-txt-firebrick\:70 { color: hsl(0, 68%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:75, html.auto .sf-c-txt-firebrick\:75 { color: hsl(0, 68%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:80, html.auto .sf-c-txt-firebrick\:80 { color: hsl(0, 68%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:85, html.auto .sf-c-txt-firebrick\:85 { color: hsl(0, 68%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:90, html.auto .sf-c-txt-firebrick\:90 { color: hsl(0, 68%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:95, html.auto .sf-c-txt-firebrick\:95 { color: hsl(0, 68%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:100, html.auto .sf-c-txt-firebrick\:100 { color: hsl(0, 68%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick, html.var.auto .sf-c-txt-firebrick { color: hsl(0, 68%, 42%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:0, html.var.auto .sf-c-txt-firebrick\:0 { color: hsl(0, 68%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:5, html.var.auto .sf-c-txt-firebrick\:5 { color: hsl(0, 68%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:10, html.var.auto .sf-c-txt-firebrick\:10 { color: hsl(0, 68%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:15, html.var.auto .sf-c-txt-firebrick\:15 { color: hsl(0, 68%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:20, html.var.auto .sf-c-txt-firebrick\:20 { color: hsl(0, 68%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:25, html.var.auto .sf-c-txt-firebrick\:25 { color: hsl(0, 68%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:30, html.var.auto .sf-c-txt-firebrick\:30 { color: hsl(0, 68%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:35, html.var.auto .sf-c-txt-firebrick\:35 { color: hsl(0, 68%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:40, html.var.auto .sf-c-txt-firebrick\:40 { color: hsl(0, 68%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:45, html.var.auto .sf-c-txt-firebrick\:45 { color: hsl(0, 68%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:50, html.var.auto .sf-c-txt-firebrick\:50 { color: hsl(0, 68%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:55, html.var.auto .sf-c-txt-firebrick\:55 { color: hsl(0, 68%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:60, html.var.auto .sf-c-txt-firebrick\:60 { color: hsl(0, 68%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:65, html.var.auto .sf-c-txt-firebrick\:65 { color: hsl(0, 68%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:70, html.var.auto .sf-c-txt-firebrick\:70 { color: hsl(0, 68%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:75, html.var.auto .sf-c-txt-firebrick\:75 { color: hsl(0, 68%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:80, html.var.auto .sf-c-txt-firebrick\:80 { color: hsl(0, 68%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:85, html.var.auto .sf-c-txt-firebrick\:85 { color: hsl(0, 68%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:90, html.var.auto .sf-c-txt-firebrick\:90 { color: hsl(0, 68%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:95, html.var.auto .sf-c-txt-firebrick\:95 { color: hsl(0, 68%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:100, html.var.auto .sf-c-txt-firebrick\:100 { color: hsl(0, 68%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:dark, html.auto .sf-c-txt-firebrick\:dark { color: hsl(0, 68%, 42%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:0\:dark, html.auto .sf-c-txt-firebrick\:0\:dark { color: hsl(0, 68%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:5\:dark, html.auto .sf-c-txt-firebrick\:5\:dark { color: hsl(0, 68%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:10\:dark, html.auto .sf-c-txt-firebrick\:10\:dark { color: hsl(0, 68%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:15\:dark, html.auto .sf-c-txt-firebrick\:15\:dark { color: hsl(0, 68%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:20\:dark, html.auto .sf-c-txt-firebrick\:20\:dark { color: hsl(0, 68%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:25\:dark, html.auto .sf-c-txt-firebrick\:25\:dark { color: hsl(0, 68%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:30\:dark, html.auto .sf-c-txt-firebrick\:30\:dark { color: hsl(0, 68%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:35\:dark, html.auto .sf-c-txt-firebrick\:35\:dark { color: hsl(0, 68%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:40\:dark, html.auto .sf-c-txt-firebrick\:40\:dark { color: hsl(0, 68%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:45\:dark, html.auto .sf-c-txt-firebrick\:45\:dark { color: hsl(0, 68%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:50\:dark, html.auto .sf-c-txt-firebrick\:50\:dark { color: hsl(0, 68%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:55\:dark, html.auto .sf-c-txt-firebrick\:55\:dark { color: hsl(0, 68%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:60\:dark, html.auto .sf-c-txt-firebrick\:60\:dark { color: hsl(0, 68%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:65\:dark, html.auto .sf-c-txt-firebrick\:65\:dark { color: hsl(0, 68%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:70\:dark, html.auto .sf-c-txt-firebrick\:70\:dark { color: hsl(0, 68%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:75\:dark, html.auto .sf-c-txt-firebrick\:75\:dark { color: hsl(0, 68%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:80\:dark, html.auto .sf-c-txt-firebrick\:80\:dark { color: hsl(0, 68%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:85\:dark, html.auto .sf-c-txt-firebrick\:85\:dark { color: hsl(0, 68%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:90\:dark, html.auto .sf-c-txt-firebrick\:90\:dark { color: hsl(0, 68%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:95\:dark, html.auto .sf-c-txt-firebrick\:95\:dark { color: hsl(0, 68%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-firebrick\:100\:dark, html.auto .sf-c-txt-firebrick\:100\:dark { color: hsl(0, 68%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:dark, html.var.auto .sf-c-txt-firebrick\:dark { color: hsl(0, 68%, 42%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:0\:dark, html.var.auto .sf-c-txt-firebrick\:0\:dark { color: hsl(0, 68%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:5\:dark, html.var.auto .sf-c-txt-firebrick\:5\:dark { color: hsl(0, 68%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:10\:dark, html.var.auto .sf-c-txt-firebrick\:10\:dark { color: hsl(0, 68%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:15\:dark, html.var.auto .sf-c-txt-firebrick\:15\:dark { color: hsl(0, 68%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:20\:dark, html.var.auto .sf-c-txt-firebrick\:20\:dark { color: hsl(0, 68%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:25\:dark, html.var.auto .sf-c-txt-firebrick\:25\:dark { color: hsl(0, 68%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:30\:dark, html.var.auto .sf-c-txt-firebrick\:30\:dark { color: hsl(0, 68%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:35\:dark, html.var.auto .sf-c-txt-firebrick\:35\:dark { color: hsl(0, 68%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:40\:dark, html.var.auto .sf-c-txt-firebrick\:40\:dark { color: hsl(0, 68%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:45\:dark, html.var.auto .sf-c-txt-firebrick\:45\:dark { color: hsl(0, 68%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:50\:dark, html.var.auto .sf-c-txt-firebrick\:50\:dark { color: hsl(0, 68%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:55\:dark, html.var.auto .sf-c-txt-firebrick\:55\:dark { color: hsl(0, 68%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:60\:dark, html.var.auto .sf-c-txt-firebrick\:60\:dark { color: hsl(0, 68%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:65\:dark, html.var.auto .sf-c-txt-firebrick\:65\:dark { color: hsl(0, 68%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:70\:dark, html.var.auto .sf-c-txt-firebrick\:70\:dark { color: hsl(0, 68%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:75\:dark, html.var.auto .sf-c-txt-firebrick\:75\:dark { color: hsl(0, 68%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:80\:dark, html.var.auto .sf-c-txt-firebrick\:80\:dark { color: hsl(0, 68%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:85\:dark, html.var.auto .sf-c-txt-firebrick\:85\:dark { color: hsl(0, 68%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:90\:dark, html.var.auto .sf-c-txt-firebrick\:90\:dark { color: hsl(0, 68%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:95\:dark, html.var.auto .sf-c-txt-firebrick\:95\:dark { color: hsl(0, 68%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-firebrick\:100\:dark, html.var.auto .sf-c-txt-firebrick\:100\:dark { color: hsl(0, 68%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/floralwhite.css b/src/colors/20/floralwhite.css index aef3305..f46c6ae 100644 --- a/src/colors/20/floralwhite.css +++ b/src/colors/20/floralwhite.css @@ -1,4 +1,4 @@ -:root { +[class*='floralwhite'] { --sf-c-floralwhite: 40 100% 97%; --sf-c-floralwhite-0: 40 100% 0%; --sf-c-floralwhite-5: 40 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-floralwhite\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-floralwhite\:95\:dark, html.var.auto .sf-c-floralwhite\:95\:dark { color: hsl(40, 100%, 95%); background: hsl(40, 100%, 5%) } html.var[data-theme='auto'] .sf-c-floralwhite\:100\:dark, html.var.auto .sf-c-floralwhite\:100\:dark { color: hsl(40, 100%, 95%); background: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite, html.auto .sf-c-txt-floralwhite { color: hsl(40, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0, html.auto .sf-c-txt-floralwhite\:0 { color: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:5, html.auto .sf-c-txt-floralwhite\:5 { color: hsl(40, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10, html.auto .sf-c-txt-floralwhite\:10 { color: hsl(40, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:15, html.auto .sf-c-txt-floralwhite\:15 { color: hsl(40, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20, html.auto .sf-c-txt-floralwhite\:20 { color: hsl(40, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:25, html.auto .sf-c-txt-floralwhite\:25 { color: hsl(40, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30, html.auto .sf-c-txt-floralwhite\:30 { color: hsl(40, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:35, html.auto .sf-c-txt-floralwhite\:35 { color: hsl(40, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40, html.auto .sf-c-txt-floralwhite\:40 { color: hsl(40, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:45, html.auto .sf-c-txt-floralwhite\:45 { color: hsl(40, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50, html.auto .sf-c-txt-floralwhite\:50 { color: hsl(40, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:55, html.auto .sf-c-txt-floralwhite\:55 { color: hsl(40, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60, html.auto .sf-c-txt-floralwhite\:60 { color: hsl(40, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:65, html.auto .sf-c-txt-floralwhite\:65 { color: hsl(40, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70, html.auto .sf-c-txt-floralwhite\:70 { color: hsl(40, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:75, html.auto .sf-c-txt-floralwhite\:75 { color: hsl(40, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80, html.auto .sf-c-txt-floralwhite\:80 { color: hsl(40, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:85, html.auto .sf-c-txt-floralwhite\:85 { color: hsl(40, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90, html.auto .sf-c-txt-floralwhite\:90 { color: hsl(40, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:95, html.auto .sf-c-txt-floralwhite\:95 { color: hsl(40, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100, html.auto .sf-c-txt-floralwhite\:100 { color: hsl(40, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite, html.var.auto .sf-c-txt-floralwhite { color: hsl(40, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0, html.var.auto .sf-c-txt-floralwhite\:0 { color: hsl(40, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:5, html.var.auto .sf-c-txt-floralwhite\:5 { color: hsl(40, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10, html.var.auto .sf-c-txt-floralwhite\:10 { color: hsl(40, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:15, html.var.auto .sf-c-txt-floralwhite\:15 { color: hsl(40, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20, html.var.auto .sf-c-txt-floralwhite\:20 { color: hsl(40, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:25, html.var.auto .sf-c-txt-floralwhite\:25 { color: hsl(40, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30, html.var.auto .sf-c-txt-floralwhite\:30 { color: hsl(40, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:35, html.var.auto .sf-c-txt-floralwhite\:35 { color: hsl(40, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40, html.var.auto .sf-c-txt-floralwhite\:40 { color: hsl(40, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:45, html.var.auto .sf-c-txt-floralwhite\:45 { color: hsl(40, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50, html.var.auto .sf-c-txt-floralwhite\:50 { color: hsl(40, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:55, html.var.auto .sf-c-txt-floralwhite\:55 { color: hsl(40, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60, html.var.auto .sf-c-txt-floralwhite\:60 { color: hsl(40, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:65, html.var.auto .sf-c-txt-floralwhite\:65 { color: hsl(40, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70, html.var.auto .sf-c-txt-floralwhite\:70 { color: hsl(40, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:75, html.var.auto .sf-c-txt-floralwhite\:75 { color: hsl(40, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80, html.var.auto .sf-c-txt-floralwhite\:80 { color: hsl(40, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:85, html.var.auto .sf-c-txt-floralwhite\:85 { color: hsl(40, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90, html.var.auto .sf-c-txt-floralwhite\:90 { color: hsl(40, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:95, html.var.auto .sf-c-txt-floralwhite\:95 { color: hsl(40, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100, html.var.auto .sf-c-txt-floralwhite\:100 { color: hsl(40, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:dark, html.auto .sf-c-txt-floralwhite\:dark { color: hsl(40, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0\:dark, html.auto .sf-c-txt-floralwhite\:0\:dark { color: hsl(40, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:5\:dark, html.auto .sf-c-txt-floralwhite\:5\:dark { color: hsl(40, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10\:dark, html.auto .sf-c-txt-floralwhite\:10\:dark { color: hsl(40, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:15\:dark, html.auto .sf-c-txt-floralwhite\:15\:dark { color: hsl(40, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20\:dark, html.auto .sf-c-txt-floralwhite\:20\:dark { color: hsl(40, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:25\:dark, html.auto .sf-c-txt-floralwhite\:25\:dark { color: hsl(40, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30\:dark, html.auto .sf-c-txt-floralwhite\:30\:dark { color: hsl(40, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:35\:dark, html.auto .sf-c-txt-floralwhite\:35\:dark { color: hsl(40, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40\:dark, html.auto .sf-c-txt-floralwhite\:40\:dark { color: hsl(40, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:45\:dark, html.auto .sf-c-txt-floralwhite\:45\:dark { color: hsl(40, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50\:dark, html.auto .sf-c-txt-floralwhite\:50\:dark { color: hsl(40, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:55\:dark, html.auto .sf-c-txt-floralwhite\:55\:dark { color: hsl(40, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60\:dark, html.auto .sf-c-txt-floralwhite\:60\:dark { color: hsl(40, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:65\:dark, html.auto .sf-c-txt-floralwhite\:65\:dark { color: hsl(40, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70\:dark, html.auto .sf-c-txt-floralwhite\:70\:dark { color: hsl(40, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:75\:dark, html.auto .sf-c-txt-floralwhite\:75\:dark { color: hsl(40, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80\:dark, html.auto .sf-c-txt-floralwhite\:80\:dark { color: hsl(40, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:85\:dark, html.auto .sf-c-txt-floralwhite\:85\:dark { color: hsl(40, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90\:dark, html.auto .sf-c-txt-floralwhite\:90\:dark { color: hsl(40, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:95\:dark, html.auto .sf-c-txt-floralwhite\:95\:dark { color: hsl(40, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100\:dark, html.auto .sf-c-txt-floralwhite\:100\:dark { color: hsl(40, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:dark, html.var.auto .sf-c-txt-floralwhite\:dark { color: hsl(40, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:0\:dark, html.var.auto .sf-c-txt-floralwhite\:0\:dark { color: hsl(40, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:5\:dark, html.var.auto .sf-c-txt-floralwhite\:5\:dark { color: hsl(40, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:10\:dark, html.var.auto .sf-c-txt-floralwhite\:10\:dark { color: hsl(40, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:15\:dark, html.var.auto .sf-c-txt-floralwhite\:15\:dark { color: hsl(40, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:20\:dark, html.var.auto .sf-c-txt-floralwhite\:20\:dark { color: hsl(40, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:25\:dark, html.var.auto .sf-c-txt-floralwhite\:25\:dark { color: hsl(40, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:30\:dark, html.var.auto .sf-c-txt-floralwhite\:30\:dark { color: hsl(40, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:35\:dark, html.var.auto .sf-c-txt-floralwhite\:35\:dark { color: hsl(40, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:40\:dark, html.var.auto .sf-c-txt-floralwhite\:40\:dark { color: hsl(40, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:45\:dark, html.var.auto .sf-c-txt-floralwhite\:45\:dark { color: hsl(40, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:50\:dark, html.var.auto .sf-c-txt-floralwhite\:50\:dark { color: hsl(40, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:55\:dark, html.var.auto .sf-c-txt-floralwhite\:55\:dark { color: hsl(40, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:60\:dark, html.var.auto .sf-c-txt-floralwhite\:60\:dark { color: hsl(40, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:65\:dark, html.var.auto .sf-c-txt-floralwhite\:65\:dark { color: hsl(40, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:70\:dark, html.var.auto .sf-c-txt-floralwhite\:70\:dark { color: hsl(40, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:75\:dark, html.var.auto .sf-c-txt-floralwhite\:75\:dark { color: hsl(40, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:80\:dark, html.var.auto .sf-c-txt-floralwhite\:80\:dark { color: hsl(40, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:85\:dark, html.var.auto .sf-c-txt-floralwhite\:85\:dark { color: hsl(40, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:90\:dark, html.var.auto .sf-c-txt-floralwhite\:90\:dark { color: hsl(40, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:95\:dark, html.var.auto .sf-c-txt-floralwhite\:95\:dark { color: hsl(40, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-floralwhite\:100\:dark, html.var.auto .sf-c-txt-floralwhite\:100\:dark { color: hsl(40, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/forestgreen.css b/src/colors/20/forestgreen.css index 8db147e..350b82e 100644 --- a/src/colors/20/forestgreen.css +++ b/src/colors/20/forestgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='forestgreen'] { --sf-c-forestgreen: 120 61% 34%; --sf-c-forestgreen-0: 120 61% 0%; --sf-c-forestgreen-5: 120 61% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-forestgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-forestgreen\:95\:dark, html.var.auto .sf-c-forestgreen\:95\:dark { color: hsl(120, 61%, 95%); background: hsl(120, 61%, 5%) } html.var[data-theme='auto'] .sf-c-forestgreen\:100\:dark, html.var.auto .sf-c-forestgreen\:100\:dark { color: hsl(120, 61%, 95%); background: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen, html.auto .sf-c-txt-forestgreen { color: hsl(120, 61%, 34%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0, html.auto .sf-c-txt-forestgreen\:0 { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:5, html.auto .sf-c-txt-forestgreen\:5 { color: hsl(120, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10, html.auto .sf-c-txt-forestgreen\:10 { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:15, html.auto .sf-c-txt-forestgreen\:15 { color: hsl(120, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20, html.auto .sf-c-txt-forestgreen\:20 { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:25, html.auto .sf-c-txt-forestgreen\:25 { color: hsl(120, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30, html.auto .sf-c-txt-forestgreen\:30 { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:35, html.auto .sf-c-txt-forestgreen\:35 { color: hsl(120, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40, html.auto .sf-c-txt-forestgreen\:40 { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:45, html.auto .sf-c-txt-forestgreen\:45 { color: hsl(120, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50, html.auto .sf-c-txt-forestgreen\:50 { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:55, html.auto .sf-c-txt-forestgreen\:55 { color: hsl(120, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60, html.auto .sf-c-txt-forestgreen\:60 { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:65, html.auto .sf-c-txt-forestgreen\:65 { color: hsl(120, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70, html.auto .sf-c-txt-forestgreen\:70 { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:75, html.auto .sf-c-txt-forestgreen\:75 { color: hsl(120, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80, html.auto .sf-c-txt-forestgreen\:80 { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:85, html.auto .sf-c-txt-forestgreen\:85 { color: hsl(120, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90, html.auto .sf-c-txt-forestgreen\:90 { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:95, html.auto .sf-c-txt-forestgreen\:95 { color: hsl(120, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100, html.auto .sf-c-txt-forestgreen\:100 { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen, html.var.auto .sf-c-txt-forestgreen { color: hsl(120, 61%, 34%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0, html.var.auto .sf-c-txt-forestgreen\:0 { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:5, html.var.auto .sf-c-txt-forestgreen\:5 { color: hsl(120, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10, html.var.auto .sf-c-txt-forestgreen\:10 { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:15, html.var.auto .sf-c-txt-forestgreen\:15 { color: hsl(120, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20, html.var.auto .sf-c-txt-forestgreen\:20 { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:25, html.var.auto .sf-c-txt-forestgreen\:25 { color: hsl(120, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30, html.var.auto .sf-c-txt-forestgreen\:30 { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:35, html.var.auto .sf-c-txt-forestgreen\:35 { color: hsl(120, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40, html.var.auto .sf-c-txt-forestgreen\:40 { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:45, html.var.auto .sf-c-txt-forestgreen\:45 { color: hsl(120, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50, html.var.auto .sf-c-txt-forestgreen\:50 { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:55, html.var.auto .sf-c-txt-forestgreen\:55 { color: hsl(120, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60, html.var.auto .sf-c-txt-forestgreen\:60 { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:65, html.var.auto .sf-c-txt-forestgreen\:65 { color: hsl(120, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70, html.var.auto .sf-c-txt-forestgreen\:70 { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:75, html.var.auto .sf-c-txt-forestgreen\:75 { color: hsl(120, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80, html.var.auto .sf-c-txt-forestgreen\:80 { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:85, html.var.auto .sf-c-txt-forestgreen\:85 { color: hsl(120, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90, html.var.auto .sf-c-txt-forestgreen\:90 { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:95, html.var.auto .sf-c-txt-forestgreen\:95 { color: hsl(120, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100, html.var.auto .sf-c-txt-forestgreen\:100 { color: hsl(120, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:dark, html.auto .sf-c-txt-forestgreen\:dark { color: hsl(120, 61%, 34%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0\:dark, html.auto .sf-c-txt-forestgreen\:0\:dark { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:5\:dark, html.auto .sf-c-txt-forestgreen\:5\:dark { color: hsl(120, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10\:dark, html.auto .sf-c-txt-forestgreen\:10\:dark { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:15\:dark, html.auto .sf-c-txt-forestgreen\:15\:dark { color: hsl(120, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20\:dark, html.auto .sf-c-txt-forestgreen\:20\:dark { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:25\:dark, html.auto .sf-c-txt-forestgreen\:25\:dark { color: hsl(120, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30\:dark, html.auto .sf-c-txt-forestgreen\:30\:dark { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:35\:dark, html.auto .sf-c-txt-forestgreen\:35\:dark { color: hsl(120, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40\:dark, html.auto .sf-c-txt-forestgreen\:40\:dark { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:45\:dark, html.auto .sf-c-txt-forestgreen\:45\:dark { color: hsl(120, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50\:dark, html.auto .sf-c-txt-forestgreen\:50\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:55\:dark, html.auto .sf-c-txt-forestgreen\:55\:dark { color: hsl(120, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60\:dark, html.auto .sf-c-txt-forestgreen\:60\:dark { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:65\:dark, html.auto .sf-c-txt-forestgreen\:65\:dark { color: hsl(120, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70\:dark, html.auto .sf-c-txt-forestgreen\:70\:dark { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:75\:dark, html.auto .sf-c-txt-forestgreen\:75\:dark { color: hsl(120, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80\:dark, html.auto .sf-c-txt-forestgreen\:80\:dark { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:85\:dark, html.auto .sf-c-txt-forestgreen\:85\:dark { color: hsl(120, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90\:dark, html.auto .sf-c-txt-forestgreen\:90\:dark { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:95\:dark, html.auto .sf-c-txt-forestgreen\:95\:dark { color: hsl(120, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100\:dark, html.auto .sf-c-txt-forestgreen\:100\:dark { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:dark, html.var.auto .sf-c-txt-forestgreen\:dark { color: hsl(120, 61%, 34%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:0\:dark, html.var.auto .sf-c-txt-forestgreen\:0\:dark { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:5\:dark, html.var.auto .sf-c-txt-forestgreen\:5\:dark { color: hsl(120, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:10\:dark, html.var.auto .sf-c-txt-forestgreen\:10\:dark { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:15\:dark, html.var.auto .sf-c-txt-forestgreen\:15\:dark { color: hsl(120, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:20\:dark, html.var.auto .sf-c-txt-forestgreen\:20\:dark { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:25\:dark, html.var.auto .sf-c-txt-forestgreen\:25\:dark { color: hsl(120, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:30\:dark, html.var.auto .sf-c-txt-forestgreen\:30\:dark { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:35\:dark, html.var.auto .sf-c-txt-forestgreen\:35\:dark { color: hsl(120, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:40\:dark, html.var.auto .sf-c-txt-forestgreen\:40\:dark { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:45\:dark, html.var.auto .sf-c-txt-forestgreen\:45\:dark { color: hsl(120, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:50\:dark, html.var.auto .sf-c-txt-forestgreen\:50\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:55\:dark, html.var.auto .sf-c-txt-forestgreen\:55\:dark { color: hsl(120, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:60\:dark, html.var.auto .sf-c-txt-forestgreen\:60\:dark { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:65\:dark, html.var.auto .sf-c-txt-forestgreen\:65\:dark { color: hsl(120, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:70\:dark, html.var.auto .sf-c-txt-forestgreen\:70\:dark { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:75\:dark, html.var.auto .sf-c-txt-forestgreen\:75\:dark { color: hsl(120, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:80\:dark, html.var.auto .sf-c-txt-forestgreen\:80\:dark { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:85\:dark, html.var.auto .sf-c-txt-forestgreen\:85\:dark { color: hsl(120, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:90\:dark, html.var.auto .sf-c-txt-forestgreen\:90\:dark { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:95\:dark, html.var.auto .sf-c-txt-forestgreen\:95\:dark { color: hsl(120, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-forestgreen\:100\:dark, html.var.auto .sf-c-txt-forestgreen\:100\:dark { color: hsl(120, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/fuchsia.css b/src/colors/20/fuchsia.css index f8aa939..efe0d44 100644 --- a/src/colors/20/fuchsia.css +++ b/src/colors/20/fuchsia.css @@ -1,4 +1,4 @@ -:root { +[class*='fuchsia'] { --sf-c-fuchsia: 300 100% 50%; --sf-c-fuchsia-0: 300 100% 0%; --sf-c-fuchsia-5: 300 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark, html.dark .sf-c-txt-fu html.var[data-theme='auto'] .sf-c-fuchsia\:95\:dark, html.var.auto .sf-c-fuchsia\:95\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 5%) } html.var[data-theme='auto'] .sf-c-fuchsia\:100\:dark, html.var.auto .sf-c-fuchsia\:100\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia, html.auto .sf-c-txt-fuchsia { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0, html.auto .sf-c-txt-fuchsia\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:5, html.auto .sf-c-txt-fuchsia\:5 { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10, html.auto .sf-c-txt-fuchsia\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:15, html.auto .sf-c-txt-fuchsia\:15 { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20, html.auto .sf-c-txt-fuchsia\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:25, html.auto .sf-c-txt-fuchsia\:25 { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30, html.auto .sf-c-txt-fuchsia\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:35, html.auto .sf-c-txt-fuchsia\:35 { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40, html.auto .sf-c-txt-fuchsia\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:45, html.auto .sf-c-txt-fuchsia\:45 { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50, html.auto .sf-c-txt-fuchsia\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:55, html.auto .sf-c-txt-fuchsia\:55 { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60, html.auto .sf-c-txt-fuchsia\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:65, html.auto .sf-c-txt-fuchsia\:65 { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70, html.auto .sf-c-txt-fuchsia\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:75, html.auto .sf-c-txt-fuchsia\:75 { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80, html.auto .sf-c-txt-fuchsia\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:85, html.auto .sf-c-txt-fuchsia\:85 { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90, html.auto .sf-c-txt-fuchsia\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:95, html.auto .sf-c-txt-fuchsia\:95 { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100, html.auto .sf-c-txt-fuchsia\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia, html.var.auto .sf-c-txt-fuchsia { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0, html.var.auto .sf-c-txt-fuchsia\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:5, html.var.auto .sf-c-txt-fuchsia\:5 { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10, html.var.auto .sf-c-txt-fuchsia\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:15, html.var.auto .sf-c-txt-fuchsia\:15 { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20, html.var.auto .sf-c-txt-fuchsia\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:25, html.var.auto .sf-c-txt-fuchsia\:25 { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30, html.var.auto .sf-c-txt-fuchsia\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:35, html.var.auto .sf-c-txt-fuchsia\:35 { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40, html.var.auto .sf-c-txt-fuchsia\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:45, html.var.auto .sf-c-txt-fuchsia\:45 { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50, html.var.auto .sf-c-txt-fuchsia\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:55, html.var.auto .sf-c-txt-fuchsia\:55 { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60, html.var.auto .sf-c-txt-fuchsia\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:65, html.var.auto .sf-c-txt-fuchsia\:65 { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70, html.var.auto .sf-c-txt-fuchsia\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:75, html.var.auto .sf-c-txt-fuchsia\:75 { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80, html.var.auto .sf-c-txt-fuchsia\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:85, html.var.auto .sf-c-txt-fuchsia\:85 { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90, html.var.auto .sf-c-txt-fuchsia\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:95, html.var.auto .sf-c-txt-fuchsia\:95 { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100, html.var.auto .sf-c-txt-fuchsia\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark, html.auto .sf-c-txt-fuchsia\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark, html.auto .sf-c-txt-fuchsia\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:5\:dark, html.auto .sf-c-txt-fuchsia\:5\:dark { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark, html.auto .sf-c-txt-fuchsia\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:15\:dark, html.auto .sf-c-txt-fuchsia\:15\:dark { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark, html.auto .sf-c-txt-fuchsia\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:25\:dark, html.auto .sf-c-txt-fuchsia\:25\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark, html.auto .sf-c-txt-fuchsia\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:35\:dark, html.auto .sf-c-txt-fuchsia\:35\:dark { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark, html.auto .sf-c-txt-fuchsia\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:45\:dark, html.auto .sf-c-txt-fuchsia\:45\:dark { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark, html.auto .sf-c-txt-fuchsia\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:55\:dark, html.auto .sf-c-txt-fuchsia\:55\:dark { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark, html.auto .sf-c-txt-fuchsia\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:65\:dark, html.auto .sf-c-txt-fuchsia\:65\:dark { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark, html.auto .sf-c-txt-fuchsia\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:75\:dark, html.auto .sf-c-txt-fuchsia\:75\:dark { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark, html.auto .sf-c-txt-fuchsia\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:85\:dark, html.auto .sf-c-txt-fuchsia\:85\:dark { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark, html.auto .sf-c-txt-fuchsia\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:95\:dark, html.auto .sf-c-txt-fuchsia\:95\:dark { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark, html.auto .sf-c-txt-fuchsia\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark, html.var.auto .sf-c-txt-fuchsia\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark, html.var.auto .sf-c-txt-fuchsia\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:5\:dark, html.var.auto .sf-c-txt-fuchsia\:5\:dark { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark, html.var.auto .sf-c-txt-fuchsia\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:15\:dark, html.var.auto .sf-c-txt-fuchsia\:15\:dark { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark, html.var.auto .sf-c-txt-fuchsia\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:25\:dark, html.var.auto .sf-c-txt-fuchsia\:25\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark, html.var.auto .sf-c-txt-fuchsia\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:35\:dark, html.var.auto .sf-c-txt-fuchsia\:35\:dark { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark, html.var.auto .sf-c-txt-fuchsia\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:45\:dark, html.var.auto .sf-c-txt-fuchsia\:45\:dark { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark, html.var.auto .sf-c-txt-fuchsia\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:55\:dark, html.var.auto .sf-c-txt-fuchsia\:55\:dark { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark, html.var.auto .sf-c-txt-fuchsia\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:65\:dark, html.var.auto .sf-c-txt-fuchsia\:65\:dark { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark, html.var.auto .sf-c-txt-fuchsia\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:75\:dark, html.var.auto .sf-c-txt-fuchsia\:75\:dark { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark, html.var.auto .sf-c-txt-fuchsia\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:85\:dark, html.var.auto .sf-c-txt-fuchsia\:85\:dark { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark, html.var.auto .sf-c-txt-fuchsia\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:95\:dark, html.var.auto .sf-c-txt-fuchsia\:95\:dark { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark, html.var.auto .sf-c-txt-fuchsia\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/gainsboro.css b/src/colors/20/gainsboro.css index ea7dd87..17bb625 100644 --- a/src/colors/20/gainsboro.css +++ b/src/colors/20/gainsboro.css @@ -1,4 +1,4 @@ -:root { +[class*='gainsboro'] { --sf-c-gainsboro: 0 0% 86%; --sf-c-gainsboro-0: 0 0% 0%; --sf-c-gainsboro-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-gainsboro\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-gainsboro\:95\:dark, html.var.auto .sf-c-gainsboro\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-gainsboro\:100\:dark, html.var.auto .sf-c-gainsboro\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro, html.auto .sf-c-txt-gainsboro { color: hsl(0, 0%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0, html.auto .sf-c-txt-gainsboro\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:5, html.auto .sf-c-txt-gainsboro\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10, html.auto .sf-c-txt-gainsboro\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:15, html.auto .sf-c-txt-gainsboro\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20, html.auto .sf-c-txt-gainsboro\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:25, html.auto .sf-c-txt-gainsboro\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30, html.auto .sf-c-txt-gainsboro\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:35, html.auto .sf-c-txt-gainsboro\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40, html.auto .sf-c-txt-gainsboro\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:45, html.auto .sf-c-txt-gainsboro\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50, html.auto .sf-c-txt-gainsboro\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:55, html.auto .sf-c-txt-gainsboro\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60, html.auto .sf-c-txt-gainsboro\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:65, html.auto .sf-c-txt-gainsboro\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70, html.auto .sf-c-txt-gainsboro\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:75, html.auto .sf-c-txt-gainsboro\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80, html.auto .sf-c-txt-gainsboro\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:85, html.auto .sf-c-txt-gainsboro\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90, html.auto .sf-c-txt-gainsboro\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:95, html.auto .sf-c-txt-gainsboro\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100, html.auto .sf-c-txt-gainsboro\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro, html.var.auto .sf-c-txt-gainsboro { color: hsl(0, 0%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0, html.var.auto .sf-c-txt-gainsboro\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:5, html.var.auto .sf-c-txt-gainsboro\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10, html.var.auto .sf-c-txt-gainsboro\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:15, html.var.auto .sf-c-txt-gainsboro\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20, html.var.auto .sf-c-txt-gainsboro\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:25, html.var.auto .sf-c-txt-gainsboro\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30, html.var.auto .sf-c-txt-gainsboro\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:35, html.var.auto .sf-c-txt-gainsboro\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40, html.var.auto .sf-c-txt-gainsboro\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:45, html.var.auto .sf-c-txt-gainsboro\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50, html.var.auto .sf-c-txt-gainsboro\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:55, html.var.auto .sf-c-txt-gainsboro\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60, html.var.auto .sf-c-txt-gainsboro\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:65, html.var.auto .sf-c-txt-gainsboro\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70, html.var.auto .sf-c-txt-gainsboro\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:75, html.var.auto .sf-c-txt-gainsboro\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80, html.var.auto .sf-c-txt-gainsboro\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:85, html.var.auto .sf-c-txt-gainsboro\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90, html.var.auto .sf-c-txt-gainsboro\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:95, html.var.auto .sf-c-txt-gainsboro\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100, html.var.auto .sf-c-txt-gainsboro\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:dark, html.auto .sf-c-txt-gainsboro\:dark { color: hsl(0, 0%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0\:dark, html.auto .sf-c-txt-gainsboro\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:5\:dark, html.auto .sf-c-txt-gainsboro\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10\:dark, html.auto .sf-c-txt-gainsboro\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:15\:dark, html.auto .sf-c-txt-gainsboro\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20\:dark, html.auto .sf-c-txt-gainsboro\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:25\:dark, html.auto .sf-c-txt-gainsboro\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30\:dark, html.auto .sf-c-txt-gainsboro\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:35\:dark, html.auto .sf-c-txt-gainsboro\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40\:dark, html.auto .sf-c-txt-gainsboro\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:45\:dark, html.auto .sf-c-txt-gainsboro\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50\:dark, html.auto .sf-c-txt-gainsboro\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:55\:dark, html.auto .sf-c-txt-gainsboro\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60\:dark, html.auto .sf-c-txt-gainsboro\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:65\:dark, html.auto .sf-c-txt-gainsboro\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70\:dark, html.auto .sf-c-txt-gainsboro\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:75\:dark, html.auto .sf-c-txt-gainsboro\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80\:dark, html.auto .sf-c-txt-gainsboro\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:85\:dark, html.auto .sf-c-txt-gainsboro\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90\:dark, html.auto .sf-c-txt-gainsboro\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:95\:dark, html.auto .sf-c-txt-gainsboro\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100\:dark, html.auto .sf-c-txt-gainsboro\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:dark, html.var.auto .sf-c-txt-gainsboro\:dark { color: hsl(0, 0%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:0\:dark, html.var.auto .sf-c-txt-gainsboro\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:5\:dark, html.var.auto .sf-c-txt-gainsboro\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:10\:dark, html.var.auto .sf-c-txt-gainsboro\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:15\:dark, html.var.auto .sf-c-txt-gainsboro\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:20\:dark, html.var.auto .sf-c-txt-gainsboro\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:25\:dark, html.var.auto .sf-c-txt-gainsboro\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:30\:dark, html.var.auto .sf-c-txt-gainsboro\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:35\:dark, html.var.auto .sf-c-txt-gainsboro\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:40\:dark, html.var.auto .sf-c-txt-gainsboro\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:45\:dark, html.var.auto .sf-c-txt-gainsboro\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:50\:dark, html.var.auto .sf-c-txt-gainsboro\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:55\:dark, html.var.auto .sf-c-txt-gainsboro\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:60\:dark, html.var.auto .sf-c-txt-gainsboro\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:65\:dark, html.var.auto .sf-c-txt-gainsboro\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:70\:dark, html.var.auto .sf-c-txt-gainsboro\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:75\:dark, html.var.auto .sf-c-txt-gainsboro\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:80\:dark, html.var.auto .sf-c-txt-gainsboro\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:85\:dark, html.var.auto .sf-c-txt-gainsboro\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:90\:dark, html.var.auto .sf-c-txt-gainsboro\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:95\:dark, html.var.auto .sf-c-txt-gainsboro\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gainsboro\:100\:dark, html.var.auto .sf-c-txt-gainsboro\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/ghostwhite.css b/src/colors/20/ghostwhite.css index aac0f23..3dcf8e2 100644 --- a/src/colors/20/ghostwhite.css +++ b/src/colors/20/ghostwhite.css @@ -1,4 +1,4 @@ -:root { +[class*='ghostwhite'] { --sf-c-ghostwhite: 240 100% 99%; --sf-c-ghostwhite-0: 240 100% 0%; --sf-c-ghostwhite-5: 240 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-ghostwhite\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-ghostwhite\:95\:dark, html.var.auto .sf-c-ghostwhite\:95\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 5%) } html.var[data-theme='auto'] .sf-c-ghostwhite\:100\:dark, html.var.auto .sf-c-ghostwhite\:100\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite, html.auto .sf-c-txt-ghostwhite { color: hsl(240, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0, html.auto .sf-c-txt-ghostwhite\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:5, html.auto .sf-c-txt-ghostwhite\:5 { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10, html.auto .sf-c-txt-ghostwhite\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:15, html.auto .sf-c-txt-ghostwhite\:15 { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20, html.auto .sf-c-txt-ghostwhite\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:25, html.auto .sf-c-txt-ghostwhite\:25 { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30, html.auto .sf-c-txt-ghostwhite\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:35, html.auto .sf-c-txt-ghostwhite\:35 { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40, html.auto .sf-c-txt-ghostwhite\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:45, html.auto .sf-c-txt-ghostwhite\:45 { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50, html.auto .sf-c-txt-ghostwhite\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:55, html.auto .sf-c-txt-ghostwhite\:55 { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60, html.auto .sf-c-txt-ghostwhite\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:65, html.auto .sf-c-txt-ghostwhite\:65 { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70, html.auto .sf-c-txt-ghostwhite\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:75, html.auto .sf-c-txt-ghostwhite\:75 { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80, html.auto .sf-c-txt-ghostwhite\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:85, html.auto .sf-c-txt-ghostwhite\:85 { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90, html.auto .sf-c-txt-ghostwhite\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:95, html.auto .sf-c-txt-ghostwhite\:95 { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100, html.auto .sf-c-txt-ghostwhite\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite, html.var.auto .sf-c-txt-ghostwhite { color: hsl(240, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0, html.var.auto .sf-c-txt-ghostwhite\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:5, html.var.auto .sf-c-txt-ghostwhite\:5 { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10, html.var.auto .sf-c-txt-ghostwhite\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:15, html.var.auto .sf-c-txt-ghostwhite\:15 { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20, html.var.auto .sf-c-txt-ghostwhite\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:25, html.var.auto .sf-c-txt-ghostwhite\:25 { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30, html.var.auto .sf-c-txt-ghostwhite\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:35, html.var.auto .sf-c-txt-ghostwhite\:35 { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40, html.var.auto .sf-c-txt-ghostwhite\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:45, html.var.auto .sf-c-txt-ghostwhite\:45 { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50, html.var.auto .sf-c-txt-ghostwhite\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:55, html.var.auto .sf-c-txt-ghostwhite\:55 { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60, html.var.auto .sf-c-txt-ghostwhite\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:65, html.var.auto .sf-c-txt-ghostwhite\:65 { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70, html.var.auto .sf-c-txt-ghostwhite\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:75, html.var.auto .sf-c-txt-ghostwhite\:75 { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80, html.var.auto .sf-c-txt-ghostwhite\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:85, html.var.auto .sf-c-txt-ghostwhite\:85 { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90, html.var.auto .sf-c-txt-ghostwhite\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:95, html.var.auto .sf-c-txt-ghostwhite\:95 { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100, html.var.auto .sf-c-txt-ghostwhite\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:dark, html.auto .sf-c-txt-ghostwhite\:dark { color: hsl(240, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0\:dark, html.auto .sf-c-txt-ghostwhite\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:5\:dark, html.auto .sf-c-txt-ghostwhite\:5\:dark { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10\:dark, html.auto .sf-c-txt-ghostwhite\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:15\:dark, html.auto .sf-c-txt-ghostwhite\:15\:dark { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20\:dark, html.auto .sf-c-txt-ghostwhite\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:25\:dark, html.auto .sf-c-txt-ghostwhite\:25\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30\:dark, html.auto .sf-c-txt-ghostwhite\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:35\:dark, html.auto .sf-c-txt-ghostwhite\:35\:dark { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40\:dark, html.auto .sf-c-txt-ghostwhite\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:45\:dark, html.auto .sf-c-txt-ghostwhite\:45\:dark { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50\:dark, html.auto .sf-c-txt-ghostwhite\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:55\:dark, html.auto .sf-c-txt-ghostwhite\:55\:dark { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60\:dark, html.auto .sf-c-txt-ghostwhite\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:65\:dark, html.auto .sf-c-txt-ghostwhite\:65\:dark { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70\:dark, html.auto .sf-c-txt-ghostwhite\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:75\:dark, html.auto .sf-c-txt-ghostwhite\:75\:dark { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80\:dark, html.auto .sf-c-txt-ghostwhite\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:85\:dark, html.auto .sf-c-txt-ghostwhite\:85\:dark { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90\:dark, html.auto .sf-c-txt-ghostwhite\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:95\:dark, html.auto .sf-c-txt-ghostwhite\:95\:dark { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100\:dark, html.auto .sf-c-txt-ghostwhite\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:dark, html.var.auto .sf-c-txt-ghostwhite\:dark { color: hsl(240, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:0\:dark, html.var.auto .sf-c-txt-ghostwhite\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:5\:dark, html.var.auto .sf-c-txt-ghostwhite\:5\:dark { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:10\:dark, html.var.auto .sf-c-txt-ghostwhite\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:15\:dark, html.var.auto .sf-c-txt-ghostwhite\:15\:dark { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:20\:dark, html.var.auto .sf-c-txt-ghostwhite\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:25\:dark, html.var.auto .sf-c-txt-ghostwhite\:25\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:30\:dark, html.var.auto .sf-c-txt-ghostwhite\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:35\:dark, html.var.auto .sf-c-txt-ghostwhite\:35\:dark { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:40\:dark, html.var.auto .sf-c-txt-ghostwhite\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:45\:dark, html.var.auto .sf-c-txt-ghostwhite\:45\:dark { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:50\:dark, html.var.auto .sf-c-txt-ghostwhite\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:55\:dark, html.var.auto .sf-c-txt-ghostwhite\:55\:dark { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:60\:dark, html.var.auto .sf-c-txt-ghostwhite\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:65\:dark, html.var.auto .sf-c-txt-ghostwhite\:65\:dark { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:70\:dark, html.var.auto .sf-c-txt-ghostwhite\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:75\:dark, html.var.auto .sf-c-txt-ghostwhite\:75\:dark { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:80\:dark, html.var.auto .sf-c-txt-ghostwhite\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:85\:dark, html.var.auto .sf-c-txt-ghostwhite\:85\:dark { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:90\:dark, html.var.auto .sf-c-txt-ghostwhite\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:95\:dark, html.var.auto .sf-c-txt-ghostwhite\:95\:dark { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-ghostwhite\:100\:dark, html.var.auto .sf-c-txt-ghostwhite\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/gold.css b/src/colors/20/gold.css index 3f46b28..50161f0 100644 --- a/src/colors/20/gold.css +++ b/src/colors/20/gold.css @@ -1,4 +1,4 @@ -:root { +[class*='gold'] { --sf-c-gold: 51 100% 50%; --sf-c-gold-0: 51 100% 0%; --sf-c-gold-5: 51 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-gold\:100\:dark, html.dark .sf-c-txt-gold\ html.var[data-theme='auto'] .sf-c-gold\:95\:dark, html.var.auto .sf-c-gold\:95\:dark { color: hsl(51, 100%, 95%); background: hsl(51, 100%, 5%) } html.var[data-theme='auto'] .sf-c-gold\:100\:dark, html.var.auto .sf-c-gold\:100\:dark { color: hsl(51, 100%, 95%); background: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold, html.auto .sf-c-txt-gold { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:0, html.auto .sf-c-txt-gold\:0 { color: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:5, html.auto .sf-c-txt-gold\:5 { color: hsl(51, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:10, html.auto .sf-c-txt-gold\:10 { color: hsl(51, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:15, html.auto .sf-c-txt-gold\:15 { color: hsl(51, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:20, html.auto .sf-c-txt-gold\:20 { color: hsl(51, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:25, html.auto .sf-c-txt-gold\:25 { color: hsl(51, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:30, html.auto .sf-c-txt-gold\:30 { color: hsl(51, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:35, html.auto .sf-c-txt-gold\:35 { color: hsl(51, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:40, html.auto .sf-c-txt-gold\:40 { color: hsl(51, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:45, html.auto .sf-c-txt-gold\:45 { color: hsl(51, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:50, html.auto .sf-c-txt-gold\:50 { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:55, html.auto .sf-c-txt-gold\:55 { color: hsl(51, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:60, html.auto .sf-c-txt-gold\:60 { color: hsl(51, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:65, html.auto .sf-c-txt-gold\:65 { color: hsl(51, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:70, html.auto .sf-c-txt-gold\:70 { color: hsl(51, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:75, html.auto .sf-c-txt-gold\:75 { color: hsl(51, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:80, html.auto .sf-c-txt-gold\:80 { color: hsl(51, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:85, html.auto .sf-c-txt-gold\:85 { color: hsl(51, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:90, html.auto .sf-c-txt-gold\:90 { color: hsl(51, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:95, html.auto .sf-c-txt-gold\:95 { color: hsl(51, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:100, html.auto .sf-c-txt-gold\:100 { color: hsl(51, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gold, html.var.auto .sf-c-txt-gold { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:0, html.var.auto .sf-c-txt-gold\:0 { color: hsl(51, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:5, html.var.auto .sf-c-txt-gold\:5 { color: hsl(51, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:10, html.var.auto .sf-c-txt-gold\:10 { color: hsl(51, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:15, html.var.auto .sf-c-txt-gold\:15 { color: hsl(51, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:20, html.var.auto .sf-c-txt-gold\:20 { color: hsl(51, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:25, html.var.auto .sf-c-txt-gold\:25 { color: hsl(51, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:30, html.var.auto .sf-c-txt-gold\:30 { color: hsl(51, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:35, html.var.auto .sf-c-txt-gold\:35 { color: hsl(51, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:40, html.var.auto .sf-c-txt-gold\:40 { color: hsl(51, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:45, html.var.auto .sf-c-txt-gold\:45 { color: hsl(51, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:50, html.var.auto .sf-c-txt-gold\:50 { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:55, html.var.auto .sf-c-txt-gold\:55 { color: hsl(51, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:60, html.var.auto .sf-c-txt-gold\:60 { color: hsl(51, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:65, html.var.auto .sf-c-txt-gold\:65 { color: hsl(51, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:70, html.var.auto .sf-c-txt-gold\:70 { color: hsl(51, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:75, html.var.auto .sf-c-txt-gold\:75 { color: hsl(51, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:80, html.var.auto .sf-c-txt-gold\:80 { color: hsl(51, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:85, html.var.auto .sf-c-txt-gold\:85 { color: hsl(51, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:90, html.var.auto .sf-c-txt-gold\:90 { color: hsl(51, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:95, html.var.auto .sf-c-txt-gold\:95 { color: hsl(51, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:100, html.var.auto .sf-c-txt-gold\:100 { color: hsl(51, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:dark, html.auto .sf-c-txt-gold\:dark { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:0\:dark, html.auto .sf-c-txt-gold\:0\:dark { color: hsl(51, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:5\:dark, html.auto .sf-c-txt-gold\:5\:dark { color: hsl(51, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:10\:dark, html.auto .sf-c-txt-gold\:10\:dark { color: hsl(51, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:15\:dark, html.auto .sf-c-txt-gold\:15\:dark { color: hsl(51, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:20\:dark, html.auto .sf-c-txt-gold\:20\:dark { color: hsl(51, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:25\:dark, html.auto .sf-c-txt-gold\:25\:dark { color: hsl(51, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:30\:dark, html.auto .sf-c-txt-gold\:30\:dark { color: hsl(51, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:35\:dark, html.auto .sf-c-txt-gold\:35\:dark { color: hsl(51, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:40\:dark, html.auto .sf-c-txt-gold\:40\:dark { color: hsl(51, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:45\:dark, html.auto .sf-c-txt-gold\:45\:dark { color: hsl(51, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:50\:dark, html.auto .sf-c-txt-gold\:50\:dark { color: hsl(51, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:55\:dark, html.auto .sf-c-txt-gold\:55\:dark { color: hsl(51, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:60\:dark, html.auto .sf-c-txt-gold\:60\:dark { color: hsl(51, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:65\:dark, html.auto .sf-c-txt-gold\:65\:dark { color: hsl(51, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:70\:dark, html.auto .sf-c-txt-gold\:70\:dark { color: hsl(51, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:75\:dark, html.auto .sf-c-txt-gold\:75\:dark { color: hsl(51, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:80\:dark, html.auto .sf-c-txt-gold\:80\:dark { color: hsl(51, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:85\:dark, html.auto .sf-c-txt-gold\:85\:dark { color: hsl(51, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:90\:dark, html.auto .sf-c-txt-gold\:90\:dark { color: hsl(51, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:95\:dark, html.auto .sf-c-txt-gold\:95\:dark { color: hsl(51, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gold\:100\:dark, html.auto .sf-c-txt-gold\:100\:dark { color: hsl(51, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:dark, html.var.auto .sf-c-txt-gold\:dark { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:0\:dark, html.var.auto .sf-c-txt-gold\:0\:dark { color: hsl(51, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:5\:dark, html.var.auto .sf-c-txt-gold\:5\:dark { color: hsl(51, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:10\:dark, html.var.auto .sf-c-txt-gold\:10\:dark { color: hsl(51, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:15\:dark, html.var.auto .sf-c-txt-gold\:15\:dark { color: hsl(51, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:20\:dark, html.var.auto .sf-c-txt-gold\:20\:dark { color: hsl(51, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:25\:dark, html.var.auto .sf-c-txt-gold\:25\:dark { color: hsl(51, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:30\:dark, html.var.auto .sf-c-txt-gold\:30\:dark { color: hsl(51, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:35\:dark, html.var.auto .sf-c-txt-gold\:35\:dark { color: hsl(51, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:40\:dark, html.var.auto .sf-c-txt-gold\:40\:dark { color: hsl(51, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:45\:dark, html.var.auto .sf-c-txt-gold\:45\:dark { color: hsl(51, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:50\:dark, html.var.auto .sf-c-txt-gold\:50\:dark { color: hsl(51, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:55\:dark, html.var.auto .sf-c-txt-gold\:55\:dark { color: hsl(51, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:60\:dark, html.var.auto .sf-c-txt-gold\:60\:dark { color: hsl(51, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:65\:dark, html.var.auto .sf-c-txt-gold\:65\:dark { color: hsl(51, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:70\:dark, html.var.auto .sf-c-txt-gold\:70\:dark { color: hsl(51, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:75\:dark, html.var.auto .sf-c-txt-gold\:75\:dark { color: hsl(51, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:80\:dark, html.var.auto .sf-c-txt-gold\:80\:dark { color: hsl(51, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:85\:dark, html.var.auto .sf-c-txt-gold\:85\:dark { color: hsl(51, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:90\:dark, html.var.auto .sf-c-txt-gold\:90\:dark { color: hsl(51, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:95\:dark, html.var.auto .sf-c-txt-gold\:95\:dark { color: hsl(51, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gold\:100\:dark, html.var.auto .sf-c-txt-gold\:100\:dark { color: hsl(51, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/goldenrod.css b/src/colors/20/goldenrod.css index 4258076..9b56463 100644 --- a/src/colors/20/goldenrod.css +++ b/src/colors/20/goldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='goldenrod'] { --sf-c-goldenrod: 43 74% 49%; --sf-c-goldenrod-0: 43 74% 0%; --sf-c-goldenrod-5: 43 74% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-goldenrod\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-goldenrod\:95\:dark, html.var.auto .sf-c-goldenrod\:95\:dark { color: hsl(43, 74%, 95%); background: hsl(43, 74%, 5%) } html.var[data-theme='auto'] .sf-c-goldenrod\:100\:dark, html.var.auto .sf-c-goldenrod\:100\:dark { color: hsl(43, 74%, 95%); background: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod, html.auto .sf-c-txt-goldenrod { color: hsl(43, 74%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0, html.auto .sf-c-txt-goldenrod\:0 { color: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:5, html.auto .sf-c-txt-goldenrod\:5 { color: hsl(43, 74%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10, html.auto .sf-c-txt-goldenrod\:10 { color: hsl(43, 74%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:15, html.auto .sf-c-txt-goldenrod\:15 { color: hsl(43, 74%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20, html.auto .sf-c-txt-goldenrod\:20 { color: hsl(43, 74%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:25, html.auto .sf-c-txt-goldenrod\:25 { color: hsl(43, 74%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30, html.auto .sf-c-txt-goldenrod\:30 { color: hsl(43, 74%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:35, html.auto .sf-c-txt-goldenrod\:35 { color: hsl(43, 74%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40, html.auto .sf-c-txt-goldenrod\:40 { color: hsl(43, 74%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:45, html.auto .sf-c-txt-goldenrod\:45 { color: hsl(43, 74%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50, html.auto .sf-c-txt-goldenrod\:50 { color: hsl(43, 74%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:55, html.auto .sf-c-txt-goldenrod\:55 { color: hsl(43, 74%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60, html.auto .sf-c-txt-goldenrod\:60 { color: hsl(43, 74%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:65, html.auto .sf-c-txt-goldenrod\:65 { color: hsl(43, 74%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70, html.auto .sf-c-txt-goldenrod\:70 { color: hsl(43, 74%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:75, html.auto .sf-c-txt-goldenrod\:75 { color: hsl(43, 74%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80, html.auto .sf-c-txt-goldenrod\:80 { color: hsl(43, 74%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:85, html.auto .sf-c-txt-goldenrod\:85 { color: hsl(43, 74%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90, html.auto .sf-c-txt-goldenrod\:90 { color: hsl(43, 74%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:95, html.auto .sf-c-txt-goldenrod\:95 { color: hsl(43, 74%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100, html.auto .sf-c-txt-goldenrod\:100 { color: hsl(43, 74%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod, html.var.auto .sf-c-txt-goldenrod { color: hsl(43, 74%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0, html.var.auto .sf-c-txt-goldenrod\:0 { color: hsl(43, 74%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:5, html.var.auto .sf-c-txt-goldenrod\:5 { color: hsl(43, 74%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10, html.var.auto .sf-c-txt-goldenrod\:10 { color: hsl(43, 74%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:15, html.var.auto .sf-c-txt-goldenrod\:15 { color: hsl(43, 74%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20, html.var.auto .sf-c-txt-goldenrod\:20 { color: hsl(43, 74%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:25, html.var.auto .sf-c-txt-goldenrod\:25 { color: hsl(43, 74%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30, html.var.auto .sf-c-txt-goldenrod\:30 { color: hsl(43, 74%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:35, html.var.auto .sf-c-txt-goldenrod\:35 { color: hsl(43, 74%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40, html.var.auto .sf-c-txt-goldenrod\:40 { color: hsl(43, 74%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:45, html.var.auto .sf-c-txt-goldenrod\:45 { color: hsl(43, 74%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50, html.var.auto .sf-c-txt-goldenrod\:50 { color: hsl(43, 74%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:55, html.var.auto .sf-c-txt-goldenrod\:55 { color: hsl(43, 74%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60, html.var.auto .sf-c-txt-goldenrod\:60 { color: hsl(43, 74%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:65, html.var.auto .sf-c-txt-goldenrod\:65 { color: hsl(43, 74%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70, html.var.auto .sf-c-txt-goldenrod\:70 { color: hsl(43, 74%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:75, html.var.auto .sf-c-txt-goldenrod\:75 { color: hsl(43, 74%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80, html.var.auto .sf-c-txt-goldenrod\:80 { color: hsl(43, 74%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:85, html.var.auto .sf-c-txt-goldenrod\:85 { color: hsl(43, 74%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90, html.var.auto .sf-c-txt-goldenrod\:90 { color: hsl(43, 74%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:95, html.var.auto .sf-c-txt-goldenrod\:95 { color: hsl(43, 74%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100, html.var.auto .sf-c-txt-goldenrod\:100 { color: hsl(43, 74%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:dark, html.auto .sf-c-txt-goldenrod\:dark { color: hsl(43, 74%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0\:dark, html.auto .sf-c-txt-goldenrod\:0\:dark { color: hsl(43, 74%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:5\:dark, html.auto .sf-c-txt-goldenrod\:5\:dark { color: hsl(43, 74%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10\:dark, html.auto .sf-c-txt-goldenrod\:10\:dark { color: hsl(43, 74%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:15\:dark, html.auto .sf-c-txt-goldenrod\:15\:dark { color: hsl(43, 74%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20\:dark, html.auto .sf-c-txt-goldenrod\:20\:dark { color: hsl(43, 74%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:25\:dark, html.auto .sf-c-txt-goldenrod\:25\:dark { color: hsl(43, 74%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30\:dark, html.auto .sf-c-txt-goldenrod\:30\:dark { color: hsl(43, 74%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:35\:dark, html.auto .sf-c-txt-goldenrod\:35\:dark { color: hsl(43, 74%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40\:dark, html.auto .sf-c-txt-goldenrod\:40\:dark { color: hsl(43, 74%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:45\:dark, html.auto .sf-c-txt-goldenrod\:45\:dark { color: hsl(43, 74%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50\:dark, html.auto .sf-c-txt-goldenrod\:50\:dark { color: hsl(43, 74%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:55\:dark, html.auto .sf-c-txt-goldenrod\:55\:dark { color: hsl(43, 74%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60\:dark, html.auto .sf-c-txt-goldenrod\:60\:dark { color: hsl(43, 74%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:65\:dark, html.auto .sf-c-txt-goldenrod\:65\:dark { color: hsl(43, 74%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70\:dark, html.auto .sf-c-txt-goldenrod\:70\:dark { color: hsl(43, 74%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:75\:dark, html.auto .sf-c-txt-goldenrod\:75\:dark { color: hsl(43, 74%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80\:dark, html.auto .sf-c-txt-goldenrod\:80\:dark { color: hsl(43, 74%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:85\:dark, html.auto .sf-c-txt-goldenrod\:85\:dark { color: hsl(43, 74%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90\:dark, html.auto .sf-c-txt-goldenrod\:90\:dark { color: hsl(43, 74%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:95\:dark, html.auto .sf-c-txt-goldenrod\:95\:dark { color: hsl(43, 74%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100\:dark, html.auto .sf-c-txt-goldenrod\:100\:dark { color: hsl(43, 74%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:dark, html.var.auto .sf-c-txt-goldenrod\:dark { color: hsl(43, 74%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:0\:dark, html.var.auto .sf-c-txt-goldenrod\:0\:dark { color: hsl(43, 74%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:5\:dark, html.var.auto .sf-c-txt-goldenrod\:5\:dark { color: hsl(43, 74%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:10\:dark, html.var.auto .sf-c-txt-goldenrod\:10\:dark { color: hsl(43, 74%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:15\:dark, html.var.auto .sf-c-txt-goldenrod\:15\:dark { color: hsl(43, 74%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:20\:dark, html.var.auto .sf-c-txt-goldenrod\:20\:dark { color: hsl(43, 74%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:25\:dark, html.var.auto .sf-c-txt-goldenrod\:25\:dark { color: hsl(43, 74%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:30\:dark, html.var.auto .sf-c-txt-goldenrod\:30\:dark { color: hsl(43, 74%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:35\:dark, html.var.auto .sf-c-txt-goldenrod\:35\:dark { color: hsl(43, 74%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:40\:dark, html.var.auto .sf-c-txt-goldenrod\:40\:dark { color: hsl(43, 74%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:45\:dark, html.var.auto .sf-c-txt-goldenrod\:45\:dark { color: hsl(43, 74%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:50\:dark, html.var.auto .sf-c-txt-goldenrod\:50\:dark { color: hsl(43, 74%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:55\:dark, html.var.auto .sf-c-txt-goldenrod\:55\:dark { color: hsl(43, 74%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:60\:dark, html.var.auto .sf-c-txt-goldenrod\:60\:dark { color: hsl(43, 74%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:65\:dark, html.var.auto .sf-c-txt-goldenrod\:65\:dark { color: hsl(43, 74%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:70\:dark, html.var.auto .sf-c-txt-goldenrod\:70\:dark { color: hsl(43, 74%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:75\:dark, html.var.auto .sf-c-txt-goldenrod\:75\:dark { color: hsl(43, 74%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:80\:dark, html.var.auto .sf-c-txt-goldenrod\:80\:dark { color: hsl(43, 74%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:85\:dark, html.var.auto .sf-c-txt-goldenrod\:85\:dark { color: hsl(43, 74%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:90\:dark, html.var.auto .sf-c-txt-goldenrod\:90\:dark { color: hsl(43, 74%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:95\:dark, html.var.auto .sf-c-txt-goldenrod\:95\:dark { color: hsl(43, 74%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-goldenrod\:100\:dark, html.var.auto .sf-c-txt-goldenrod\:100\:dark { color: hsl(43, 74%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/gray.css b/src/colors/20/gray.css index 86ddca0..08047ae 100644 --- a/src/colors/20/gray.css +++ b/src/colors/20/gray.css @@ -1,4 +1,4 @@ -:root { +[class*='gray'] { --sf-c-gray: 0 0% 50%; --sf-c-gray-0: 0 0% 0%; --sf-c-gray-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-gray\:100\:dark, html.dark .sf-c-txt-gray\ html.var[data-theme='auto'] .sf-c-gray\:95\:dark, html.var.auto .sf-c-gray\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-gray\:100\:dark, html.var.auto .sf-c-gray\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray, html.auto .sf-c-txt-gray { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:0, html.auto .sf-c-txt-gray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:5, html.auto .sf-c-txt-gray\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:10, html.auto .sf-c-txt-gray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:15, html.auto .sf-c-txt-gray\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:20, html.auto .sf-c-txt-gray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:25, html.auto .sf-c-txt-gray\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:30, html.auto .sf-c-txt-gray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:35, html.auto .sf-c-txt-gray\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:40, html.auto .sf-c-txt-gray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:45, html.auto .sf-c-txt-gray\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:50, html.auto .sf-c-txt-gray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:55, html.auto .sf-c-txt-gray\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:60, html.auto .sf-c-txt-gray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:65, html.auto .sf-c-txt-gray\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:70, html.auto .sf-c-txt-gray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:75, html.auto .sf-c-txt-gray\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:80, html.auto .sf-c-txt-gray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:85, html.auto .sf-c-txt-gray\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:90, html.auto .sf-c-txt-gray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:95, html.auto .sf-c-txt-gray\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:100, html.auto .sf-c-txt-gray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gray, html.var.auto .sf-c-txt-gray { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:0, html.var.auto .sf-c-txt-gray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:5, html.var.auto .sf-c-txt-gray\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:10, html.var.auto .sf-c-txt-gray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:15, html.var.auto .sf-c-txt-gray\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:20, html.var.auto .sf-c-txt-gray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:25, html.var.auto .sf-c-txt-gray\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:30, html.var.auto .sf-c-txt-gray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:35, html.var.auto .sf-c-txt-gray\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:40, html.var.auto .sf-c-txt-gray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:45, html.var.auto .sf-c-txt-gray\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:50, html.var.auto .sf-c-txt-gray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:55, html.var.auto .sf-c-txt-gray\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:60, html.var.auto .sf-c-txt-gray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:65, html.var.auto .sf-c-txt-gray\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:70, html.var.auto .sf-c-txt-gray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:75, html.var.auto .sf-c-txt-gray\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:80, html.var.auto .sf-c-txt-gray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:85, html.var.auto .sf-c-txt-gray\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:90, html.var.auto .sf-c-txt-gray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:95, html.var.auto .sf-c-txt-gray\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:100, html.var.auto .sf-c-txt-gray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:dark, html.auto .sf-c-txt-gray\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark, html.auto .sf-c-txt-gray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:5\:dark, html.auto .sf-c-txt-gray\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark, html.auto .sf-c-txt-gray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:15\:dark, html.auto .sf-c-txt-gray\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark, html.auto .sf-c-txt-gray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:25\:dark, html.auto .sf-c-txt-gray\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark, html.auto .sf-c-txt-gray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:35\:dark, html.auto .sf-c-txt-gray\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark, html.auto .sf-c-txt-gray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:45\:dark, html.auto .sf-c-txt-gray\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark, html.auto .sf-c-txt-gray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:55\:dark, html.auto .sf-c-txt-gray\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark, html.auto .sf-c-txt-gray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:65\:dark, html.auto .sf-c-txt-gray\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark, html.auto .sf-c-txt-gray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:75\:dark, html.auto .sf-c-txt-gray\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark, html.auto .sf-c-txt-gray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:85\:dark, html.auto .sf-c-txt-gray\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark, html.auto .sf-c-txt-gray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:95\:dark, html.auto .sf-c-txt-gray\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark, html.auto .sf-c-txt-gray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:dark, html.var.auto .sf-c-txt-gray\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark, html.var.auto .sf-c-txt-gray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:5\:dark, html.var.auto .sf-c-txt-gray\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark, html.var.auto .sf-c-txt-gray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:15\:dark, html.var.auto .sf-c-txt-gray\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark, html.var.auto .sf-c-txt-gray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:25\:dark, html.var.auto .sf-c-txt-gray\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark, html.var.auto .sf-c-txt-gray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:35\:dark, html.var.auto .sf-c-txt-gray\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark, html.var.auto .sf-c-txt-gray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:45\:dark, html.var.auto .sf-c-txt-gray\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark, html.var.auto .sf-c-txt-gray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:55\:dark, html.var.auto .sf-c-txt-gray\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark, html.var.auto .sf-c-txt-gray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:65\:dark, html.var.auto .sf-c-txt-gray\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark, html.var.auto .sf-c-txt-gray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:75\:dark, html.var.auto .sf-c-txt-gray\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark, html.var.auto .sf-c-txt-gray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:85\:dark, html.var.auto .sf-c-txt-gray\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark, html.var.auto .sf-c-txt-gray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:95\:dark, html.var.auto .sf-c-txt-gray\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark, html.var.auto .sf-c-txt-gray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/green.css b/src/colors/20/green.css index a53567a..a95c655 100644 --- a/src/colors/20/green.css +++ b/src/colors/20/green.css @@ -1,4 +1,4 @@ -:root { +[class*='green'] { --sf-c-green: 120 100% 25%; --sf-c-green-0: 120 100% 0%; --sf-c-green-5: 120 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark, html.dark .sf-c-txt-gree html.var[data-theme='auto'] .sf-c-green\:95\:dark, html.var.auto .sf-c-green\:95\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 5%) } html.var[data-theme='auto'] .sf-c-green\:100\:dark, html.var.auto .sf-c-green\:100\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green, html.auto .sf-c-txt-green { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:0, html.auto .sf-c-txt-green\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green\:5, html.auto .sf-c-txt-green\:5 { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-green\:10, html.auto .sf-c-txt-green\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-green\:15, html.auto .sf-c-txt-green\:15 { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-green\:20, html.auto .sf-c-txt-green\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-green\:25, html.auto .sf-c-txt-green\:25 { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:30, html.auto .sf-c-txt-green\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-green\:35, html.auto .sf-c-txt-green\:35 { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-green\:40, html.auto .sf-c-txt-green\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-green\:45, html.auto .sf-c-txt-green\:45 { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-green\:50, html.auto .sf-c-txt-green\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-green\:55, html.auto .sf-c-txt-green\:55 { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-green\:60, html.auto .sf-c-txt-green\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-green\:65, html.auto .sf-c-txt-green\:65 { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-green\:70, html.auto .sf-c-txt-green\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-green\:75, html.auto .sf-c-txt-green\:75 { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-green\:80, html.auto .sf-c-txt-green\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-green\:85, html.auto .sf-c-txt-green\:85 { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-green\:90, html.auto .sf-c-txt-green\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-green\:95, html.auto .sf-c-txt-green\:95 { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-green\:100, html.auto .sf-c-txt-green\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-green, html.var.auto .sf-c-txt-green { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:0, html.var.auto .sf-c-txt-green\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-green\:5, html.var.auto .sf-c-txt-green\:5 { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-green\:10, html.var.auto .sf-c-txt-green\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-green\:15, html.var.auto .sf-c-txt-green\:15 { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-green\:20, html.var.auto .sf-c-txt-green\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-green\:25, html.var.auto .sf-c-txt-green\:25 { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:30, html.var.auto .sf-c-txt-green\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-green\:35, html.var.auto .sf-c-txt-green\:35 { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-green\:40, html.var.auto .sf-c-txt-green\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-green\:45, html.var.auto .sf-c-txt-green\:45 { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-green\:50, html.var.auto .sf-c-txt-green\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-green\:55, html.var.auto .sf-c-txt-green\:55 { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-green\:60, html.var.auto .sf-c-txt-green\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-green\:65, html.var.auto .sf-c-txt-green\:65 { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-green\:70, html.var.auto .sf-c-txt-green\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-green\:75, html.var.auto .sf-c-txt-green\:75 { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-green\:80, html.var.auto .sf-c-txt-green\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-green\:85, html.var.auto .sf-c-txt-green\:85 { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-green\:90, html.var.auto .sf-c-txt-green\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-green\:95, html.var.auto .sf-c-txt-green\:95 { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-green\:100, html.var.auto .sf-c-txt-green\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-green\:dark, html.auto .sf-c-txt-green\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark, html.auto .sf-c-txt-green\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-green\:5\:dark, html.auto .sf-c-txt-green\:5\:dark { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark, html.auto .sf-c-txt-green\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-green\:15\:dark, html.auto .sf-c-txt-green\:15\:dark { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark, html.auto .sf-c-txt-green\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-green\:25\:dark, html.auto .sf-c-txt-green\:25\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark, html.auto .sf-c-txt-green\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-green\:35\:dark, html.auto .sf-c-txt-green\:35\:dark { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark, html.auto .sf-c-txt-green\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-green\:45\:dark, html.auto .sf-c-txt-green\:45\:dark { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark, html.auto .sf-c-txt-green\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-green\:55\:dark, html.auto .sf-c-txt-green\:55\:dark { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark, html.auto .sf-c-txt-green\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-green\:65\:dark, html.auto .sf-c-txt-green\:65\:dark { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark, html.auto .sf-c-txt-green\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-green\:75\:dark, html.auto .sf-c-txt-green\:75\:dark { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark, html.auto .sf-c-txt-green\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-green\:85\:dark, html.auto .sf-c-txt-green\:85\:dark { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark, html.auto .sf-c-txt-green\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-green\:95\:dark, html.auto .sf-c-txt-green\:95\:dark { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark, html.auto .sf-c-txt-green\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-green\:dark, html.var.auto .sf-c-txt-green\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark, html.var.auto .sf-c-txt-green\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-green\:5\:dark, html.var.auto .sf-c-txt-green\:5\:dark { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark, html.var.auto .sf-c-txt-green\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-green\:15\:dark, html.var.auto .sf-c-txt-green\:15\:dark { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark, html.var.auto .sf-c-txt-green\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-green\:25\:dark, html.var.auto .sf-c-txt-green\:25\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark, html.var.auto .sf-c-txt-green\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-green\:35\:dark, html.var.auto .sf-c-txt-green\:35\:dark { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark, html.var.auto .sf-c-txt-green\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-green\:45\:dark, html.var.auto .sf-c-txt-green\:45\:dark { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark, html.var.auto .sf-c-txt-green\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-green\:55\:dark, html.var.auto .sf-c-txt-green\:55\:dark { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark, html.var.auto .sf-c-txt-green\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-green\:65\:dark, html.var.auto .sf-c-txt-green\:65\:dark { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark, html.var.auto .sf-c-txt-green\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-green\:75\:dark, html.var.auto .sf-c-txt-green\:75\:dark { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark, html.var.auto .sf-c-txt-green\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-green\:85\:dark, html.var.auto .sf-c-txt-green\:85\:dark { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark, html.var.auto .sf-c-txt-green\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-green\:95\:dark, html.var.auto .sf-c-txt-green\:95\:dark { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark, html.var.auto .sf-c-txt-green\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/greenyellow.css b/src/colors/20/greenyellow.css index d396bd6..49db3d4 100644 --- a/src/colors/20/greenyellow.css +++ b/src/colors/20/greenyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='greenyellow'] { --sf-c-greenyellow: 84 100% 59%; --sf-c-greenyellow-0: 84 100% 0%; --sf-c-greenyellow-5: 84 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-greenyellow\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-greenyellow\:95\:dark, html.var.auto .sf-c-greenyellow\:95\:dark { color: hsl(84, 100%, 95%); background: hsl(84, 100%, 5%) } html.var[data-theme='auto'] .sf-c-greenyellow\:100\:dark, html.var.auto .sf-c-greenyellow\:100\:dark { color: hsl(84, 100%, 95%); background: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow, html.auto .sf-c-txt-greenyellow { color: hsl(84, 100%, 59%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0, html.auto .sf-c-txt-greenyellow\:0 { color: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:5, html.auto .sf-c-txt-greenyellow\:5 { color: hsl(84, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10, html.auto .sf-c-txt-greenyellow\:10 { color: hsl(84, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:15, html.auto .sf-c-txt-greenyellow\:15 { color: hsl(84, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20, html.auto .sf-c-txt-greenyellow\:20 { color: hsl(84, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:25, html.auto .sf-c-txt-greenyellow\:25 { color: hsl(84, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30, html.auto .sf-c-txt-greenyellow\:30 { color: hsl(84, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:35, html.auto .sf-c-txt-greenyellow\:35 { color: hsl(84, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40, html.auto .sf-c-txt-greenyellow\:40 { color: hsl(84, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:45, html.auto .sf-c-txt-greenyellow\:45 { color: hsl(84, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50, html.auto .sf-c-txt-greenyellow\:50 { color: hsl(84, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:55, html.auto .sf-c-txt-greenyellow\:55 { color: hsl(84, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60, html.auto .sf-c-txt-greenyellow\:60 { color: hsl(84, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:65, html.auto .sf-c-txt-greenyellow\:65 { color: hsl(84, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70, html.auto .sf-c-txt-greenyellow\:70 { color: hsl(84, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:75, html.auto .sf-c-txt-greenyellow\:75 { color: hsl(84, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80, html.auto .sf-c-txt-greenyellow\:80 { color: hsl(84, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:85, html.auto .sf-c-txt-greenyellow\:85 { color: hsl(84, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90, html.auto .sf-c-txt-greenyellow\:90 { color: hsl(84, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:95, html.auto .sf-c-txt-greenyellow\:95 { color: hsl(84, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100, html.auto .sf-c-txt-greenyellow\:100 { color: hsl(84, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow, html.var.auto .sf-c-txt-greenyellow { color: hsl(84, 100%, 59%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0, html.var.auto .sf-c-txt-greenyellow\:0 { color: hsl(84, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:5, html.var.auto .sf-c-txt-greenyellow\:5 { color: hsl(84, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10, html.var.auto .sf-c-txt-greenyellow\:10 { color: hsl(84, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:15, html.var.auto .sf-c-txt-greenyellow\:15 { color: hsl(84, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20, html.var.auto .sf-c-txt-greenyellow\:20 { color: hsl(84, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:25, html.var.auto .sf-c-txt-greenyellow\:25 { color: hsl(84, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30, html.var.auto .sf-c-txt-greenyellow\:30 { color: hsl(84, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:35, html.var.auto .sf-c-txt-greenyellow\:35 { color: hsl(84, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40, html.var.auto .sf-c-txt-greenyellow\:40 { color: hsl(84, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:45, html.var.auto .sf-c-txt-greenyellow\:45 { color: hsl(84, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50, html.var.auto .sf-c-txt-greenyellow\:50 { color: hsl(84, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:55, html.var.auto .sf-c-txt-greenyellow\:55 { color: hsl(84, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60, html.var.auto .sf-c-txt-greenyellow\:60 { color: hsl(84, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:65, html.var.auto .sf-c-txt-greenyellow\:65 { color: hsl(84, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70, html.var.auto .sf-c-txt-greenyellow\:70 { color: hsl(84, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:75, html.var.auto .sf-c-txt-greenyellow\:75 { color: hsl(84, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80, html.var.auto .sf-c-txt-greenyellow\:80 { color: hsl(84, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:85, html.var.auto .sf-c-txt-greenyellow\:85 { color: hsl(84, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90, html.var.auto .sf-c-txt-greenyellow\:90 { color: hsl(84, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:95, html.var.auto .sf-c-txt-greenyellow\:95 { color: hsl(84, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100, html.var.auto .sf-c-txt-greenyellow\:100 { color: hsl(84, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:dark, html.auto .sf-c-txt-greenyellow\:dark { color: hsl(84, 100%, 59%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0\:dark, html.auto .sf-c-txt-greenyellow\:0\:dark { color: hsl(84, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:5\:dark, html.auto .sf-c-txt-greenyellow\:5\:dark { color: hsl(84, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10\:dark, html.auto .sf-c-txt-greenyellow\:10\:dark { color: hsl(84, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:15\:dark, html.auto .sf-c-txt-greenyellow\:15\:dark { color: hsl(84, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20\:dark, html.auto .sf-c-txt-greenyellow\:20\:dark { color: hsl(84, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:25\:dark, html.auto .sf-c-txt-greenyellow\:25\:dark { color: hsl(84, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30\:dark, html.auto .sf-c-txt-greenyellow\:30\:dark { color: hsl(84, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:35\:dark, html.auto .sf-c-txt-greenyellow\:35\:dark { color: hsl(84, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40\:dark, html.auto .sf-c-txt-greenyellow\:40\:dark { color: hsl(84, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:45\:dark, html.auto .sf-c-txt-greenyellow\:45\:dark { color: hsl(84, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50\:dark, html.auto .sf-c-txt-greenyellow\:50\:dark { color: hsl(84, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:55\:dark, html.auto .sf-c-txt-greenyellow\:55\:dark { color: hsl(84, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60\:dark, html.auto .sf-c-txt-greenyellow\:60\:dark { color: hsl(84, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:65\:dark, html.auto .sf-c-txt-greenyellow\:65\:dark { color: hsl(84, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70\:dark, html.auto .sf-c-txt-greenyellow\:70\:dark { color: hsl(84, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:75\:dark, html.auto .sf-c-txt-greenyellow\:75\:dark { color: hsl(84, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80\:dark, html.auto .sf-c-txt-greenyellow\:80\:dark { color: hsl(84, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:85\:dark, html.auto .sf-c-txt-greenyellow\:85\:dark { color: hsl(84, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90\:dark, html.auto .sf-c-txt-greenyellow\:90\:dark { color: hsl(84, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:95\:dark, html.auto .sf-c-txt-greenyellow\:95\:dark { color: hsl(84, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100\:dark, html.auto .sf-c-txt-greenyellow\:100\:dark { color: hsl(84, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:dark, html.var.auto .sf-c-txt-greenyellow\:dark { color: hsl(84, 100%, 59%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:0\:dark, html.var.auto .sf-c-txt-greenyellow\:0\:dark { color: hsl(84, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:5\:dark, html.var.auto .sf-c-txt-greenyellow\:5\:dark { color: hsl(84, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:10\:dark, html.var.auto .sf-c-txt-greenyellow\:10\:dark { color: hsl(84, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:15\:dark, html.var.auto .sf-c-txt-greenyellow\:15\:dark { color: hsl(84, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:20\:dark, html.var.auto .sf-c-txt-greenyellow\:20\:dark { color: hsl(84, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:25\:dark, html.var.auto .sf-c-txt-greenyellow\:25\:dark { color: hsl(84, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:30\:dark, html.var.auto .sf-c-txt-greenyellow\:30\:dark { color: hsl(84, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:35\:dark, html.var.auto .sf-c-txt-greenyellow\:35\:dark { color: hsl(84, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:40\:dark, html.var.auto .sf-c-txt-greenyellow\:40\:dark { color: hsl(84, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:45\:dark, html.var.auto .sf-c-txt-greenyellow\:45\:dark { color: hsl(84, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:50\:dark, html.var.auto .sf-c-txt-greenyellow\:50\:dark { color: hsl(84, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:55\:dark, html.var.auto .sf-c-txt-greenyellow\:55\:dark { color: hsl(84, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:60\:dark, html.var.auto .sf-c-txt-greenyellow\:60\:dark { color: hsl(84, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:65\:dark, html.var.auto .sf-c-txt-greenyellow\:65\:dark { color: hsl(84, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:70\:dark, html.var.auto .sf-c-txt-greenyellow\:70\:dark { color: hsl(84, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:75\:dark, html.var.auto .sf-c-txt-greenyellow\:75\:dark { color: hsl(84, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:80\:dark, html.var.auto .sf-c-txt-greenyellow\:80\:dark { color: hsl(84, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:85\:dark, html.var.auto .sf-c-txt-greenyellow\:85\:dark { color: hsl(84, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:90\:dark, html.var.auto .sf-c-txt-greenyellow\:90\:dark { color: hsl(84, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:95\:dark, html.var.auto .sf-c-txt-greenyellow\:95\:dark { color: hsl(84, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-greenyellow\:100\:dark, html.var.auto .sf-c-txt-greenyellow\:100\:dark { color: hsl(84, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/grey.css b/src/colors/20/grey.css index 2b23cb9..c51efd2 100644 --- a/src/colors/20/grey.css +++ b/src/colors/20/grey.css @@ -1,4 +1,4 @@ -:root { +[class*='grey'] { --sf-c-grey: 0 0% 50%; --sf-c-grey-0: 0 0% 0%; --sf-c-grey-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-grey\:100\:dark, html.dark .sf-c-txt-grey\ html.var[data-theme='auto'] .sf-c-grey\:95\:dark, html.var.auto .sf-c-grey\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-grey\:100\:dark, html.var.auto .sf-c-grey\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey, html.auto .sf-c-txt-grey { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:0, html.auto .sf-c-txt-grey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:5, html.auto .sf-c-txt-grey\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:10, html.auto .sf-c-txt-grey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:15, html.auto .sf-c-txt-grey\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:20, html.auto .sf-c-txt-grey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:25, html.auto .sf-c-txt-grey\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:30, html.auto .sf-c-txt-grey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:35, html.auto .sf-c-txt-grey\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:40, html.auto .sf-c-txt-grey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:45, html.auto .sf-c-txt-grey\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:50, html.auto .sf-c-txt-grey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:55, html.auto .sf-c-txt-grey\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:60, html.auto .sf-c-txt-grey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:65, html.auto .sf-c-txt-grey\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:70, html.auto .sf-c-txt-grey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:75, html.auto .sf-c-txt-grey\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:80, html.auto .sf-c-txt-grey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:85, html.auto .sf-c-txt-grey\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:90, html.auto .sf-c-txt-grey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:95, html.auto .sf-c-txt-grey\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:100, html.auto .sf-c-txt-grey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-grey, html.var.auto .sf-c-txt-grey { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:0, html.var.auto .sf-c-txt-grey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:5, html.var.auto .sf-c-txt-grey\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:10, html.var.auto .sf-c-txt-grey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:15, html.var.auto .sf-c-txt-grey\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:20, html.var.auto .sf-c-txt-grey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:25, html.var.auto .sf-c-txt-grey\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:30, html.var.auto .sf-c-txt-grey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:35, html.var.auto .sf-c-txt-grey\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:40, html.var.auto .sf-c-txt-grey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:45, html.var.auto .sf-c-txt-grey\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:50, html.var.auto .sf-c-txt-grey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:55, html.var.auto .sf-c-txt-grey\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:60, html.var.auto .sf-c-txt-grey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:65, html.var.auto .sf-c-txt-grey\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:70, html.var.auto .sf-c-txt-grey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:75, html.var.auto .sf-c-txt-grey\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:80, html.var.auto .sf-c-txt-grey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:85, html.var.auto .sf-c-txt-grey\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:90, html.var.auto .sf-c-txt-grey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:95, html.var.auto .sf-c-txt-grey\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:100, html.var.auto .sf-c-txt-grey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:dark, html.auto .sf-c-txt-grey\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:0\:dark, html.auto .sf-c-txt-grey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:5\:dark, html.auto .sf-c-txt-grey\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:10\:dark, html.auto .sf-c-txt-grey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:15\:dark, html.auto .sf-c-txt-grey\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:20\:dark, html.auto .sf-c-txt-grey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:25\:dark, html.auto .sf-c-txt-grey\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:30\:dark, html.auto .sf-c-txt-grey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:35\:dark, html.auto .sf-c-txt-grey\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:40\:dark, html.auto .sf-c-txt-grey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:45\:dark, html.auto .sf-c-txt-grey\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:50\:dark, html.auto .sf-c-txt-grey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:55\:dark, html.auto .sf-c-txt-grey\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:60\:dark, html.auto .sf-c-txt-grey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:65\:dark, html.auto .sf-c-txt-grey\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:70\:dark, html.auto .sf-c-txt-grey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:75\:dark, html.auto .sf-c-txt-grey\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:80\:dark, html.auto .sf-c-txt-grey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:85\:dark, html.auto .sf-c-txt-grey\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:90\:dark, html.auto .sf-c-txt-grey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:95\:dark, html.auto .sf-c-txt-grey\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-grey\:100\:dark, html.auto .sf-c-txt-grey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:dark, html.var.auto .sf-c-txt-grey\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:0\:dark, html.var.auto .sf-c-txt-grey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:5\:dark, html.var.auto .sf-c-txt-grey\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:10\:dark, html.var.auto .sf-c-txt-grey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:15\:dark, html.var.auto .sf-c-txt-grey\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:20\:dark, html.var.auto .sf-c-txt-grey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:25\:dark, html.var.auto .sf-c-txt-grey\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:30\:dark, html.var.auto .sf-c-txt-grey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:35\:dark, html.var.auto .sf-c-txt-grey\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:40\:dark, html.var.auto .sf-c-txt-grey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:45\:dark, html.var.auto .sf-c-txt-grey\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:50\:dark, html.var.auto .sf-c-txt-grey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:55\:dark, html.var.auto .sf-c-txt-grey\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:60\:dark, html.var.auto .sf-c-txt-grey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:65\:dark, html.var.auto .sf-c-txt-grey\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:70\:dark, html.var.auto .sf-c-txt-grey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:75\:dark, html.var.auto .sf-c-txt-grey\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:80\:dark, html.var.auto .sf-c-txt-grey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:85\:dark, html.var.auto .sf-c-txt-grey\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:90\:dark, html.var.auto .sf-c-txt-grey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:95\:dark, html.var.auto .sf-c-txt-grey\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-grey\:100\:dark, html.var.auto .sf-c-txt-grey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/honeydew.css b/src/colors/20/honeydew.css index f304e04..bfc5c4b 100644 --- a/src/colors/20/honeydew.css +++ b/src/colors/20/honeydew.css @@ -1,4 +1,4 @@ -:root { +[class*='honeydew'] { --sf-c-honeydew: 120 100% 97%; --sf-c-honeydew-0: 120 100% 0%; --sf-c-honeydew-5: 120 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-honeydew\:100\:dark, html.dark .sf-c-txt-h html.var[data-theme='auto'] .sf-c-honeydew\:95\:dark, html.var.auto .sf-c-honeydew\:95\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 5%) } html.var[data-theme='auto'] .sf-c-honeydew\:100\:dark, html.var.auto .sf-c-honeydew\:100\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew, html.auto .sf-c-txt-honeydew { color: hsl(120, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:0, html.auto .sf-c-txt-honeydew\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:5, html.auto .sf-c-txt-honeydew\:5 { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:10, html.auto .sf-c-txt-honeydew\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:15, html.auto .sf-c-txt-honeydew\:15 { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:20, html.auto .sf-c-txt-honeydew\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:25, html.auto .sf-c-txt-honeydew\:25 { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:30, html.auto .sf-c-txt-honeydew\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:35, html.auto .sf-c-txt-honeydew\:35 { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:40, html.auto .sf-c-txt-honeydew\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:45, html.auto .sf-c-txt-honeydew\:45 { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:50, html.auto .sf-c-txt-honeydew\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:55, html.auto .sf-c-txt-honeydew\:55 { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:60, html.auto .sf-c-txt-honeydew\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:65, html.auto .sf-c-txt-honeydew\:65 { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:70, html.auto .sf-c-txt-honeydew\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:75, html.auto .sf-c-txt-honeydew\:75 { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:80, html.auto .sf-c-txt-honeydew\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:85, html.auto .sf-c-txt-honeydew\:85 { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:90, html.auto .sf-c-txt-honeydew\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:95, html.auto .sf-c-txt-honeydew\:95 { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:100, html.auto .sf-c-txt-honeydew\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew, html.var.auto .sf-c-txt-honeydew { color: hsl(120, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:0, html.var.auto .sf-c-txt-honeydew\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:5, html.var.auto .sf-c-txt-honeydew\:5 { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:10, html.var.auto .sf-c-txt-honeydew\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:15, html.var.auto .sf-c-txt-honeydew\:15 { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:20, html.var.auto .sf-c-txt-honeydew\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:25, html.var.auto .sf-c-txt-honeydew\:25 { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:30, html.var.auto .sf-c-txt-honeydew\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:35, html.var.auto .sf-c-txt-honeydew\:35 { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:40, html.var.auto .sf-c-txt-honeydew\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:45, html.var.auto .sf-c-txt-honeydew\:45 { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:50, html.var.auto .sf-c-txt-honeydew\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:55, html.var.auto .sf-c-txt-honeydew\:55 { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:60, html.var.auto .sf-c-txt-honeydew\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:65, html.var.auto .sf-c-txt-honeydew\:65 { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:70, html.var.auto .sf-c-txt-honeydew\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:75, html.var.auto .sf-c-txt-honeydew\:75 { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:80, html.var.auto .sf-c-txt-honeydew\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:85, html.var.auto .sf-c-txt-honeydew\:85 { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:90, html.var.auto .sf-c-txt-honeydew\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:95, html.var.auto .sf-c-txt-honeydew\:95 { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:100, html.var.auto .sf-c-txt-honeydew\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:dark, html.auto .sf-c-txt-honeydew\:dark { color: hsl(120, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:0\:dark, html.auto .sf-c-txt-honeydew\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:5\:dark, html.auto .sf-c-txt-honeydew\:5\:dark { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:10\:dark, html.auto .sf-c-txt-honeydew\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:15\:dark, html.auto .sf-c-txt-honeydew\:15\:dark { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:20\:dark, html.auto .sf-c-txt-honeydew\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:25\:dark, html.auto .sf-c-txt-honeydew\:25\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:30\:dark, html.auto .sf-c-txt-honeydew\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:35\:dark, html.auto .sf-c-txt-honeydew\:35\:dark { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:40\:dark, html.auto .sf-c-txt-honeydew\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:45\:dark, html.auto .sf-c-txt-honeydew\:45\:dark { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:50\:dark, html.auto .sf-c-txt-honeydew\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:55\:dark, html.auto .sf-c-txt-honeydew\:55\:dark { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:60\:dark, html.auto .sf-c-txt-honeydew\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:65\:dark, html.auto .sf-c-txt-honeydew\:65\:dark { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:70\:dark, html.auto .sf-c-txt-honeydew\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:75\:dark, html.auto .sf-c-txt-honeydew\:75\:dark { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:80\:dark, html.auto .sf-c-txt-honeydew\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:85\:dark, html.auto .sf-c-txt-honeydew\:85\:dark { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:90\:dark, html.auto .sf-c-txt-honeydew\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:95\:dark, html.auto .sf-c-txt-honeydew\:95\:dark { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-honeydew\:100\:dark, html.auto .sf-c-txt-honeydew\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:dark, html.var.auto .sf-c-txt-honeydew\:dark { color: hsl(120, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:0\:dark, html.var.auto .sf-c-txt-honeydew\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:5\:dark, html.var.auto .sf-c-txt-honeydew\:5\:dark { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:10\:dark, html.var.auto .sf-c-txt-honeydew\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:15\:dark, html.var.auto .sf-c-txt-honeydew\:15\:dark { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:20\:dark, html.var.auto .sf-c-txt-honeydew\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:25\:dark, html.var.auto .sf-c-txt-honeydew\:25\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:30\:dark, html.var.auto .sf-c-txt-honeydew\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:35\:dark, html.var.auto .sf-c-txt-honeydew\:35\:dark { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:40\:dark, html.var.auto .sf-c-txt-honeydew\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:45\:dark, html.var.auto .sf-c-txt-honeydew\:45\:dark { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:50\:dark, html.var.auto .sf-c-txt-honeydew\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:55\:dark, html.var.auto .sf-c-txt-honeydew\:55\:dark { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:60\:dark, html.var.auto .sf-c-txt-honeydew\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:65\:dark, html.var.auto .sf-c-txt-honeydew\:65\:dark { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:70\:dark, html.var.auto .sf-c-txt-honeydew\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:75\:dark, html.var.auto .sf-c-txt-honeydew\:75\:dark { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:80\:dark, html.var.auto .sf-c-txt-honeydew\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:85\:dark, html.var.auto .sf-c-txt-honeydew\:85\:dark { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:90\:dark, html.var.auto .sf-c-txt-honeydew\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:95\:dark, html.var.auto .sf-c-txt-honeydew\:95\:dark { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-honeydew\:100\:dark, html.var.auto .sf-c-txt-honeydew\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/hotpink.css b/src/colors/20/hotpink.css index 929e578..0d9d17f 100644 --- a/src/colors/20/hotpink.css +++ b/src/colors/20/hotpink.css @@ -1,4 +1,4 @@ -:root { +[class*='hotpink'] { --sf-c-hotpink: 330 100% 71%; --sf-c-hotpink-0: 330 100% 0%; --sf-c-hotpink-5: 330 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-hotpink\:100\:dark, html.dark .sf-c-txt-ho html.var[data-theme='auto'] .sf-c-hotpink\:95\:dark, html.var.auto .sf-c-hotpink\:95\:dark { color: hsl(330, 100%, 95%); background: hsl(330, 100%, 5%) } html.var[data-theme='auto'] .sf-c-hotpink\:100\:dark, html.var.auto .sf-c-hotpink\:100\:dark { color: hsl(330, 100%, 95%); background: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink, html.auto .sf-c-txt-hotpink { color: hsl(330, 100%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:0, html.auto .sf-c-txt-hotpink\:0 { color: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:5, html.auto .sf-c-txt-hotpink\:5 { color: hsl(330, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:10, html.auto .sf-c-txt-hotpink\:10 { color: hsl(330, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:15, html.auto .sf-c-txt-hotpink\:15 { color: hsl(330, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:20, html.auto .sf-c-txt-hotpink\:20 { color: hsl(330, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:25, html.auto .sf-c-txt-hotpink\:25 { color: hsl(330, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:30, html.auto .sf-c-txt-hotpink\:30 { color: hsl(330, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:35, html.auto .sf-c-txt-hotpink\:35 { color: hsl(330, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:40, html.auto .sf-c-txt-hotpink\:40 { color: hsl(330, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:45, html.auto .sf-c-txt-hotpink\:45 { color: hsl(330, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:50, html.auto .sf-c-txt-hotpink\:50 { color: hsl(330, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:55, html.auto .sf-c-txt-hotpink\:55 { color: hsl(330, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:60, html.auto .sf-c-txt-hotpink\:60 { color: hsl(330, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:65, html.auto .sf-c-txt-hotpink\:65 { color: hsl(330, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:70, html.auto .sf-c-txt-hotpink\:70 { color: hsl(330, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:75, html.auto .sf-c-txt-hotpink\:75 { color: hsl(330, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:80, html.auto .sf-c-txt-hotpink\:80 { color: hsl(330, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:85, html.auto .sf-c-txt-hotpink\:85 { color: hsl(330, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:90, html.auto .sf-c-txt-hotpink\:90 { color: hsl(330, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:95, html.auto .sf-c-txt-hotpink\:95 { color: hsl(330, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:100, html.auto .sf-c-txt-hotpink\:100 { color: hsl(330, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink, html.var.auto .sf-c-txt-hotpink { color: hsl(330, 100%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:0, html.var.auto .sf-c-txt-hotpink\:0 { color: hsl(330, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:5, html.var.auto .sf-c-txt-hotpink\:5 { color: hsl(330, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:10, html.var.auto .sf-c-txt-hotpink\:10 { color: hsl(330, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:15, html.var.auto .sf-c-txt-hotpink\:15 { color: hsl(330, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:20, html.var.auto .sf-c-txt-hotpink\:20 { color: hsl(330, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:25, html.var.auto .sf-c-txt-hotpink\:25 { color: hsl(330, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:30, html.var.auto .sf-c-txt-hotpink\:30 { color: hsl(330, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:35, html.var.auto .sf-c-txt-hotpink\:35 { color: hsl(330, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:40, html.var.auto .sf-c-txt-hotpink\:40 { color: hsl(330, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:45, html.var.auto .sf-c-txt-hotpink\:45 { color: hsl(330, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:50, html.var.auto .sf-c-txt-hotpink\:50 { color: hsl(330, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:55, html.var.auto .sf-c-txt-hotpink\:55 { color: hsl(330, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:60, html.var.auto .sf-c-txt-hotpink\:60 { color: hsl(330, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:65, html.var.auto .sf-c-txt-hotpink\:65 { color: hsl(330, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:70, html.var.auto .sf-c-txt-hotpink\:70 { color: hsl(330, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:75, html.var.auto .sf-c-txt-hotpink\:75 { color: hsl(330, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:80, html.var.auto .sf-c-txt-hotpink\:80 { color: hsl(330, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:85, html.var.auto .sf-c-txt-hotpink\:85 { color: hsl(330, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:90, html.var.auto .sf-c-txt-hotpink\:90 { color: hsl(330, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:95, html.var.auto .sf-c-txt-hotpink\:95 { color: hsl(330, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:100, html.var.auto .sf-c-txt-hotpink\:100 { color: hsl(330, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:dark, html.auto .sf-c-txt-hotpink\:dark { color: hsl(330, 100%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:0\:dark, html.auto .sf-c-txt-hotpink\:0\:dark { color: hsl(330, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:5\:dark, html.auto .sf-c-txt-hotpink\:5\:dark { color: hsl(330, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:10\:dark, html.auto .sf-c-txt-hotpink\:10\:dark { color: hsl(330, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:15\:dark, html.auto .sf-c-txt-hotpink\:15\:dark { color: hsl(330, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:20\:dark, html.auto .sf-c-txt-hotpink\:20\:dark { color: hsl(330, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:25\:dark, html.auto .sf-c-txt-hotpink\:25\:dark { color: hsl(330, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:30\:dark, html.auto .sf-c-txt-hotpink\:30\:dark { color: hsl(330, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:35\:dark, html.auto .sf-c-txt-hotpink\:35\:dark { color: hsl(330, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:40\:dark, html.auto .sf-c-txt-hotpink\:40\:dark { color: hsl(330, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:45\:dark, html.auto .sf-c-txt-hotpink\:45\:dark { color: hsl(330, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:50\:dark, html.auto .sf-c-txt-hotpink\:50\:dark { color: hsl(330, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:55\:dark, html.auto .sf-c-txt-hotpink\:55\:dark { color: hsl(330, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:60\:dark, html.auto .sf-c-txt-hotpink\:60\:dark { color: hsl(330, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:65\:dark, html.auto .sf-c-txt-hotpink\:65\:dark { color: hsl(330, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:70\:dark, html.auto .sf-c-txt-hotpink\:70\:dark { color: hsl(330, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:75\:dark, html.auto .sf-c-txt-hotpink\:75\:dark { color: hsl(330, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:80\:dark, html.auto .sf-c-txt-hotpink\:80\:dark { color: hsl(330, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:85\:dark, html.auto .sf-c-txt-hotpink\:85\:dark { color: hsl(330, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:90\:dark, html.auto .sf-c-txt-hotpink\:90\:dark { color: hsl(330, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:95\:dark, html.auto .sf-c-txt-hotpink\:95\:dark { color: hsl(330, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-hotpink\:100\:dark, html.auto .sf-c-txt-hotpink\:100\:dark { color: hsl(330, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:dark, html.var.auto .sf-c-txt-hotpink\:dark { color: hsl(330, 100%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:0\:dark, html.var.auto .sf-c-txt-hotpink\:0\:dark { color: hsl(330, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:5\:dark, html.var.auto .sf-c-txt-hotpink\:5\:dark { color: hsl(330, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:10\:dark, html.var.auto .sf-c-txt-hotpink\:10\:dark { color: hsl(330, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:15\:dark, html.var.auto .sf-c-txt-hotpink\:15\:dark { color: hsl(330, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:20\:dark, html.var.auto .sf-c-txt-hotpink\:20\:dark { color: hsl(330, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:25\:dark, html.var.auto .sf-c-txt-hotpink\:25\:dark { color: hsl(330, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:30\:dark, html.var.auto .sf-c-txt-hotpink\:30\:dark { color: hsl(330, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:35\:dark, html.var.auto .sf-c-txt-hotpink\:35\:dark { color: hsl(330, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:40\:dark, html.var.auto .sf-c-txt-hotpink\:40\:dark { color: hsl(330, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:45\:dark, html.var.auto .sf-c-txt-hotpink\:45\:dark { color: hsl(330, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:50\:dark, html.var.auto .sf-c-txt-hotpink\:50\:dark { color: hsl(330, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:55\:dark, html.var.auto .sf-c-txt-hotpink\:55\:dark { color: hsl(330, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:60\:dark, html.var.auto .sf-c-txt-hotpink\:60\:dark { color: hsl(330, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:65\:dark, html.var.auto .sf-c-txt-hotpink\:65\:dark { color: hsl(330, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:70\:dark, html.var.auto .sf-c-txt-hotpink\:70\:dark { color: hsl(330, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:75\:dark, html.var.auto .sf-c-txt-hotpink\:75\:dark { color: hsl(330, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:80\:dark, html.var.auto .sf-c-txt-hotpink\:80\:dark { color: hsl(330, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:85\:dark, html.var.auto .sf-c-txt-hotpink\:85\:dark { color: hsl(330, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:90\:dark, html.var.auto .sf-c-txt-hotpink\:90\:dark { color: hsl(330, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:95\:dark, html.var.auto .sf-c-txt-hotpink\:95\:dark { color: hsl(330, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-hotpink\:100\:dark, html.var.auto .sf-c-txt-hotpink\:100\:dark { color: hsl(330, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/indianred.css b/src/colors/20/indianred.css index 3141e9f..4f93c16 100644 --- a/src/colors/20/indianred.css +++ b/src/colors/20/indianred.css @@ -1,4 +1,4 @@ -:root { +[class*='indianred'] { --sf-c-indianred: 0 53% 58%; --sf-c-indianred-0: 0 53% 0%; --sf-c-indianred-5: 0 53% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-indianred\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-indianred\:95\:dark, html.var.auto .sf-c-indianred\:95\:dark { color: hsl(0, 53%, 95%); background: hsl(0, 53%, 5%) } html.var[data-theme='auto'] .sf-c-indianred\:100\:dark, html.var.auto .sf-c-indianred\:100\:dark { color: hsl(0, 53%, 95%); background: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred, html.auto .sf-c-txt-indianred { color: hsl(0, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:0, html.auto .sf-c-txt-indianred\:0 { color: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:5, html.auto .sf-c-txt-indianred\:5 { color: hsl(0, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:10, html.auto .sf-c-txt-indianred\:10 { color: hsl(0, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:15, html.auto .sf-c-txt-indianred\:15 { color: hsl(0, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:20, html.auto .sf-c-txt-indianred\:20 { color: hsl(0, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:25, html.auto .sf-c-txt-indianred\:25 { color: hsl(0, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:30, html.auto .sf-c-txt-indianred\:30 { color: hsl(0, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:35, html.auto .sf-c-txt-indianred\:35 { color: hsl(0, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:40, html.auto .sf-c-txt-indianred\:40 { color: hsl(0, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:45, html.auto .sf-c-txt-indianred\:45 { color: hsl(0, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:50, html.auto .sf-c-txt-indianred\:50 { color: hsl(0, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:55, html.auto .sf-c-txt-indianred\:55 { color: hsl(0, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:60, html.auto .sf-c-txt-indianred\:60 { color: hsl(0, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:65, html.auto .sf-c-txt-indianred\:65 { color: hsl(0, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:70, html.auto .sf-c-txt-indianred\:70 { color: hsl(0, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:75, html.auto .sf-c-txt-indianred\:75 { color: hsl(0, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:80, html.auto .sf-c-txt-indianred\:80 { color: hsl(0, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:85, html.auto .sf-c-txt-indianred\:85 { color: hsl(0, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:90, html.auto .sf-c-txt-indianred\:90 { color: hsl(0, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:95, html.auto .sf-c-txt-indianred\:95 { color: hsl(0, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:100, html.auto .sf-c-txt-indianred\:100 { color: hsl(0, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indianred, html.var.auto .sf-c-txt-indianred { color: hsl(0, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:0, html.var.auto .sf-c-txt-indianred\:0 { color: hsl(0, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:5, html.var.auto .sf-c-txt-indianred\:5 { color: hsl(0, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:10, html.var.auto .sf-c-txt-indianred\:10 { color: hsl(0, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:15, html.var.auto .sf-c-txt-indianred\:15 { color: hsl(0, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:20, html.var.auto .sf-c-txt-indianred\:20 { color: hsl(0, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:25, html.var.auto .sf-c-txt-indianred\:25 { color: hsl(0, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:30, html.var.auto .sf-c-txt-indianred\:30 { color: hsl(0, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:35, html.var.auto .sf-c-txt-indianred\:35 { color: hsl(0, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:40, html.var.auto .sf-c-txt-indianred\:40 { color: hsl(0, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:45, html.var.auto .sf-c-txt-indianred\:45 { color: hsl(0, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:50, html.var.auto .sf-c-txt-indianred\:50 { color: hsl(0, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:55, html.var.auto .sf-c-txt-indianred\:55 { color: hsl(0, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:60, html.var.auto .sf-c-txt-indianred\:60 { color: hsl(0, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:65, html.var.auto .sf-c-txt-indianred\:65 { color: hsl(0, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:70, html.var.auto .sf-c-txt-indianred\:70 { color: hsl(0, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:75, html.var.auto .sf-c-txt-indianred\:75 { color: hsl(0, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:80, html.var.auto .sf-c-txt-indianred\:80 { color: hsl(0, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:85, html.var.auto .sf-c-txt-indianred\:85 { color: hsl(0, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:90, html.var.auto .sf-c-txt-indianred\:90 { color: hsl(0, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:95, html.var.auto .sf-c-txt-indianred\:95 { color: hsl(0, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:100, html.var.auto .sf-c-txt-indianred\:100 { color: hsl(0, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:dark, html.auto .sf-c-txt-indianred\:dark { color: hsl(0, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:0\:dark, html.auto .sf-c-txt-indianred\:0\:dark { color: hsl(0, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:5\:dark, html.auto .sf-c-txt-indianred\:5\:dark { color: hsl(0, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:10\:dark, html.auto .sf-c-txt-indianred\:10\:dark { color: hsl(0, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:15\:dark, html.auto .sf-c-txt-indianred\:15\:dark { color: hsl(0, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:20\:dark, html.auto .sf-c-txt-indianred\:20\:dark { color: hsl(0, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:25\:dark, html.auto .sf-c-txt-indianred\:25\:dark { color: hsl(0, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:30\:dark, html.auto .sf-c-txt-indianred\:30\:dark { color: hsl(0, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:35\:dark, html.auto .sf-c-txt-indianred\:35\:dark { color: hsl(0, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:40\:dark, html.auto .sf-c-txt-indianred\:40\:dark { color: hsl(0, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:45\:dark, html.auto .sf-c-txt-indianred\:45\:dark { color: hsl(0, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:50\:dark, html.auto .sf-c-txt-indianred\:50\:dark { color: hsl(0, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:55\:dark, html.auto .sf-c-txt-indianred\:55\:dark { color: hsl(0, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:60\:dark, html.auto .sf-c-txt-indianred\:60\:dark { color: hsl(0, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:65\:dark, html.auto .sf-c-txt-indianred\:65\:dark { color: hsl(0, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:70\:dark, html.auto .sf-c-txt-indianred\:70\:dark { color: hsl(0, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:75\:dark, html.auto .sf-c-txt-indianred\:75\:dark { color: hsl(0, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:80\:dark, html.auto .sf-c-txt-indianred\:80\:dark { color: hsl(0, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:85\:dark, html.auto .sf-c-txt-indianred\:85\:dark { color: hsl(0, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:90\:dark, html.auto .sf-c-txt-indianred\:90\:dark { color: hsl(0, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:95\:dark, html.auto .sf-c-txt-indianred\:95\:dark { color: hsl(0, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-indianred\:100\:dark, html.auto .sf-c-txt-indianred\:100\:dark { color: hsl(0, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:dark, html.var.auto .sf-c-txt-indianred\:dark { color: hsl(0, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:0\:dark, html.var.auto .sf-c-txt-indianred\:0\:dark { color: hsl(0, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:5\:dark, html.var.auto .sf-c-txt-indianred\:5\:dark { color: hsl(0, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:10\:dark, html.var.auto .sf-c-txt-indianred\:10\:dark { color: hsl(0, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:15\:dark, html.var.auto .sf-c-txt-indianred\:15\:dark { color: hsl(0, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:20\:dark, html.var.auto .sf-c-txt-indianred\:20\:dark { color: hsl(0, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:25\:dark, html.var.auto .sf-c-txt-indianred\:25\:dark { color: hsl(0, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:30\:dark, html.var.auto .sf-c-txt-indianred\:30\:dark { color: hsl(0, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:35\:dark, html.var.auto .sf-c-txt-indianred\:35\:dark { color: hsl(0, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:40\:dark, html.var.auto .sf-c-txt-indianred\:40\:dark { color: hsl(0, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:45\:dark, html.var.auto .sf-c-txt-indianred\:45\:dark { color: hsl(0, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:50\:dark, html.var.auto .sf-c-txt-indianred\:50\:dark { color: hsl(0, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:55\:dark, html.var.auto .sf-c-txt-indianred\:55\:dark { color: hsl(0, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:60\:dark, html.var.auto .sf-c-txt-indianred\:60\:dark { color: hsl(0, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:65\:dark, html.var.auto .sf-c-txt-indianred\:65\:dark { color: hsl(0, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:70\:dark, html.var.auto .sf-c-txt-indianred\:70\:dark { color: hsl(0, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:75\:dark, html.var.auto .sf-c-txt-indianred\:75\:dark { color: hsl(0, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:80\:dark, html.var.auto .sf-c-txt-indianred\:80\:dark { color: hsl(0, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:85\:dark, html.var.auto .sf-c-txt-indianred\:85\:dark { color: hsl(0, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:90\:dark, html.var.auto .sf-c-txt-indianred\:90\:dark { color: hsl(0, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:95\:dark, html.var.auto .sf-c-txt-indianred\:95\:dark { color: hsl(0, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-indianred\:100\:dark, html.var.auto .sf-c-txt-indianred\:100\:dark { color: hsl(0, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/indigo.css b/src/colors/20/indigo.css index f1a2eac..c70c813 100644 --- a/src/colors/20/indigo.css +++ b/src/colors/20/indigo.css @@ -1,4 +1,4 @@ -:root { +[class*='indigo'] { --sf-c-indigo: 275 100% 25%; --sf-c-indigo-0: 275 100% 0%; --sf-c-indigo-5: 275 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-indigo\:100\:dark, html.dark .sf-c-txt-ind html.var[data-theme='auto'] .sf-c-indigo\:95\:dark, html.var.auto .sf-c-indigo\:95\:dark { color: hsl(275, 100%, 95%); background: hsl(275, 100%, 5%) } html.var[data-theme='auto'] .sf-c-indigo\:100\:dark, html.var.auto .sf-c-indigo\:100\:dark { color: hsl(275, 100%, 95%); background: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo, html.auto .sf-c-txt-indigo { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:0, html.auto .sf-c-txt-indigo\:0 { color: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:5, html.auto .sf-c-txt-indigo\:5 { color: hsl(275, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:10, html.auto .sf-c-txt-indigo\:10 { color: hsl(275, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:15, html.auto .sf-c-txt-indigo\:15 { color: hsl(275, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:20, html.auto .sf-c-txt-indigo\:20 { color: hsl(275, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:25, html.auto .sf-c-txt-indigo\:25 { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:30, html.auto .sf-c-txt-indigo\:30 { color: hsl(275, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:35, html.auto .sf-c-txt-indigo\:35 { color: hsl(275, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:40, html.auto .sf-c-txt-indigo\:40 { color: hsl(275, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:45, html.auto .sf-c-txt-indigo\:45 { color: hsl(275, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:50, html.auto .sf-c-txt-indigo\:50 { color: hsl(275, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:55, html.auto .sf-c-txt-indigo\:55 { color: hsl(275, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:60, html.auto .sf-c-txt-indigo\:60 { color: hsl(275, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:65, html.auto .sf-c-txt-indigo\:65 { color: hsl(275, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:70, html.auto .sf-c-txt-indigo\:70 { color: hsl(275, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:75, html.auto .sf-c-txt-indigo\:75 { color: hsl(275, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:80, html.auto .sf-c-txt-indigo\:80 { color: hsl(275, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:85, html.auto .sf-c-txt-indigo\:85 { color: hsl(275, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:90, html.auto .sf-c-txt-indigo\:90 { color: hsl(275, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:95, html.auto .sf-c-txt-indigo\:95 { color: hsl(275, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:100, html.auto .sf-c-txt-indigo\:100 { color: hsl(275, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indigo, html.var.auto .sf-c-txt-indigo { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:0, html.var.auto .sf-c-txt-indigo\:0 { color: hsl(275, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:5, html.var.auto .sf-c-txt-indigo\:5 { color: hsl(275, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:10, html.var.auto .sf-c-txt-indigo\:10 { color: hsl(275, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:15, html.var.auto .sf-c-txt-indigo\:15 { color: hsl(275, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:20, html.var.auto .sf-c-txt-indigo\:20 { color: hsl(275, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:25, html.var.auto .sf-c-txt-indigo\:25 { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:30, html.var.auto .sf-c-txt-indigo\:30 { color: hsl(275, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:35, html.var.auto .sf-c-txt-indigo\:35 { color: hsl(275, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:40, html.var.auto .sf-c-txt-indigo\:40 { color: hsl(275, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:45, html.var.auto .sf-c-txt-indigo\:45 { color: hsl(275, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:50, html.var.auto .sf-c-txt-indigo\:50 { color: hsl(275, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:55, html.var.auto .sf-c-txt-indigo\:55 { color: hsl(275, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:60, html.var.auto .sf-c-txt-indigo\:60 { color: hsl(275, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:65, html.var.auto .sf-c-txt-indigo\:65 { color: hsl(275, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:70, html.var.auto .sf-c-txt-indigo\:70 { color: hsl(275, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:75, html.var.auto .sf-c-txt-indigo\:75 { color: hsl(275, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:80, html.var.auto .sf-c-txt-indigo\:80 { color: hsl(275, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:85, html.var.auto .sf-c-txt-indigo\:85 { color: hsl(275, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:90, html.var.auto .sf-c-txt-indigo\:90 { color: hsl(275, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:95, html.var.auto .sf-c-txt-indigo\:95 { color: hsl(275, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:100, html.var.auto .sf-c-txt-indigo\:100 { color: hsl(275, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:dark, html.auto .sf-c-txt-indigo\:dark { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:0\:dark, html.auto .sf-c-txt-indigo\:0\:dark { color: hsl(275, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:5\:dark, html.auto .sf-c-txt-indigo\:5\:dark { color: hsl(275, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:10\:dark, html.auto .sf-c-txt-indigo\:10\:dark { color: hsl(275, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:15\:dark, html.auto .sf-c-txt-indigo\:15\:dark { color: hsl(275, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:20\:dark, html.auto .sf-c-txt-indigo\:20\:dark { color: hsl(275, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:25\:dark, html.auto .sf-c-txt-indigo\:25\:dark { color: hsl(275, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:30\:dark, html.auto .sf-c-txt-indigo\:30\:dark { color: hsl(275, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:35\:dark, html.auto .sf-c-txt-indigo\:35\:dark { color: hsl(275, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:40\:dark, html.auto .sf-c-txt-indigo\:40\:dark { color: hsl(275, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:45\:dark, html.auto .sf-c-txt-indigo\:45\:dark { color: hsl(275, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:50\:dark, html.auto .sf-c-txt-indigo\:50\:dark { color: hsl(275, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:55\:dark, html.auto .sf-c-txt-indigo\:55\:dark { color: hsl(275, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:60\:dark, html.auto .sf-c-txt-indigo\:60\:dark { color: hsl(275, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:65\:dark, html.auto .sf-c-txt-indigo\:65\:dark { color: hsl(275, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:70\:dark, html.auto .sf-c-txt-indigo\:70\:dark { color: hsl(275, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:75\:dark, html.auto .sf-c-txt-indigo\:75\:dark { color: hsl(275, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:80\:dark, html.auto .sf-c-txt-indigo\:80\:dark { color: hsl(275, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:85\:dark, html.auto .sf-c-txt-indigo\:85\:dark { color: hsl(275, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:90\:dark, html.auto .sf-c-txt-indigo\:90\:dark { color: hsl(275, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:95\:dark, html.auto .sf-c-txt-indigo\:95\:dark { color: hsl(275, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-indigo\:100\:dark, html.auto .sf-c-txt-indigo\:100\:dark { color: hsl(275, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:dark, html.var.auto .sf-c-txt-indigo\:dark { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:0\:dark, html.var.auto .sf-c-txt-indigo\:0\:dark { color: hsl(275, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:5\:dark, html.var.auto .sf-c-txt-indigo\:5\:dark { color: hsl(275, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:10\:dark, html.var.auto .sf-c-txt-indigo\:10\:dark { color: hsl(275, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:15\:dark, html.var.auto .sf-c-txt-indigo\:15\:dark { color: hsl(275, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:20\:dark, html.var.auto .sf-c-txt-indigo\:20\:dark { color: hsl(275, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:25\:dark, html.var.auto .sf-c-txt-indigo\:25\:dark { color: hsl(275, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:30\:dark, html.var.auto .sf-c-txt-indigo\:30\:dark { color: hsl(275, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:35\:dark, html.var.auto .sf-c-txt-indigo\:35\:dark { color: hsl(275, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:40\:dark, html.var.auto .sf-c-txt-indigo\:40\:dark { color: hsl(275, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:45\:dark, html.var.auto .sf-c-txt-indigo\:45\:dark { color: hsl(275, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:50\:dark, html.var.auto .sf-c-txt-indigo\:50\:dark { color: hsl(275, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:55\:dark, html.var.auto .sf-c-txt-indigo\:55\:dark { color: hsl(275, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:60\:dark, html.var.auto .sf-c-txt-indigo\:60\:dark { color: hsl(275, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:65\:dark, html.var.auto .sf-c-txt-indigo\:65\:dark { color: hsl(275, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:70\:dark, html.var.auto .sf-c-txt-indigo\:70\:dark { color: hsl(275, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:75\:dark, html.var.auto .sf-c-txt-indigo\:75\:dark { color: hsl(275, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:80\:dark, html.var.auto .sf-c-txt-indigo\:80\:dark { color: hsl(275, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:85\:dark, html.var.auto .sf-c-txt-indigo\:85\:dark { color: hsl(275, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:90\:dark, html.var.auto .sf-c-txt-indigo\:90\:dark { color: hsl(275, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:95\:dark, html.var.auto .sf-c-txt-indigo\:95\:dark { color: hsl(275, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-indigo\:100\:dark, html.var.auto .sf-c-txt-indigo\:100\:dark { color: hsl(275, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/ivory.css b/src/colors/20/ivory.css index dec6209..85fa968 100644 --- a/src/colors/20/ivory.css +++ b/src/colors/20/ivory.css @@ -1,4 +1,4 @@ -:root { +[class*='ivory'] { --sf-c-ivory: 60 100% 97%; --sf-c-ivory-0: 60 100% 0%; --sf-c-ivory-5: 60 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-ivory\:100\:dark, html.dark .sf-c-txt-ivor html.var[data-theme='auto'] .sf-c-ivory\:95\:dark, html.var.auto .sf-c-ivory\:95\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 5%) } html.var[data-theme='auto'] .sf-c-ivory\:100\:dark, html.var.auto .sf-c-ivory\:100\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory, html.auto .sf-c-txt-ivory { color: hsl(60, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:0, html.auto .sf-c-txt-ivory\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:5, html.auto .sf-c-txt-ivory\:5 { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:10, html.auto .sf-c-txt-ivory\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:15, html.auto .sf-c-txt-ivory\:15 { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:20, html.auto .sf-c-txt-ivory\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:25, html.auto .sf-c-txt-ivory\:25 { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:30, html.auto .sf-c-txt-ivory\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:35, html.auto .sf-c-txt-ivory\:35 { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:40, html.auto .sf-c-txt-ivory\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:45, html.auto .sf-c-txt-ivory\:45 { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:50, html.auto .sf-c-txt-ivory\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:55, html.auto .sf-c-txt-ivory\:55 { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:60, html.auto .sf-c-txt-ivory\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:65, html.auto .sf-c-txt-ivory\:65 { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:70, html.auto .sf-c-txt-ivory\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:75, html.auto .sf-c-txt-ivory\:75 { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:80, html.auto .sf-c-txt-ivory\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:85, html.auto .sf-c-txt-ivory\:85 { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:90, html.auto .sf-c-txt-ivory\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:95, html.auto .sf-c-txt-ivory\:95 { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:100, html.auto .sf-c-txt-ivory\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ivory, html.var.auto .sf-c-txt-ivory { color: hsl(60, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:0, html.var.auto .sf-c-txt-ivory\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:5, html.var.auto .sf-c-txt-ivory\:5 { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:10, html.var.auto .sf-c-txt-ivory\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:15, html.var.auto .sf-c-txt-ivory\:15 { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:20, html.var.auto .sf-c-txt-ivory\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:25, html.var.auto .sf-c-txt-ivory\:25 { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:30, html.var.auto .sf-c-txt-ivory\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:35, html.var.auto .sf-c-txt-ivory\:35 { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:40, html.var.auto .sf-c-txt-ivory\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:45, html.var.auto .sf-c-txt-ivory\:45 { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:50, html.var.auto .sf-c-txt-ivory\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:55, html.var.auto .sf-c-txt-ivory\:55 { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:60, html.var.auto .sf-c-txt-ivory\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:65, html.var.auto .sf-c-txt-ivory\:65 { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:70, html.var.auto .sf-c-txt-ivory\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:75, html.var.auto .sf-c-txt-ivory\:75 { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:80, html.var.auto .sf-c-txt-ivory\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:85, html.var.auto .sf-c-txt-ivory\:85 { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:90, html.var.auto .sf-c-txt-ivory\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:95, html.var.auto .sf-c-txt-ivory\:95 { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:100, html.var.auto .sf-c-txt-ivory\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:dark, html.auto .sf-c-txt-ivory\:dark { color: hsl(60, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:0\:dark, html.auto .sf-c-txt-ivory\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:5\:dark, html.auto .sf-c-txt-ivory\:5\:dark { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:10\:dark, html.auto .sf-c-txt-ivory\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:15\:dark, html.auto .sf-c-txt-ivory\:15\:dark { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:20\:dark, html.auto .sf-c-txt-ivory\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:25\:dark, html.auto .sf-c-txt-ivory\:25\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:30\:dark, html.auto .sf-c-txt-ivory\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:35\:dark, html.auto .sf-c-txt-ivory\:35\:dark { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:40\:dark, html.auto .sf-c-txt-ivory\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:45\:dark, html.auto .sf-c-txt-ivory\:45\:dark { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:50\:dark, html.auto .sf-c-txt-ivory\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:55\:dark, html.auto .sf-c-txt-ivory\:55\:dark { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:60\:dark, html.auto .sf-c-txt-ivory\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:65\:dark, html.auto .sf-c-txt-ivory\:65\:dark { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:70\:dark, html.auto .sf-c-txt-ivory\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:75\:dark, html.auto .sf-c-txt-ivory\:75\:dark { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:80\:dark, html.auto .sf-c-txt-ivory\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:85\:dark, html.auto .sf-c-txt-ivory\:85\:dark { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:90\:dark, html.auto .sf-c-txt-ivory\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:95\:dark, html.auto .sf-c-txt-ivory\:95\:dark { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-ivory\:100\:dark, html.auto .sf-c-txt-ivory\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:dark, html.var.auto .sf-c-txt-ivory\:dark { color: hsl(60, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:0\:dark, html.var.auto .sf-c-txt-ivory\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:5\:dark, html.var.auto .sf-c-txt-ivory\:5\:dark { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:10\:dark, html.var.auto .sf-c-txt-ivory\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:15\:dark, html.var.auto .sf-c-txt-ivory\:15\:dark { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:20\:dark, html.var.auto .sf-c-txt-ivory\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:25\:dark, html.var.auto .sf-c-txt-ivory\:25\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:30\:dark, html.var.auto .sf-c-txt-ivory\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:35\:dark, html.var.auto .sf-c-txt-ivory\:35\:dark { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:40\:dark, html.var.auto .sf-c-txt-ivory\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:45\:dark, html.var.auto .sf-c-txt-ivory\:45\:dark { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:50\:dark, html.var.auto .sf-c-txt-ivory\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:55\:dark, html.var.auto .sf-c-txt-ivory\:55\:dark { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:60\:dark, html.var.auto .sf-c-txt-ivory\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:65\:dark, html.var.auto .sf-c-txt-ivory\:65\:dark { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:70\:dark, html.var.auto .sf-c-txt-ivory\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:75\:dark, html.var.auto .sf-c-txt-ivory\:75\:dark { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:80\:dark, html.var.auto .sf-c-txt-ivory\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:85\:dark, html.var.auto .sf-c-txt-ivory\:85\:dark { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:90\:dark, html.var.auto .sf-c-txt-ivory\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:95\:dark, html.var.auto .sf-c-txt-ivory\:95\:dark { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-ivory\:100\:dark, html.var.auto .sf-c-txt-ivory\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/khaki.css b/src/colors/20/khaki.css index 54034ec..4d3d1a0 100644 --- a/src/colors/20/khaki.css +++ b/src/colors/20/khaki.css @@ -1,4 +1,4 @@ -:root { +[class*='khaki'] { --sf-c-khaki: 54 77% 75%; --sf-c-khaki-0: 54 77% 0%; --sf-c-khaki-5: 54 77% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-khaki\:100\:dark, html.dark .sf-c-txt-khak html.var[data-theme='auto'] .sf-c-khaki\:95\:dark, html.var.auto .sf-c-khaki\:95\:dark { color: hsl(54, 77%, 95%); background: hsl(54, 77%, 5%) } html.var[data-theme='auto'] .sf-c-khaki\:100\:dark, html.var.auto .sf-c-khaki\:100\:dark { color: hsl(54, 77%, 95%); background: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki, html.auto .sf-c-txt-khaki { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:0, html.auto .sf-c-txt-khaki\:0 { color: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:5, html.auto .sf-c-txt-khaki\:5 { color: hsl(54, 77%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:10, html.auto .sf-c-txt-khaki\:10 { color: hsl(54, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:15, html.auto .sf-c-txt-khaki\:15 { color: hsl(54, 77%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:20, html.auto .sf-c-txt-khaki\:20 { color: hsl(54, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:25, html.auto .sf-c-txt-khaki\:25 { color: hsl(54, 77%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:30, html.auto .sf-c-txt-khaki\:30 { color: hsl(54, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:35, html.auto .sf-c-txt-khaki\:35 { color: hsl(54, 77%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:40, html.auto .sf-c-txt-khaki\:40 { color: hsl(54, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:45, html.auto .sf-c-txt-khaki\:45 { color: hsl(54, 77%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:50, html.auto .sf-c-txt-khaki\:50 { color: hsl(54, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:55, html.auto .sf-c-txt-khaki\:55 { color: hsl(54, 77%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:60, html.auto .sf-c-txt-khaki\:60 { color: hsl(54, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:65, html.auto .sf-c-txt-khaki\:65 { color: hsl(54, 77%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:70, html.auto .sf-c-txt-khaki\:70 { color: hsl(54, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:75, html.auto .sf-c-txt-khaki\:75 { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:80, html.auto .sf-c-txt-khaki\:80 { color: hsl(54, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:85, html.auto .sf-c-txt-khaki\:85 { color: hsl(54, 77%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:90, html.auto .sf-c-txt-khaki\:90 { color: hsl(54, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:95, html.auto .sf-c-txt-khaki\:95 { color: hsl(54, 77%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:100, html.auto .sf-c-txt-khaki\:100 { color: hsl(54, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-khaki, html.var.auto .sf-c-txt-khaki { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:0, html.var.auto .sf-c-txt-khaki\:0 { color: hsl(54, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:5, html.var.auto .sf-c-txt-khaki\:5 { color: hsl(54, 77%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:10, html.var.auto .sf-c-txt-khaki\:10 { color: hsl(54, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:15, html.var.auto .sf-c-txt-khaki\:15 { color: hsl(54, 77%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:20, html.var.auto .sf-c-txt-khaki\:20 { color: hsl(54, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:25, html.var.auto .sf-c-txt-khaki\:25 { color: hsl(54, 77%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:30, html.var.auto .sf-c-txt-khaki\:30 { color: hsl(54, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:35, html.var.auto .sf-c-txt-khaki\:35 { color: hsl(54, 77%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:40, html.var.auto .sf-c-txt-khaki\:40 { color: hsl(54, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:45, html.var.auto .sf-c-txt-khaki\:45 { color: hsl(54, 77%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:50, html.var.auto .sf-c-txt-khaki\:50 { color: hsl(54, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:55, html.var.auto .sf-c-txt-khaki\:55 { color: hsl(54, 77%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:60, html.var.auto .sf-c-txt-khaki\:60 { color: hsl(54, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:65, html.var.auto .sf-c-txt-khaki\:65 { color: hsl(54, 77%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:70, html.var.auto .sf-c-txt-khaki\:70 { color: hsl(54, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:75, html.var.auto .sf-c-txt-khaki\:75 { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:80, html.var.auto .sf-c-txt-khaki\:80 { color: hsl(54, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:85, html.var.auto .sf-c-txt-khaki\:85 { color: hsl(54, 77%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:90, html.var.auto .sf-c-txt-khaki\:90 { color: hsl(54, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:95, html.var.auto .sf-c-txt-khaki\:95 { color: hsl(54, 77%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:100, html.var.auto .sf-c-txt-khaki\:100 { color: hsl(54, 77%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:dark, html.auto .sf-c-txt-khaki\:dark { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:0\:dark, html.auto .sf-c-txt-khaki\:0\:dark { color: hsl(54, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:5\:dark, html.auto .sf-c-txt-khaki\:5\:dark { color: hsl(54, 77%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:10\:dark, html.auto .sf-c-txt-khaki\:10\:dark { color: hsl(54, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:15\:dark, html.auto .sf-c-txt-khaki\:15\:dark { color: hsl(54, 77%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:20\:dark, html.auto .sf-c-txt-khaki\:20\:dark { color: hsl(54, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:25\:dark, html.auto .sf-c-txt-khaki\:25\:dark { color: hsl(54, 77%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:30\:dark, html.auto .sf-c-txt-khaki\:30\:dark { color: hsl(54, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:35\:dark, html.auto .sf-c-txt-khaki\:35\:dark { color: hsl(54, 77%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:40\:dark, html.auto .sf-c-txt-khaki\:40\:dark { color: hsl(54, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:45\:dark, html.auto .sf-c-txt-khaki\:45\:dark { color: hsl(54, 77%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:50\:dark, html.auto .sf-c-txt-khaki\:50\:dark { color: hsl(54, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:55\:dark, html.auto .sf-c-txt-khaki\:55\:dark { color: hsl(54, 77%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:60\:dark, html.auto .sf-c-txt-khaki\:60\:dark { color: hsl(54, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:65\:dark, html.auto .sf-c-txt-khaki\:65\:dark { color: hsl(54, 77%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:70\:dark, html.auto .sf-c-txt-khaki\:70\:dark { color: hsl(54, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:75\:dark, html.auto .sf-c-txt-khaki\:75\:dark { color: hsl(54, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:80\:dark, html.auto .sf-c-txt-khaki\:80\:dark { color: hsl(54, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:85\:dark, html.auto .sf-c-txt-khaki\:85\:dark { color: hsl(54, 77%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:90\:dark, html.auto .sf-c-txt-khaki\:90\:dark { color: hsl(54, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:95\:dark, html.auto .sf-c-txt-khaki\:95\:dark { color: hsl(54, 77%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-khaki\:100\:dark, html.auto .sf-c-txt-khaki\:100\:dark { color: hsl(54, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:dark, html.var.auto .sf-c-txt-khaki\:dark { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:0\:dark, html.var.auto .sf-c-txt-khaki\:0\:dark { color: hsl(54, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:5\:dark, html.var.auto .sf-c-txt-khaki\:5\:dark { color: hsl(54, 77%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:10\:dark, html.var.auto .sf-c-txt-khaki\:10\:dark { color: hsl(54, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:15\:dark, html.var.auto .sf-c-txt-khaki\:15\:dark { color: hsl(54, 77%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:20\:dark, html.var.auto .sf-c-txt-khaki\:20\:dark { color: hsl(54, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:25\:dark, html.var.auto .sf-c-txt-khaki\:25\:dark { color: hsl(54, 77%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:30\:dark, html.var.auto .sf-c-txt-khaki\:30\:dark { color: hsl(54, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:35\:dark, html.var.auto .sf-c-txt-khaki\:35\:dark { color: hsl(54, 77%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:40\:dark, html.var.auto .sf-c-txt-khaki\:40\:dark { color: hsl(54, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:45\:dark, html.var.auto .sf-c-txt-khaki\:45\:dark { color: hsl(54, 77%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:50\:dark, html.var.auto .sf-c-txt-khaki\:50\:dark { color: hsl(54, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:55\:dark, html.var.auto .sf-c-txt-khaki\:55\:dark { color: hsl(54, 77%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:60\:dark, html.var.auto .sf-c-txt-khaki\:60\:dark { color: hsl(54, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:65\:dark, html.var.auto .sf-c-txt-khaki\:65\:dark { color: hsl(54, 77%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:70\:dark, html.var.auto .sf-c-txt-khaki\:70\:dark { color: hsl(54, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:75\:dark, html.var.auto .sf-c-txt-khaki\:75\:dark { color: hsl(54, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:80\:dark, html.var.auto .sf-c-txt-khaki\:80\:dark { color: hsl(54, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:85\:dark, html.var.auto .sf-c-txt-khaki\:85\:dark { color: hsl(54, 77%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:90\:dark, html.var.auto .sf-c-txt-khaki\:90\:dark { color: hsl(54, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:95\:dark, html.var.auto .sf-c-txt-khaki\:95\:dark { color: hsl(54, 77%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-khaki\:100\:dark, html.var.auto .sf-c-txt-khaki\:100\:dark { color: hsl(54, 77%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lavender.css b/src/colors/20/lavender.css index f3a35f2..e275219 100644 --- a/src/colors/20/lavender.css +++ b/src/colors/20/lavender.css @@ -1,4 +1,4 @@ -:root { +[class*='lavender'] { --sf-c-lavender: 240 67% 94%; --sf-c-lavender-0: 240 67% 0%; --sf-c-lavender-5: 240 67% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lavender\:100\:dark, html.dark .sf-c-txt-l html.var[data-theme='auto'] .sf-c-lavender\:95\:dark, html.var.auto .sf-c-lavender\:95\:dark { color: hsl(240, 67%, 95%); background: hsl(240, 67%, 5%) } html.var[data-theme='auto'] .sf-c-lavender\:100\:dark, html.var.auto .sf-c-lavender\:100\:dark { color: hsl(240, 67%, 95%); background: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender, html.auto .sf-c-txt-lavender { color: hsl(240, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:0, html.auto .sf-c-txt-lavender\:0 { color: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:5, html.auto .sf-c-txt-lavender\:5 { color: hsl(240, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:10, html.auto .sf-c-txt-lavender\:10 { color: hsl(240, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:15, html.auto .sf-c-txt-lavender\:15 { color: hsl(240, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:20, html.auto .sf-c-txt-lavender\:20 { color: hsl(240, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:25, html.auto .sf-c-txt-lavender\:25 { color: hsl(240, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:30, html.auto .sf-c-txt-lavender\:30 { color: hsl(240, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:35, html.auto .sf-c-txt-lavender\:35 { color: hsl(240, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:40, html.auto .sf-c-txt-lavender\:40 { color: hsl(240, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:45, html.auto .sf-c-txt-lavender\:45 { color: hsl(240, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:50, html.auto .sf-c-txt-lavender\:50 { color: hsl(240, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:55, html.auto .sf-c-txt-lavender\:55 { color: hsl(240, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:60, html.auto .sf-c-txt-lavender\:60 { color: hsl(240, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:65, html.auto .sf-c-txt-lavender\:65 { color: hsl(240, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:70, html.auto .sf-c-txt-lavender\:70 { color: hsl(240, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:75, html.auto .sf-c-txt-lavender\:75 { color: hsl(240, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:80, html.auto .sf-c-txt-lavender\:80 { color: hsl(240, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:85, html.auto .sf-c-txt-lavender\:85 { color: hsl(240, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:90, html.auto .sf-c-txt-lavender\:90 { color: hsl(240, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:95, html.auto .sf-c-txt-lavender\:95 { color: hsl(240, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:100, html.auto .sf-c-txt-lavender\:100 { color: hsl(240, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavender, html.var.auto .sf-c-txt-lavender { color: hsl(240, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:0, html.var.auto .sf-c-txt-lavender\:0 { color: hsl(240, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:5, html.var.auto .sf-c-txt-lavender\:5 { color: hsl(240, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:10, html.var.auto .sf-c-txt-lavender\:10 { color: hsl(240, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:15, html.var.auto .sf-c-txt-lavender\:15 { color: hsl(240, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:20, html.var.auto .sf-c-txt-lavender\:20 { color: hsl(240, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:25, html.var.auto .sf-c-txt-lavender\:25 { color: hsl(240, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:30, html.var.auto .sf-c-txt-lavender\:30 { color: hsl(240, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:35, html.var.auto .sf-c-txt-lavender\:35 { color: hsl(240, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:40, html.var.auto .sf-c-txt-lavender\:40 { color: hsl(240, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:45, html.var.auto .sf-c-txt-lavender\:45 { color: hsl(240, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:50, html.var.auto .sf-c-txt-lavender\:50 { color: hsl(240, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:55, html.var.auto .sf-c-txt-lavender\:55 { color: hsl(240, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:60, html.var.auto .sf-c-txt-lavender\:60 { color: hsl(240, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:65, html.var.auto .sf-c-txt-lavender\:65 { color: hsl(240, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:70, html.var.auto .sf-c-txt-lavender\:70 { color: hsl(240, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:75, html.var.auto .sf-c-txt-lavender\:75 { color: hsl(240, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:80, html.var.auto .sf-c-txt-lavender\:80 { color: hsl(240, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:85, html.var.auto .sf-c-txt-lavender\:85 { color: hsl(240, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:90, html.var.auto .sf-c-txt-lavender\:90 { color: hsl(240, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:95, html.var.auto .sf-c-txt-lavender\:95 { color: hsl(240, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:100, html.var.auto .sf-c-txt-lavender\:100 { color: hsl(240, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:dark, html.auto .sf-c-txt-lavender\:dark { color: hsl(240, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:0\:dark, html.auto .sf-c-txt-lavender\:0\:dark { color: hsl(240, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:5\:dark, html.auto .sf-c-txt-lavender\:5\:dark { color: hsl(240, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:10\:dark, html.auto .sf-c-txt-lavender\:10\:dark { color: hsl(240, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:15\:dark, html.auto .sf-c-txt-lavender\:15\:dark { color: hsl(240, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:20\:dark, html.auto .sf-c-txt-lavender\:20\:dark { color: hsl(240, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:25\:dark, html.auto .sf-c-txt-lavender\:25\:dark { color: hsl(240, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:30\:dark, html.auto .sf-c-txt-lavender\:30\:dark { color: hsl(240, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:35\:dark, html.auto .sf-c-txt-lavender\:35\:dark { color: hsl(240, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:40\:dark, html.auto .sf-c-txt-lavender\:40\:dark { color: hsl(240, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:45\:dark, html.auto .sf-c-txt-lavender\:45\:dark { color: hsl(240, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:50\:dark, html.auto .sf-c-txt-lavender\:50\:dark { color: hsl(240, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:55\:dark, html.auto .sf-c-txt-lavender\:55\:dark { color: hsl(240, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:60\:dark, html.auto .sf-c-txt-lavender\:60\:dark { color: hsl(240, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:65\:dark, html.auto .sf-c-txt-lavender\:65\:dark { color: hsl(240, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:70\:dark, html.auto .sf-c-txt-lavender\:70\:dark { color: hsl(240, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:75\:dark, html.auto .sf-c-txt-lavender\:75\:dark { color: hsl(240, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:80\:dark, html.auto .sf-c-txt-lavender\:80\:dark { color: hsl(240, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:85\:dark, html.auto .sf-c-txt-lavender\:85\:dark { color: hsl(240, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:90\:dark, html.auto .sf-c-txt-lavender\:90\:dark { color: hsl(240, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:95\:dark, html.auto .sf-c-txt-lavender\:95\:dark { color: hsl(240, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lavender\:100\:dark, html.auto .sf-c-txt-lavender\:100\:dark { color: hsl(240, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:dark, html.var.auto .sf-c-txt-lavender\:dark { color: hsl(240, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:0\:dark, html.var.auto .sf-c-txt-lavender\:0\:dark { color: hsl(240, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:5\:dark, html.var.auto .sf-c-txt-lavender\:5\:dark { color: hsl(240, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:10\:dark, html.var.auto .sf-c-txt-lavender\:10\:dark { color: hsl(240, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:15\:dark, html.var.auto .sf-c-txt-lavender\:15\:dark { color: hsl(240, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:20\:dark, html.var.auto .sf-c-txt-lavender\:20\:dark { color: hsl(240, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:25\:dark, html.var.auto .sf-c-txt-lavender\:25\:dark { color: hsl(240, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:30\:dark, html.var.auto .sf-c-txt-lavender\:30\:dark { color: hsl(240, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:35\:dark, html.var.auto .sf-c-txt-lavender\:35\:dark { color: hsl(240, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:40\:dark, html.var.auto .sf-c-txt-lavender\:40\:dark { color: hsl(240, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:45\:dark, html.var.auto .sf-c-txt-lavender\:45\:dark { color: hsl(240, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:50\:dark, html.var.auto .sf-c-txt-lavender\:50\:dark { color: hsl(240, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:55\:dark, html.var.auto .sf-c-txt-lavender\:55\:dark { color: hsl(240, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:60\:dark, html.var.auto .sf-c-txt-lavender\:60\:dark { color: hsl(240, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:65\:dark, html.var.auto .sf-c-txt-lavender\:65\:dark { color: hsl(240, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:70\:dark, html.var.auto .sf-c-txt-lavender\:70\:dark { color: hsl(240, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:75\:dark, html.var.auto .sf-c-txt-lavender\:75\:dark { color: hsl(240, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:80\:dark, html.var.auto .sf-c-txt-lavender\:80\:dark { color: hsl(240, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:85\:dark, html.var.auto .sf-c-txt-lavender\:85\:dark { color: hsl(240, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:90\:dark, html.var.auto .sf-c-txt-lavender\:90\:dark { color: hsl(240, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:95\:dark, html.var.auto .sf-c-txt-lavender\:95\:dark { color: hsl(240, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lavender\:100\:dark, html.var.auto .sf-c-txt-lavender\:100\:dark { color: hsl(240, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lavenderblush.css b/src/colors/20/lavenderblush.css index 5276d8c..a39daa2 100644 --- a/src/colors/20/lavenderblush.css +++ b/src/colors/20/lavenderblush.css @@ -1,4 +1,4 @@ -:root { +[class*='lavenderblush'] { --sf-c-lavenderblush: 340 100% 97%; --sf-c-lavenderblush-0: 340 100% 0%; --sf-c-lavenderblush-5: 340 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lavenderblush\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-lavenderblush\:95\:dark, html.var.auto .sf-c-lavenderblush\:95\:dark { color: hsl(340, 100%, 95%); background: hsl(340, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lavenderblush\:100\:dark, html.var.auto .sf-c-lavenderblush\:100\:dark { color: hsl(340, 100%, 95%); background: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush, html.auto .sf-c-txt-lavenderblush { color: hsl(340, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0, html.auto .sf-c-txt-lavenderblush\:0 { color: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:5, html.auto .sf-c-txt-lavenderblush\:5 { color: hsl(340, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10, html.auto .sf-c-txt-lavenderblush\:10 { color: hsl(340, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:15, html.auto .sf-c-txt-lavenderblush\:15 { color: hsl(340, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20, html.auto .sf-c-txt-lavenderblush\:20 { color: hsl(340, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:25, html.auto .sf-c-txt-lavenderblush\:25 { color: hsl(340, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30, html.auto .sf-c-txt-lavenderblush\:30 { color: hsl(340, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:35, html.auto .sf-c-txt-lavenderblush\:35 { color: hsl(340, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40, html.auto .sf-c-txt-lavenderblush\:40 { color: hsl(340, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:45, html.auto .sf-c-txt-lavenderblush\:45 { color: hsl(340, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50, html.auto .sf-c-txt-lavenderblush\:50 { color: hsl(340, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:55, html.auto .sf-c-txt-lavenderblush\:55 { color: hsl(340, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60, html.auto .sf-c-txt-lavenderblush\:60 { color: hsl(340, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:65, html.auto .sf-c-txt-lavenderblush\:65 { color: hsl(340, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70, html.auto .sf-c-txt-lavenderblush\:70 { color: hsl(340, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:75, html.auto .sf-c-txt-lavenderblush\:75 { color: hsl(340, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80, html.auto .sf-c-txt-lavenderblush\:80 { color: hsl(340, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:85, html.auto .sf-c-txt-lavenderblush\:85 { color: hsl(340, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90, html.auto .sf-c-txt-lavenderblush\:90 { color: hsl(340, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:95, html.auto .sf-c-txt-lavenderblush\:95 { color: hsl(340, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100, html.auto .sf-c-txt-lavenderblush\:100 { color: hsl(340, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush, html.var.auto .sf-c-txt-lavenderblush { color: hsl(340, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0, html.var.auto .sf-c-txt-lavenderblush\:0 { color: hsl(340, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:5, html.var.auto .sf-c-txt-lavenderblush\:5 { color: hsl(340, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10, html.var.auto .sf-c-txt-lavenderblush\:10 { color: hsl(340, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:15, html.var.auto .sf-c-txt-lavenderblush\:15 { color: hsl(340, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20, html.var.auto .sf-c-txt-lavenderblush\:20 { color: hsl(340, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:25, html.var.auto .sf-c-txt-lavenderblush\:25 { color: hsl(340, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30, html.var.auto .sf-c-txt-lavenderblush\:30 { color: hsl(340, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:35, html.var.auto .sf-c-txt-lavenderblush\:35 { color: hsl(340, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40, html.var.auto .sf-c-txt-lavenderblush\:40 { color: hsl(340, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:45, html.var.auto .sf-c-txt-lavenderblush\:45 { color: hsl(340, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50, html.var.auto .sf-c-txt-lavenderblush\:50 { color: hsl(340, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:55, html.var.auto .sf-c-txt-lavenderblush\:55 { color: hsl(340, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60, html.var.auto .sf-c-txt-lavenderblush\:60 { color: hsl(340, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:65, html.var.auto .sf-c-txt-lavenderblush\:65 { color: hsl(340, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70, html.var.auto .sf-c-txt-lavenderblush\:70 { color: hsl(340, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:75, html.var.auto .sf-c-txt-lavenderblush\:75 { color: hsl(340, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80, html.var.auto .sf-c-txt-lavenderblush\:80 { color: hsl(340, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:85, html.var.auto .sf-c-txt-lavenderblush\:85 { color: hsl(340, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90, html.var.auto .sf-c-txt-lavenderblush\:90 { color: hsl(340, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:95, html.var.auto .sf-c-txt-lavenderblush\:95 { color: hsl(340, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100, html.var.auto .sf-c-txt-lavenderblush\:100 { color: hsl(340, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:dark, html.auto .sf-c-txt-lavenderblush\:dark { color: hsl(340, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0\:dark, html.auto .sf-c-txt-lavenderblush\:0\:dark { color: hsl(340, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:5\:dark, html.auto .sf-c-txt-lavenderblush\:5\:dark { color: hsl(340, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10\:dark, html.auto .sf-c-txt-lavenderblush\:10\:dark { color: hsl(340, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:15\:dark, html.auto .sf-c-txt-lavenderblush\:15\:dark { color: hsl(340, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20\:dark, html.auto .sf-c-txt-lavenderblush\:20\:dark { color: hsl(340, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:25\:dark, html.auto .sf-c-txt-lavenderblush\:25\:dark { color: hsl(340, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30\:dark, html.auto .sf-c-txt-lavenderblush\:30\:dark { color: hsl(340, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:35\:dark, html.auto .sf-c-txt-lavenderblush\:35\:dark { color: hsl(340, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40\:dark, html.auto .sf-c-txt-lavenderblush\:40\:dark { color: hsl(340, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:45\:dark, html.auto .sf-c-txt-lavenderblush\:45\:dark { color: hsl(340, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50\:dark, html.auto .sf-c-txt-lavenderblush\:50\:dark { color: hsl(340, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:55\:dark, html.auto .sf-c-txt-lavenderblush\:55\:dark { color: hsl(340, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60\:dark, html.auto .sf-c-txt-lavenderblush\:60\:dark { color: hsl(340, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:65\:dark, html.auto .sf-c-txt-lavenderblush\:65\:dark { color: hsl(340, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70\:dark, html.auto .sf-c-txt-lavenderblush\:70\:dark { color: hsl(340, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:75\:dark, html.auto .sf-c-txt-lavenderblush\:75\:dark { color: hsl(340, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80\:dark, html.auto .sf-c-txt-lavenderblush\:80\:dark { color: hsl(340, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:85\:dark, html.auto .sf-c-txt-lavenderblush\:85\:dark { color: hsl(340, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90\:dark, html.auto .sf-c-txt-lavenderblush\:90\:dark { color: hsl(340, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:95\:dark, html.auto .sf-c-txt-lavenderblush\:95\:dark { color: hsl(340, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100\:dark, html.auto .sf-c-txt-lavenderblush\:100\:dark { color: hsl(340, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:dark, html.var.auto .sf-c-txt-lavenderblush\:dark { color: hsl(340, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:0\:dark, html.var.auto .sf-c-txt-lavenderblush\:0\:dark { color: hsl(340, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:5\:dark, html.var.auto .sf-c-txt-lavenderblush\:5\:dark { color: hsl(340, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:10\:dark, html.var.auto .sf-c-txt-lavenderblush\:10\:dark { color: hsl(340, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:15\:dark, html.var.auto .sf-c-txt-lavenderblush\:15\:dark { color: hsl(340, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:20\:dark, html.var.auto .sf-c-txt-lavenderblush\:20\:dark { color: hsl(340, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:25\:dark, html.var.auto .sf-c-txt-lavenderblush\:25\:dark { color: hsl(340, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:30\:dark, html.var.auto .sf-c-txt-lavenderblush\:30\:dark { color: hsl(340, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:35\:dark, html.var.auto .sf-c-txt-lavenderblush\:35\:dark { color: hsl(340, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:40\:dark, html.var.auto .sf-c-txt-lavenderblush\:40\:dark { color: hsl(340, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:45\:dark, html.var.auto .sf-c-txt-lavenderblush\:45\:dark { color: hsl(340, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:50\:dark, html.var.auto .sf-c-txt-lavenderblush\:50\:dark { color: hsl(340, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:55\:dark, html.var.auto .sf-c-txt-lavenderblush\:55\:dark { color: hsl(340, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:60\:dark, html.var.auto .sf-c-txt-lavenderblush\:60\:dark { color: hsl(340, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:65\:dark, html.var.auto .sf-c-txt-lavenderblush\:65\:dark { color: hsl(340, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:70\:dark, html.var.auto .sf-c-txt-lavenderblush\:70\:dark { color: hsl(340, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:75\:dark, html.var.auto .sf-c-txt-lavenderblush\:75\:dark { color: hsl(340, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:80\:dark, html.var.auto .sf-c-txt-lavenderblush\:80\:dark { color: hsl(340, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:85\:dark, html.var.auto .sf-c-txt-lavenderblush\:85\:dark { color: hsl(340, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:90\:dark, html.var.auto .sf-c-txt-lavenderblush\:90\:dark { color: hsl(340, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:95\:dark, html.var.auto .sf-c-txt-lavenderblush\:95\:dark { color: hsl(340, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lavenderblush\:100\:dark, html.var.auto .sf-c-txt-lavenderblush\:100\:dark { color: hsl(340, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lawngreen.css b/src/colors/20/lawngreen.css index 6da5316..337eb22 100644 --- a/src/colors/20/lawngreen.css +++ b/src/colors/20/lawngreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lawngreen'] { --sf-c-lawngreen: 90 100% 49%; --sf-c-lawngreen-0: 90 100% 0%; --sf-c-lawngreen-5: 90 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lawngreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lawngreen\:95\:dark, html.var.auto .sf-c-lawngreen\:95\:dark { color: hsl(90, 100%, 95%); background: hsl(90, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lawngreen\:100\:dark, html.var.auto .sf-c-lawngreen\:100\:dark { color: hsl(90, 100%, 95%); background: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen, html.auto .sf-c-txt-lawngreen { color: hsl(90, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0, html.auto .sf-c-txt-lawngreen\:0 { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:5, html.auto .sf-c-txt-lawngreen\:5 { color: hsl(90, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10, html.auto .sf-c-txt-lawngreen\:10 { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:15, html.auto .sf-c-txt-lawngreen\:15 { color: hsl(90, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20, html.auto .sf-c-txt-lawngreen\:20 { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:25, html.auto .sf-c-txt-lawngreen\:25 { color: hsl(90, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30, html.auto .sf-c-txt-lawngreen\:30 { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:35, html.auto .sf-c-txt-lawngreen\:35 { color: hsl(90, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40, html.auto .sf-c-txt-lawngreen\:40 { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:45, html.auto .sf-c-txt-lawngreen\:45 { color: hsl(90, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50, html.auto .sf-c-txt-lawngreen\:50 { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:55, html.auto .sf-c-txt-lawngreen\:55 { color: hsl(90, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60, html.auto .sf-c-txt-lawngreen\:60 { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:65, html.auto .sf-c-txt-lawngreen\:65 { color: hsl(90, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70, html.auto .sf-c-txt-lawngreen\:70 { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:75, html.auto .sf-c-txt-lawngreen\:75 { color: hsl(90, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80, html.auto .sf-c-txt-lawngreen\:80 { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:85, html.auto .sf-c-txt-lawngreen\:85 { color: hsl(90, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90, html.auto .sf-c-txt-lawngreen\:90 { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:95, html.auto .sf-c-txt-lawngreen\:95 { color: hsl(90, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100, html.auto .sf-c-txt-lawngreen\:100 { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen, html.var.auto .sf-c-txt-lawngreen { color: hsl(90, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0, html.var.auto .sf-c-txt-lawngreen\:0 { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:5, html.var.auto .sf-c-txt-lawngreen\:5 { color: hsl(90, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10, html.var.auto .sf-c-txt-lawngreen\:10 { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:15, html.var.auto .sf-c-txt-lawngreen\:15 { color: hsl(90, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20, html.var.auto .sf-c-txt-lawngreen\:20 { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:25, html.var.auto .sf-c-txt-lawngreen\:25 { color: hsl(90, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30, html.var.auto .sf-c-txt-lawngreen\:30 { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:35, html.var.auto .sf-c-txt-lawngreen\:35 { color: hsl(90, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40, html.var.auto .sf-c-txt-lawngreen\:40 { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:45, html.var.auto .sf-c-txt-lawngreen\:45 { color: hsl(90, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50, html.var.auto .sf-c-txt-lawngreen\:50 { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:55, html.var.auto .sf-c-txt-lawngreen\:55 { color: hsl(90, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60, html.var.auto .sf-c-txt-lawngreen\:60 { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:65, html.var.auto .sf-c-txt-lawngreen\:65 { color: hsl(90, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70, html.var.auto .sf-c-txt-lawngreen\:70 { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:75, html.var.auto .sf-c-txt-lawngreen\:75 { color: hsl(90, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80, html.var.auto .sf-c-txt-lawngreen\:80 { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:85, html.var.auto .sf-c-txt-lawngreen\:85 { color: hsl(90, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90, html.var.auto .sf-c-txt-lawngreen\:90 { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:95, html.var.auto .sf-c-txt-lawngreen\:95 { color: hsl(90, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100, html.var.auto .sf-c-txt-lawngreen\:100 { color: hsl(90, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:dark, html.auto .sf-c-txt-lawngreen\:dark { color: hsl(90, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0\:dark, html.auto .sf-c-txt-lawngreen\:0\:dark { color: hsl(90, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:5\:dark, html.auto .sf-c-txt-lawngreen\:5\:dark { color: hsl(90, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10\:dark, html.auto .sf-c-txt-lawngreen\:10\:dark { color: hsl(90, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:15\:dark, html.auto .sf-c-txt-lawngreen\:15\:dark { color: hsl(90, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20\:dark, html.auto .sf-c-txt-lawngreen\:20\:dark { color: hsl(90, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:25\:dark, html.auto .sf-c-txt-lawngreen\:25\:dark { color: hsl(90, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30\:dark, html.auto .sf-c-txt-lawngreen\:30\:dark { color: hsl(90, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:35\:dark, html.auto .sf-c-txt-lawngreen\:35\:dark { color: hsl(90, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40\:dark, html.auto .sf-c-txt-lawngreen\:40\:dark { color: hsl(90, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:45\:dark, html.auto .sf-c-txt-lawngreen\:45\:dark { color: hsl(90, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50\:dark, html.auto .sf-c-txt-lawngreen\:50\:dark { color: hsl(90, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:55\:dark, html.auto .sf-c-txt-lawngreen\:55\:dark { color: hsl(90, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60\:dark, html.auto .sf-c-txt-lawngreen\:60\:dark { color: hsl(90, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:65\:dark, html.auto .sf-c-txt-lawngreen\:65\:dark { color: hsl(90, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70\:dark, html.auto .sf-c-txt-lawngreen\:70\:dark { color: hsl(90, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:75\:dark, html.auto .sf-c-txt-lawngreen\:75\:dark { color: hsl(90, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80\:dark, html.auto .sf-c-txt-lawngreen\:80\:dark { color: hsl(90, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:85\:dark, html.auto .sf-c-txt-lawngreen\:85\:dark { color: hsl(90, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90\:dark, html.auto .sf-c-txt-lawngreen\:90\:dark { color: hsl(90, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:95\:dark, html.auto .sf-c-txt-lawngreen\:95\:dark { color: hsl(90, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100\:dark, html.auto .sf-c-txt-lawngreen\:100\:dark { color: hsl(90, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:dark, html.var.auto .sf-c-txt-lawngreen\:dark { color: hsl(90, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:0\:dark, html.var.auto .sf-c-txt-lawngreen\:0\:dark { color: hsl(90, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:5\:dark, html.var.auto .sf-c-txt-lawngreen\:5\:dark { color: hsl(90, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:10\:dark, html.var.auto .sf-c-txt-lawngreen\:10\:dark { color: hsl(90, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:15\:dark, html.var.auto .sf-c-txt-lawngreen\:15\:dark { color: hsl(90, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:20\:dark, html.var.auto .sf-c-txt-lawngreen\:20\:dark { color: hsl(90, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:25\:dark, html.var.auto .sf-c-txt-lawngreen\:25\:dark { color: hsl(90, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:30\:dark, html.var.auto .sf-c-txt-lawngreen\:30\:dark { color: hsl(90, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:35\:dark, html.var.auto .sf-c-txt-lawngreen\:35\:dark { color: hsl(90, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:40\:dark, html.var.auto .sf-c-txt-lawngreen\:40\:dark { color: hsl(90, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:45\:dark, html.var.auto .sf-c-txt-lawngreen\:45\:dark { color: hsl(90, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:50\:dark, html.var.auto .sf-c-txt-lawngreen\:50\:dark { color: hsl(90, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:55\:dark, html.var.auto .sf-c-txt-lawngreen\:55\:dark { color: hsl(90, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:60\:dark, html.var.auto .sf-c-txt-lawngreen\:60\:dark { color: hsl(90, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:65\:dark, html.var.auto .sf-c-txt-lawngreen\:65\:dark { color: hsl(90, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:70\:dark, html.var.auto .sf-c-txt-lawngreen\:70\:dark { color: hsl(90, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:75\:dark, html.var.auto .sf-c-txt-lawngreen\:75\:dark { color: hsl(90, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:80\:dark, html.var.auto .sf-c-txt-lawngreen\:80\:dark { color: hsl(90, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:85\:dark, html.var.auto .sf-c-txt-lawngreen\:85\:dark { color: hsl(90, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:90\:dark, html.var.auto .sf-c-txt-lawngreen\:90\:dark { color: hsl(90, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:95\:dark, html.var.auto .sf-c-txt-lawngreen\:95\:dark { color: hsl(90, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lawngreen\:100\:dark, html.var.auto .sf-c-txt-lawngreen\:100\:dark { color: hsl(90, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lemonchiffon.css b/src/colors/20/lemonchiffon.css index 2f0a1ef..b8501ce 100644 --- a/src/colors/20/lemonchiffon.css +++ b/src/colors/20/lemonchiffon.css @@ -1,4 +1,4 @@ -:root { +[class*='lemonchiffon'] { --sf-c-lemonchiffon: 54 100% 90%; --sf-c-lemonchiffon-0: 54 100% 0%; --sf-c-lemonchiffon-5: 54 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lemonchiffon\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-lemonchiffon\:95\:dark, html.var.auto .sf-c-lemonchiffon\:95\:dark { color: hsl(54, 100%, 95%); background: hsl(54, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lemonchiffon\:100\:dark, html.var.auto .sf-c-lemonchiffon\:100\:dark { color: hsl(54, 100%, 95%); background: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon, html.auto .sf-c-txt-lemonchiffon { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0, html.auto .sf-c-txt-lemonchiffon\:0 { color: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:5, html.auto .sf-c-txt-lemonchiffon\:5 { color: hsl(54, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10, html.auto .sf-c-txt-lemonchiffon\:10 { color: hsl(54, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:15, html.auto .sf-c-txt-lemonchiffon\:15 { color: hsl(54, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20, html.auto .sf-c-txt-lemonchiffon\:20 { color: hsl(54, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:25, html.auto .sf-c-txt-lemonchiffon\:25 { color: hsl(54, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30, html.auto .sf-c-txt-lemonchiffon\:30 { color: hsl(54, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:35, html.auto .sf-c-txt-lemonchiffon\:35 { color: hsl(54, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40, html.auto .sf-c-txt-lemonchiffon\:40 { color: hsl(54, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:45, html.auto .sf-c-txt-lemonchiffon\:45 { color: hsl(54, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50, html.auto .sf-c-txt-lemonchiffon\:50 { color: hsl(54, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:55, html.auto .sf-c-txt-lemonchiffon\:55 { color: hsl(54, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60, html.auto .sf-c-txt-lemonchiffon\:60 { color: hsl(54, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:65, html.auto .sf-c-txt-lemonchiffon\:65 { color: hsl(54, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70, html.auto .sf-c-txt-lemonchiffon\:70 { color: hsl(54, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:75, html.auto .sf-c-txt-lemonchiffon\:75 { color: hsl(54, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80, html.auto .sf-c-txt-lemonchiffon\:80 { color: hsl(54, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:85, html.auto .sf-c-txt-lemonchiffon\:85 { color: hsl(54, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90, html.auto .sf-c-txt-lemonchiffon\:90 { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:95, html.auto .sf-c-txt-lemonchiffon\:95 { color: hsl(54, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100, html.auto .sf-c-txt-lemonchiffon\:100 { color: hsl(54, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon, html.var.auto .sf-c-txt-lemonchiffon { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0, html.var.auto .sf-c-txt-lemonchiffon\:0 { color: hsl(54, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:5, html.var.auto .sf-c-txt-lemonchiffon\:5 { color: hsl(54, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10, html.var.auto .sf-c-txt-lemonchiffon\:10 { color: hsl(54, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:15, html.var.auto .sf-c-txt-lemonchiffon\:15 { color: hsl(54, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20, html.var.auto .sf-c-txt-lemonchiffon\:20 { color: hsl(54, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:25, html.var.auto .sf-c-txt-lemonchiffon\:25 { color: hsl(54, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30, html.var.auto .sf-c-txt-lemonchiffon\:30 { color: hsl(54, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:35, html.var.auto .sf-c-txt-lemonchiffon\:35 { color: hsl(54, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40, html.var.auto .sf-c-txt-lemonchiffon\:40 { color: hsl(54, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:45, html.var.auto .sf-c-txt-lemonchiffon\:45 { color: hsl(54, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50, html.var.auto .sf-c-txt-lemonchiffon\:50 { color: hsl(54, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:55, html.var.auto .sf-c-txt-lemonchiffon\:55 { color: hsl(54, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60, html.var.auto .sf-c-txt-lemonchiffon\:60 { color: hsl(54, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:65, html.var.auto .sf-c-txt-lemonchiffon\:65 { color: hsl(54, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70, html.var.auto .sf-c-txt-lemonchiffon\:70 { color: hsl(54, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:75, html.var.auto .sf-c-txt-lemonchiffon\:75 { color: hsl(54, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80, html.var.auto .sf-c-txt-lemonchiffon\:80 { color: hsl(54, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:85, html.var.auto .sf-c-txt-lemonchiffon\:85 { color: hsl(54, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90, html.var.auto .sf-c-txt-lemonchiffon\:90 { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:95, html.var.auto .sf-c-txt-lemonchiffon\:95 { color: hsl(54, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100, html.var.auto .sf-c-txt-lemonchiffon\:100 { color: hsl(54, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:dark, html.auto .sf-c-txt-lemonchiffon\:dark { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0\:dark, html.auto .sf-c-txt-lemonchiffon\:0\:dark { color: hsl(54, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:5\:dark, html.auto .sf-c-txt-lemonchiffon\:5\:dark { color: hsl(54, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10\:dark, html.auto .sf-c-txt-lemonchiffon\:10\:dark { color: hsl(54, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:15\:dark, html.auto .sf-c-txt-lemonchiffon\:15\:dark { color: hsl(54, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20\:dark, html.auto .sf-c-txt-lemonchiffon\:20\:dark { color: hsl(54, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:25\:dark, html.auto .sf-c-txt-lemonchiffon\:25\:dark { color: hsl(54, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30\:dark, html.auto .sf-c-txt-lemonchiffon\:30\:dark { color: hsl(54, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:35\:dark, html.auto .sf-c-txt-lemonchiffon\:35\:dark { color: hsl(54, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40\:dark, html.auto .sf-c-txt-lemonchiffon\:40\:dark { color: hsl(54, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:45\:dark, html.auto .sf-c-txt-lemonchiffon\:45\:dark { color: hsl(54, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50\:dark, html.auto .sf-c-txt-lemonchiffon\:50\:dark { color: hsl(54, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:55\:dark, html.auto .sf-c-txt-lemonchiffon\:55\:dark { color: hsl(54, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60\:dark, html.auto .sf-c-txt-lemonchiffon\:60\:dark { color: hsl(54, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:65\:dark, html.auto .sf-c-txt-lemonchiffon\:65\:dark { color: hsl(54, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70\:dark, html.auto .sf-c-txt-lemonchiffon\:70\:dark { color: hsl(54, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:75\:dark, html.auto .sf-c-txt-lemonchiffon\:75\:dark { color: hsl(54, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80\:dark, html.auto .sf-c-txt-lemonchiffon\:80\:dark { color: hsl(54, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:85\:dark, html.auto .sf-c-txt-lemonchiffon\:85\:dark { color: hsl(54, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90\:dark, html.auto .sf-c-txt-lemonchiffon\:90\:dark { color: hsl(54, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:95\:dark, html.auto .sf-c-txt-lemonchiffon\:95\:dark { color: hsl(54, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100\:dark, html.auto .sf-c-txt-lemonchiffon\:100\:dark { color: hsl(54, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:dark, html.var.auto .sf-c-txt-lemonchiffon\:dark { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:0\:dark, html.var.auto .sf-c-txt-lemonchiffon\:0\:dark { color: hsl(54, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:5\:dark, html.var.auto .sf-c-txt-lemonchiffon\:5\:dark { color: hsl(54, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:10\:dark, html.var.auto .sf-c-txt-lemonchiffon\:10\:dark { color: hsl(54, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:15\:dark, html.var.auto .sf-c-txt-lemonchiffon\:15\:dark { color: hsl(54, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:20\:dark, html.var.auto .sf-c-txt-lemonchiffon\:20\:dark { color: hsl(54, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:25\:dark, html.var.auto .sf-c-txt-lemonchiffon\:25\:dark { color: hsl(54, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:30\:dark, html.var.auto .sf-c-txt-lemonchiffon\:30\:dark { color: hsl(54, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:35\:dark, html.var.auto .sf-c-txt-lemonchiffon\:35\:dark { color: hsl(54, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:40\:dark, html.var.auto .sf-c-txt-lemonchiffon\:40\:dark { color: hsl(54, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:45\:dark, html.var.auto .sf-c-txt-lemonchiffon\:45\:dark { color: hsl(54, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:50\:dark, html.var.auto .sf-c-txt-lemonchiffon\:50\:dark { color: hsl(54, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:55\:dark, html.var.auto .sf-c-txt-lemonchiffon\:55\:dark { color: hsl(54, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:60\:dark, html.var.auto .sf-c-txt-lemonchiffon\:60\:dark { color: hsl(54, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:65\:dark, html.var.auto .sf-c-txt-lemonchiffon\:65\:dark { color: hsl(54, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:70\:dark, html.var.auto .sf-c-txt-lemonchiffon\:70\:dark { color: hsl(54, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:75\:dark, html.var.auto .sf-c-txt-lemonchiffon\:75\:dark { color: hsl(54, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:80\:dark, html.var.auto .sf-c-txt-lemonchiffon\:80\:dark { color: hsl(54, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:85\:dark, html.var.auto .sf-c-txt-lemonchiffon\:85\:dark { color: hsl(54, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:90\:dark, html.var.auto .sf-c-txt-lemonchiffon\:90\:dark { color: hsl(54, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:95\:dark, html.var.auto .sf-c-txt-lemonchiffon\:95\:dark { color: hsl(54, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lemonchiffon\:100\:dark, html.var.auto .sf-c-txt-lemonchiffon\:100\:dark { color: hsl(54, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightblue.css b/src/colors/20/lightblue.css index e69bb1b..aef9d68 100644 --- a/src/colors/20/lightblue.css +++ b/src/colors/20/lightblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightblue'] { --sf-c-lightblue: 195 53% 79%; --sf-c-lightblue-0: 195 53% 0%; --sf-c-lightblue-5: 195 53% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightblue\:95\:dark, html.var.auto .sf-c-lightblue\:95\:dark { color: hsl(195, 53%, 95%); background: hsl(195, 53%, 5%) } html.var[data-theme='auto'] .sf-c-lightblue\:100\:dark, html.var.auto .sf-c-lightblue\:100\:dark { color: hsl(195, 53%, 95%); background: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue, html.auto .sf-c-txt-lightblue { color: hsl(195, 53%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:0, html.auto .sf-c-txt-lightblue\:0 { color: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:5, html.auto .sf-c-txt-lightblue\:5 { color: hsl(195, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:10, html.auto .sf-c-txt-lightblue\:10 { color: hsl(195, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:15, html.auto .sf-c-txt-lightblue\:15 { color: hsl(195, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:20, html.auto .sf-c-txt-lightblue\:20 { color: hsl(195, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:25, html.auto .sf-c-txt-lightblue\:25 { color: hsl(195, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:30, html.auto .sf-c-txt-lightblue\:30 { color: hsl(195, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:35, html.auto .sf-c-txt-lightblue\:35 { color: hsl(195, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:40, html.auto .sf-c-txt-lightblue\:40 { color: hsl(195, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:45, html.auto .sf-c-txt-lightblue\:45 { color: hsl(195, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:50, html.auto .sf-c-txt-lightblue\:50 { color: hsl(195, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:55, html.auto .sf-c-txt-lightblue\:55 { color: hsl(195, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:60, html.auto .sf-c-txt-lightblue\:60 { color: hsl(195, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:65, html.auto .sf-c-txt-lightblue\:65 { color: hsl(195, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:70, html.auto .sf-c-txt-lightblue\:70 { color: hsl(195, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:75, html.auto .sf-c-txt-lightblue\:75 { color: hsl(195, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:80, html.auto .sf-c-txt-lightblue\:80 { color: hsl(195, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:85, html.auto .sf-c-txt-lightblue\:85 { color: hsl(195, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:90, html.auto .sf-c-txt-lightblue\:90 { color: hsl(195, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:95, html.auto .sf-c-txt-lightblue\:95 { color: hsl(195, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:100, html.auto .sf-c-txt-lightblue\:100 { color: hsl(195, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue, html.var.auto .sf-c-txt-lightblue { color: hsl(195, 53%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:0, html.var.auto .sf-c-txt-lightblue\:0 { color: hsl(195, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:5, html.var.auto .sf-c-txt-lightblue\:5 { color: hsl(195, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:10, html.var.auto .sf-c-txt-lightblue\:10 { color: hsl(195, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:15, html.var.auto .sf-c-txt-lightblue\:15 { color: hsl(195, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:20, html.var.auto .sf-c-txt-lightblue\:20 { color: hsl(195, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:25, html.var.auto .sf-c-txt-lightblue\:25 { color: hsl(195, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:30, html.var.auto .sf-c-txt-lightblue\:30 { color: hsl(195, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:35, html.var.auto .sf-c-txt-lightblue\:35 { color: hsl(195, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:40, html.var.auto .sf-c-txt-lightblue\:40 { color: hsl(195, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:45, html.var.auto .sf-c-txt-lightblue\:45 { color: hsl(195, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:50, html.var.auto .sf-c-txt-lightblue\:50 { color: hsl(195, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:55, html.var.auto .sf-c-txt-lightblue\:55 { color: hsl(195, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:60, html.var.auto .sf-c-txt-lightblue\:60 { color: hsl(195, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:65, html.var.auto .sf-c-txt-lightblue\:65 { color: hsl(195, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:70, html.var.auto .sf-c-txt-lightblue\:70 { color: hsl(195, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:75, html.var.auto .sf-c-txt-lightblue\:75 { color: hsl(195, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:80, html.var.auto .sf-c-txt-lightblue\:80 { color: hsl(195, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:85, html.var.auto .sf-c-txt-lightblue\:85 { color: hsl(195, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:90, html.var.auto .sf-c-txt-lightblue\:90 { color: hsl(195, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:95, html.var.auto .sf-c-txt-lightblue\:95 { color: hsl(195, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:100, html.var.auto .sf-c-txt-lightblue\:100 { color: hsl(195, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:dark, html.auto .sf-c-txt-lightblue\:dark { color: hsl(195, 53%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:0\:dark, html.auto .sf-c-txt-lightblue\:0\:dark { color: hsl(195, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:5\:dark, html.auto .sf-c-txt-lightblue\:5\:dark { color: hsl(195, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:10\:dark, html.auto .sf-c-txt-lightblue\:10\:dark { color: hsl(195, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:15\:dark, html.auto .sf-c-txt-lightblue\:15\:dark { color: hsl(195, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:20\:dark, html.auto .sf-c-txt-lightblue\:20\:dark { color: hsl(195, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:25\:dark, html.auto .sf-c-txt-lightblue\:25\:dark { color: hsl(195, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:30\:dark, html.auto .sf-c-txt-lightblue\:30\:dark { color: hsl(195, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:35\:dark, html.auto .sf-c-txt-lightblue\:35\:dark { color: hsl(195, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:40\:dark, html.auto .sf-c-txt-lightblue\:40\:dark { color: hsl(195, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:45\:dark, html.auto .sf-c-txt-lightblue\:45\:dark { color: hsl(195, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:50\:dark, html.auto .sf-c-txt-lightblue\:50\:dark { color: hsl(195, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:55\:dark, html.auto .sf-c-txt-lightblue\:55\:dark { color: hsl(195, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:60\:dark, html.auto .sf-c-txt-lightblue\:60\:dark { color: hsl(195, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:65\:dark, html.auto .sf-c-txt-lightblue\:65\:dark { color: hsl(195, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:70\:dark, html.auto .sf-c-txt-lightblue\:70\:dark { color: hsl(195, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:75\:dark, html.auto .sf-c-txt-lightblue\:75\:dark { color: hsl(195, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:80\:dark, html.auto .sf-c-txt-lightblue\:80\:dark { color: hsl(195, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:85\:dark, html.auto .sf-c-txt-lightblue\:85\:dark { color: hsl(195, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:90\:dark, html.auto .sf-c-txt-lightblue\:90\:dark { color: hsl(195, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:95\:dark, html.auto .sf-c-txt-lightblue\:95\:dark { color: hsl(195, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightblue\:100\:dark, html.auto .sf-c-txt-lightblue\:100\:dark { color: hsl(195, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:dark, html.var.auto .sf-c-txt-lightblue\:dark { color: hsl(195, 53%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:0\:dark, html.var.auto .sf-c-txt-lightblue\:0\:dark { color: hsl(195, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:5\:dark, html.var.auto .sf-c-txt-lightblue\:5\:dark { color: hsl(195, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:10\:dark, html.var.auto .sf-c-txt-lightblue\:10\:dark { color: hsl(195, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:15\:dark, html.var.auto .sf-c-txt-lightblue\:15\:dark { color: hsl(195, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:20\:dark, html.var.auto .sf-c-txt-lightblue\:20\:dark { color: hsl(195, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:25\:dark, html.var.auto .sf-c-txt-lightblue\:25\:dark { color: hsl(195, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:30\:dark, html.var.auto .sf-c-txt-lightblue\:30\:dark { color: hsl(195, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:35\:dark, html.var.auto .sf-c-txt-lightblue\:35\:dark { color: hsl(195, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:40\:dark, html.var.auto .sf-c-txt-lightblue\:40\:dark { color: hsl(195, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:45\:dark, html.var.auto .sf-c-txt-lightblue\:45\:dark { color: hsl(195, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:50\:dark, html.var.auto .sf-c-txt-lightblue\:50\:dark { color: hsl(195, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:55\:dark, html.var.auto .sf-c-txt-lightblue\:55\:dark { color: hsl(195, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:60\:dark, html.var.auto .sf-c-txt-lightblue\:60\:dark { color: hsl(195, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:65\:dark, html.var.auto .sf-c-txt-lightblue\:65\:dark { color: hsl(195, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:70\:dark, html.var.auto .sf-c-txt-lightblue\:70\:dark { color: hsl(195, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:75\:dark, html.var.auto .sf-c-txt-lightblue\:75\:dark { color: hsl(195, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:80\:dark, html.var.auto .sf-c-txt-lightblue\:80\:dark { color: hsl(195, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:85\:dark, html.var.auto .sf-c-txt-lightblue\:85\:dark { color: hsl(195, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:90\:dark, html.var.auto .sf-c-txt-lightblue\:90\:dark { color: hsl(195, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:95\:dark, html.var.auto .sf-c-txt-lightblue\:95\:dark { color: hsl(195, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightblue\:100\:dark, html.var.auto .sf-c-txt-lightblue\:100\:dark { color: hsl(195, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightcoral.css b/src/colors/20/lightcoral.css index 05b228c..80e1a4d 100644 --- a/src/colors/20/lightcoral.css +++ b/src/colors/20/lightcoral.css @@ -1,4 +1,4 @@ -:root { +[class*='lightcoral'] { --sf-c-lightcoral: 0 79% 72%; --sf-c-lightcoral-0: 0 79% 0%; --sf-c-lightcoral-5: 0 79% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightcoral\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-lightcoral\:95\:dark, html.var.auto .sf-c-lightcoral\:95\:dark { color: hsl(0, 79%, 95%); background: hsl(0, 79%, 5%) } html.var[data-theme='auto'] .sf-c-lightcoral\:100\:dark, html.var.auto .sf-c-lightcoral\:100\:dark { color: hsl(0, 79%, 95%); background: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral, html.auto .sf-c-txt-lightcoral { color: hsl(0, 79%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0, html.auto .sf-c-txt-lightcoral\:0 { color: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:5, html.auto .sf-c-txt-lightcoral\:5 { color: hsl(0, 79%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10, html.auto .sf-c-txt-lightcoral\:10 { color: hsl(0, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:15, html.auto .sf-c-txt-lightcoral\:15 { color: hsl(0, 79%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20, html.auto .sf-c-txt-lightcoral\:20 { color: hsl(0, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:25, html.auto .sf-c-txt-lightcoral\:25 { color: hsl(0, 79%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30, html.auto .sf-c-txt-lightcoral\:30 { color: hsl(0, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:35, html.auto .sf-c-txt-lightcoral\:35 { color: hsl(0, 79%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40, html.auto .sf-c-txt-lightcoral\:40 { color: hsl(0, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:45, html.auto .sf-c-txt-lightcoral\:45 { color: hsl(0, 79%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50, html.auto .sf-c-txt-lightcoral\:50 { color: hsl(0, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:55, html.auto .sf-c-txt-lightcoral\:55 { color: hsl(0, 79%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60, html.auto .sf-c-txt-lightcoral\:60 { color: hsl(0, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:65, html.auto .sf-c-txt-lightcoral\:65 { color: hsl(0, 79%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70, html.auto .sf-c-txt-lightcoral\:70 { color: hsl(0, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:75, html.auto .sf-c-txt-lightcoral\:75 { color: hsl(0, 79%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80, html.auto .sf-c-txt-lightcoral\:80 { color: hsl(0, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:85, html.auto .sf-c-txt-lightcoral\:85 { color: hsl(0, 79%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90, html.auto .sf-c-txt-lightcoral\:90 { color: hsl(0, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:95, html.auto .sf-c-txt-lightcoral\:95 { color: hsl(0, 79%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100, html.auto .sf-c-txt-lightcoral\:100 { color: hsl(0, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral, html.var.auto .sf-c-txt-lightcoral { color: hsl(0, 79%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0, html.var.auto .sf-c-txt-lightcoral\:0 { color: hsl(0, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:5, html.var.auto .sf-c-txt-lightcoral\:5 { color: hsl(0, 79%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10, html.var.auto .sf-c-txt-lightcoral\:10 { color: hsl(0, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:15, html.var.auto .sf-c-txt-lightcoral\:15 { color: hsl(0, 79%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20, html.var.auto .sf-c-txt-lightcoral\:20 { color: hsl(0, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:25, html.var.auto .sf-c-txt-lightcoral\:25 { color: hsl(0, 79%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30, html.var.auto .sf-c-txt-lightcoral\:30 { color: hsl(0, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:35, html.var.auto .sf-c-txt-lightcoral\:35 { color: hsl(0, 79%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40, html.var.auto .sf-c-txt-lightcoral\:40 { color: hsl(0, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:45, html.var.auto .sf-c-txt-lightcoral\:45 { color: hsl(0, 79%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50, html.var.auto .sf-c-txt-lightcoral\:50 { color: hsl(0, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:55, html.var.auto .sf-c-txt-lightcoral\:55 { color: hsl(0, 79%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60, html.var.auto .sf-c-txt-lightcoral\:60 { color: hsl(0, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:65, html.var.auto .sf-c-txt-lightcoral\:65 { color: hsl(0, 79%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70, html.var.auto .sf-c-txt-lightcoral\:70 { color: hsl(0, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:75, html.var.auto .sf-c-txt-lightcoral\:75 { color: hsl(0, 79%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80, html.var.auto .sf-c-txt-lightcoral\:80 { color: hsl(0, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:85, html.var.auto .sf-c-txt-lightcoral\:85 { color: hsl(0, 79%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90, html.var.auto .sf-c-txt-lightcoral\:90 { color: hsl(0, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:95, html.var.auto .sf-c-txt-lightcoral\:95 { color: hsl(0, 79%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100, html.var.auto .sf-c-txt-lightcoral\:100 { color: hsl(0, 79%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:dark, html.auto .sf-c-txt-lightcoral\:dark { color: hsl(0, 79%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0\:dark, html.auto .sf-c-txt-lightcoral\:0\:dark { color: hsl(0, 79%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:5\:dark, html.auto .sf-c-txt-lightcoral\:5\:dark { color: hsl(0, 79%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10\:dark, html.auto .sf-c-txt-lightcoral\:10\:dark { color: hsl(0, 79%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:15\:dark, html.auto .sf-c-txt-lightcoral\:15\:dark { color: hsl(0, 79%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20\:dark, html.auto .sf-c-txt-lightcoral\:20\:dark { color: hsl(0, 79%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:25\:dark, html.auto .sf-c-txt-lightcoral\:25\:dark { color: hsl(0, 79%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30\:dark, html.auto .sf-c-txt-lightcoral\:30\:dark { color: hsl(0, 79%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:35\:dark, html.auto .sf-c-txt-lightcoral\:35\:dark { color: hsl(0, 79%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40\:dark, html.auto .sf-c-txt-lightcoral\:40\:dark { color: hsl(0, 79%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:45\:dark, html.auto .sf-c-txt-lightcoral\:45\:dark { color: hsl(0, 79%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50\:dark, html.auto .sf-c-txt-lightcoral\:50\:dark { color: hsl(0, 79%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:55\:dark, html.auto .sf-c-txt-lightcoral\:55\:dark { color: hsl(0, 79%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60\:dark, html.auto .sf-c-txt-lightcoral\:60\:dark { color: hsl(0, 79%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:65\:dark, html.auto .sf-c-txt-lightcoral\:65\:dark { color: hsl(0, 79%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70\:dark, html.auto .sf-c-txt-lightcoral\:70\:dark { color: hsl(0, 79%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:75\:dark, html.auto .sf-c-txt-lightcoral\:75\:dark { color: hsl(0, 79%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80\:dark, html.auto .sf-c-txt-lightcoral\:80\:dark { color: hsl(0, 79%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:85\:dark, html.auto .sf-c-txt-lightcoral\:85\:dark { color: hsl(0, 79%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90\:dark, html.auto .sf-c-txt-lightcoral\:90\:dark { color: hsl(0, 79%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:95\:dark, html.auto .sf-c-txt-lightcoral\:95\:dark { color: hsl(0, 79%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100\:dark, html.auto .sf-c-txt-lightcoral\:100\:dark { color: hsl(0, 79%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:dark, html.var.auto .sf-c-txt-lightcoral\:dark { color: hsl(0, 79%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:0\:dark, html.var.auto .sf-c-txt-lightcoral\:0\:dark { color: hsl(0, 79%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:5\:dark, html.var.auto .sf-c-txt-lightcoral\:5\:dark { color: hsl(0, 79%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:10\:dark, html.var.auto .sf-c-txt-lightcoral\:10\:dark { color: hsl(0, 79%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:15\:dark, html.var.auto .sf-c-txt-lightcoral\:15\:dark { color: hsl(0, 79%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:20\:dark, html.var.auto .sf-c-txt-lightcoral\:20\:dark { color: hsl(0, 79%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:25\:dark, html.var.auto .sf-c-txt-lightcoral\:25\:dark { color: hsl(0, 79%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:30\:dark, html.var.auto .sf-c-txt-lightcoral\:30\:dark { color: hsl(0, 79%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:35\:dark, html.var.auto .sf-c-txt-lightcoral\:35\:dark { color: hsl(0, 79%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:40\:dark, html.var.auto .sf-c-txt-lightcoral\:40\:dark { color: hsl(0, 79%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:45\:dark, html.var.auto .sf-c-txt-lightcoral\:45\:dark { color: hsl(0, 79%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:50\:dark, html.var.auto .sf-c-txt-lightcoral\:50\:dark { color: hsl(0, 79%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:55\:dark, html.var.auto .sf-c-txt-lightcoral\:55\:dark { color: hsl(0, 79%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:60\:dark, html.var.auto .sf-c-txt-lightcoral\:60\:dark { color: hsl(0, 79%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:65\:dark, html.var.auto .sf-c-txt-lightcoral\:65\:dark { color: hsl(0, 79%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:70\:dark, html.var.auto .sf-c-txt-lightcoral\:70\:dark { color: hsl(0, 79%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:75\:dark, html.var.auto .sf-c-txt-lightcoral\:75\:dark { color: hsl(0, 79%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:80\:dark, html.var.auto .sf-c-txt-lightcoral\:80\:dark { color: hsl(0, 79%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:85\:dark, html.var.auto .sf-c-txt-lightcoral\:85\:dark { color: hsl(0, 79%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:90\:dark, html.var.auto .sf-c-txt-lightcoral\:90\:dark { color: hsl(0, 79%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:95\:dark, html.var.auto .sf-c-txt-lightcoral\:95\:dark { color: hsl(0, 79%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightcoral\:100\:dark, html.var.auto .sf-c-txt-lightcoral\:100\:dark { color: hsl(0, 79%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightcyan.css b/src/colors/20/lightcyan.css index 14180e9..aec16c9 100644 --- a/src/colors/20/lightcyan.css +++ b/src/colors/20/lightcyan.css @@ -1,4 +1,4 @@ -:root { +[class*='lightcyan'] { --sf-c-lightcyan: 180 100% 94%; --sf-c-lightcyan-0: 180 100% 0%; --sf-c-lightcyan-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightcyan\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightcyan\:95\:dark, html.var.auto .sf-c-lightcyan\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lightcyan\:100\:dark, html.var.auto .sf-c-lightcyan\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan, html.auto .sf-c-txt-lightcyan { color: hsl(180, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0, html.auto .sf-c-txt-lightcyan\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:5, html.auto .sf-c-txt-lightcyan\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10, html.auto .sf-c-txt-lightcyan\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:15, html.auto .sf-c-txt-lightcyan\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20, html.auto .sf-c-txt-lightcyan\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:25, html.auto .sf-c-txt-lightcyan\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30, html.auto .sf-c-txt-lightcyan\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:35, html.auto .sf-c-txt-lightcyan\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40, html.auto .sf-c-txt-lightcyan\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:45, html.auto .sf-c-txt-lightcyan\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50, html.auto .sf-c-txt-lightcyan\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:55, html.auto .sf-c-txt-lightcyan\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60, html.auto .sf-c-txt-lightcyan\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:65, html.auto .sf-c-txt-lightcyan\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70, html.auto .sf-c-txt-lightcyan\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:75, html.auto .sf-c-txt-lightcyan\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80, html.auto .sf-c-txt-lightcyan\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:85, html.auto .sf-c-txt-lightcyan\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90, html.auto .sf-c-txt-lightcyan\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:95, html.auto .sf-c-txt-lightcyan\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100, html.auto .sf-c-txt-lightcyan\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan, html.var.auto .sf-c-txt-lightcyan { color: hsl(180, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0, html.var.auto .sf-c-txt-lightcyan\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:5, html.var.auto .sf-c-txt-lightcyan\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10, html.var.auto .sf-c-txt-lightcyan\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:15, html.var.auto .sf-c-txt-lightcyan\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20, html.var.auto .sf-c-txt-lightcyan\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:25, html.var.auto .sf-c-txt-lightcyan\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30, html.var.auto .sf-c-txt-lightcyan\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:35, html.var.auto .sf-c-txt-lightcyan\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40, html.var.auto .sf-c-txt-lightcyan\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:45, html.var.auto .sf-c-txt-lightcyan\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50, html.var.auto .sf-c-txt-lightcyan\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:55, html.var.auto .sf-c-txt-lightcyan\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60, html.var.auto .sf-c-txt-lightcyan\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:65, html.var.auto .sf-c-txt-lightcyan\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70, html.var.auto .sf-c-txt-lightcyan\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:75, html.var.auto .sf-c-txt-lightcyan\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80, html.var.auto .sf-c-txt-lightcyan\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:85, html.var.auto .sf-c-txt-lightcyan\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90, html.var.auto .sf-c-txt-lightcyan\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:95, html.var.auto .sf-c-txt-lightcyan\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100, html.var.auto .sf-c-txt-lightcyan\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:dark, html.auto .sf-c-txt-lightcyan\:dark { color: hsl(180, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0\:dark, html.auto .sf-c-txt-lightcyan\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:5\:dark, html.auto .sf-c-txt-lightcyan\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10\:dark, html.auto .sf-c-txt-lightcyan\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:15\:dark, html.auto .sf-c-txt-lightcyan\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20\:dark, html.auto .sf-c-txt-lightcyan\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:25\:dark, html.auto .sf-c-txt-lightcyan\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30\:dark, html.auto .sf-c-txt-lightcyan\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:35\:dark, html.auto .sf-c-txt-lightcyan\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40\:dark, html.auto .sf-c-txt-lightcyan\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:45\:dark, html.auto .sf-c-txt-lightcyan\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50\:dark, html.auto .sf-c-txt-lightcyan\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:55\:dark, html.auto .sf-c-txt-lightcyan\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60\:dark, html.auto .sf-c-txt-lightcyan\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:65\:dark, html.auto .sf-c-txt-lightcyan\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70\:dark, html.auto .sf-c-txt-lightcyan\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:75\:dark, html.auto .sf-c-txt-lightcyan\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80\:dark, html.auto .sf-c-txt-lightcyan\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:85\:dark, html.auto .sf-c-txt-lightcyan\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90\:dark, html.auto .sf-c-txt-lightcyan\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:95\:dark, html.auto .sf-c-txt-lightcyan\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100\:dark, html.auto .sf-c-txt-lightcyan\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:dark, html.var.auto .sf-c-txt-lightcyan\:dark { color: hsl(180, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:0\:dark, html.var.auto .sf-c-txt-lightcyan\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:5\:dark, html.var.auto .sf-c-txt-lightcyan\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:10\:dark, html.var.auto .sf-c-txt-lightcyan\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:15\:dark, html.var.auto .sf-c-txt-lightcyan\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:20\:dark, html.var.auto .sf-c-txt-lightcyan\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:25\:dark, html.var.auto .sf-c-txt-lightcyan\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:30\:dark, html.var.auto .sf-c-txt-lightcyan\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:35\:dark, html.var.auto .sf-c-txt-lightcyan\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:40\:dark, html.var.auto .sf-c-txt-lightcyan\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:45\:dark, html.var.auto .sf-c-txt-lightcyan\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:50\:dark, html.var.auto .sf-c-txt-lightcyan\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:55\:dark, html.var.auto .sf-c-txt-lightcyan\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:60\:dark, html.var.auto .sf-c-txt-lightcyan\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:65\:dark, html.var.auto .sf-c-txt-lightcyan\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:70\:dark, html.var.auto .sf-c-txt-lightcyan\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:75\:dark, html.var.auto .sf-c-txt-lightcyan\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:80\:dark, html.var.auto .sf-c-txt-lightcyan\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:85\:dark, html.var.auto .sf-c-txt-lightcyan\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:90\:dark, html.var.auto .sf-c-txt-lightcyan\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:95\:dark, html.var.auto .sf-c-txt-lightcyan\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightcyan\:100\:dark, html.var.auto .sf-c-txt-lightcyan\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightgoldenrodyellow.css b/src/colors/20/lightgoldenrodyellow.css index 5599e66..a171af9 100644 --- a/src/colors/20/lightgoldenrodyellow.css +++ b/src/colors/20/lightgoldenrodyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgoldenrodyellow'] { --sf-c-lightgoldenrodyellow: 60 80% 90%; --sf-c-lightgoldenrodyellow-0: 60 80% 0%; --sf-c-lightgoldenrodyellow-5: 60 80% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.dark html.var[data-theme='auto'] .sf-c-lightgoldenrodyellow\:95\:dark, html.var.auto .sf-c-lightgoldenrodyellow\:95\:dark { color: hsl(60, 80%, 95%); background: hsl(60, 80%, 5%) } html.var[data-theme='auto'] .sf-c-lightgoldenrodyellow\:100\:dark, html.var.auto .sf-c-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 95%); background: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow, html.auto .sf-c-txt-lightgoldenrodyellow { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0, html.auto .sf-c-txt-lightgoldenrodyellow\:0 { color: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:5, html.auto .sf-c-txt-lightgoldenrodyellow\:5 { color: hsl(60, 80%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10, html.auto .sf-c-txt-lightgoldenrodyellow\:10 { color: hsl(60, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:15, html.auto .sf-c-txt-lightgoldenrodyellow\:15 { color: hsl(60, 80%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20, html.auto .sf-c-txt-lightgoldenrodyellow\:20 { color: hsl(60, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:25, html.auto .sf-c-txt-lightgoldenrodyellow\:25 { color: hsl(60, 80%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30, html.auto .sf-c-txt-lightgoldenrodyellow\:30 { color: hsl(60, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:35, html.auto .sf-c-txt-lightgoldenrodyellow\:35 { color: hsl(60, 80%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40, html.auto .sf-c-txt-lightgoldenrodyellow\:40 { color: hsl(60, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:45, html.auto .sf-c-txt-lightgoldenrodyellow\:45 { color: hsl(60, 80%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50, html.auto .sf-c-txt-lightgoldenrodyellow\:50 { color: hsl(60, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:55, html.auto .sf-c-txt-lightgoldenrodyellow\:55 { color: hsl(60, 80%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60, html.auto .sf-c-txt-lightgoldenrodyellow\:60 { color: hsl(60, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:65, html.auto .sf-c-txt-lightgoldenrodyellow\:65 { color: hsl(60, 80%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70, html.auto .sf-c-txt-lightgoldenrodyellow\:70 { color: hsl(60, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:75, html.auto .sf-c-txt-lightgoldenrodyellow\:75 { color: hsl(60, 80%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80, html.auto .sf-c-txt-lightgoldenrodyellow\:80 { color: hsl(60, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:85, html.auto .sf-c-txt-lightgoldenrodyellow\:85 { color: hsl(60, 80%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90, html.auto .sf-c-txt-lightgoldenrodyellow\:90 { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:95, html.auto .sf-c-txt-lightgoldenrodyellow\:95 { color: hsl(60, 80%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100, html.auto .sf-c-txt-lightgoldenrodyellow\:100 { color: hsl(60, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow, html.var.auto .sf-c-txt-lightgoldenrodyellow { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0, html.var.auto .sf-c-txt-lightgoldenrodyellow\:0 { color: hsl(60, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:5, html.var.auto .sf-c-txt-lightgoldenrodyellow\:5 { color: hsl(60, 80%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10, html.var.auto .sf-c-txt-lightgoldenrodyellow\:10 { color: hsl(60, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:15, html.var.auto .sf-c-txt-lightgoldenrodyellow\:15 { color: hsl(60, 80%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20, html.var.auto .sf-c-txt-lightgoldenrodyellow\:20 { color: hsl(60, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:25, html.var.auto .sf-c-txt-lightgoldenrodyellow\:25 { color: hsl(60, 80%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30, html.var.auto .sf-c-txt-lightgoldenrodyellow\:30 { color: hsl(60, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:35, html.var.auto .sf-c-txt-lightgoldenrodyellow\:35 { color: hsl(60, 80%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40, html.var.auto .sf-c-txt-lightgoldenrodyellow\:40 { color: hsl(60, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:45, html.var.auto .sf-c-txt-lightgoldenrodyellow\:45 { color: hsl(60, 80%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50, html.var.auto .sf-c-txt-lightgoldenrodyellow\:50 { color: hsl(60, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:55, html.var.auto .sf-c-txt-lightgoldenrodyellow\:55 { color: hsl(60, 80%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60, html.var.auto .sf-c-txt-lightgoldenrodyellow\:60 { color: hsl(60, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:65, html.var.auto .sf-c-txt-lightgoldenrodyellow\:65 { color: hsl(60, 80%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70, html.var.auto .sf-c-txt-lightgoldenrodyellow\:70 { color: hsl(60, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:75, html.var.auto .sf-c-txt-lightgoldenrodyellow\:75 { color: hsl(60, 80%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80, html.var.auto .sf-c-txt-lightgoldenrodyellow\:80 { color: hsl(60, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:85, html.var.auto .sf-c-txt-lightgoldenrodyellow\:85 { color: hsl(60, 80%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90, html.var.auto .sf-c-txt-lightgoldenrodyellow\:90 { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:95, html.var.auto .sf-c-txt-lightgoldenrodyellow\:95 { color: hsl(60, 80%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100, html.var.auto .sf-c-txt-lightgoldenrodyellow\:100 { color: hsl(60, 80%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:dark { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:0\:dark { color: hsl(60, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:5\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:5\:dark { color: hsl(60, 80%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:10\:dark { color: hsl(60, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:15\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:15\:dark { color: hsl(60, 80%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:20\:dark { color: hsl(60, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:25\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:25\:dark { color: hsl(60, 80%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:30\:dark { color: hsl(60, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:35\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:35\:dark { color: hsl(60, 80%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:40\:dark { color: hsl(60, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:45\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:45\:dark { color: hsl(60, 80%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:50\:dark { color: hsl(60, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:55\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:55\:dark { color: hsl(60, 80%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:60\:dark { color: hsl(60, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:65\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:65\:dark { color: hsl(60, 80%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:70\:dark { color: hsl(60, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:75\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:75\:dark { color: hsl(60, 80%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:80\:dark { color: hsl(60, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:85\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:85\:dark { color: hsl(60, 80%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:90\:dark { color: hsl(60, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:95\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:95\:dark { color: hsl(60, 80%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.auto .sf-c-txt-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:dark { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:0\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:0\:dark { color: hsl(60, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:5\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:5\:dark { color: hsl(60, 80%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:10\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:10\:dark { color: hsl(60, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:15\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:15\:dark { color: hsl(60, 80%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:20\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:20\:dark { color: hsl(60, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:25\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:25\:dark { color: hsl(60, 80%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:30\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:30\:dark { color: hsl(60, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:35\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:35\:dark { color: hsl(60, 80%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:40\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:40\:dark { color: hsl(60, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:45\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:45\:dark { color: hsl(60, 80%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:50\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:50\:dark { color: hsl(60, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:55\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:55\:dark { color: hsl(60, 80%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:60\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:60\:dark { color: hsl(60, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:65\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:65\:dark { color: hsl(60, 80%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:70\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:70\:dark { color: hsl(60, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:75\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:75\:dark { color: hsl(60, 80%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:80\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:80\:dark { color: hsl(60, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:85\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:85\:dark { color: hsl(60, 80%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:90\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:90\:dark { color: hsl(60, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:95\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:95\:dark { color: hsl(60, 80%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgoldenrodyellow\:100\:dark, html.var.auto .sf-c-txt-lightgoldenrodyellow\:100\:dark { color: hsl(60, 80%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightgray.css b/src/colors/20/lightgray.css index 83d3483..e9794b5 100644 --- a/src/colors/20/lightgray.css +++ b/src/colors/20/lightgray.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgray'] { --sf-c-lightgray: 0 0% 83%; --sf-c-lightgray-0: 0 0% 0%; --sf-c-lightgray-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightgray\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightgray\:95\:dark, html.var.auto .sf-c-lightgray\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-lightgray\:100\:dark, html.var.auto .sf-c-lightgray\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray, html.auto .sf-c-txt-lightgray { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:0, html.auto .sf-c-txt-lightgray\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:5, html.auto .sf-c-txt-lightgray\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:10, html.auto .sf-c-txt-lightgray\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:15, html.auto .sf-c-txt-lightgray\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:20, html.auto .sf-c-txt-lightgray\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:25, html.auto .sf-c-txt-lightgray\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:30, html.auto .sf-c-txt-lightgray\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:35, html.auto .sf-c-txt-lightgray\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:40, html.auto .sf-c-txt-lightgray\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:45, html.auto .sf-c-txt-lightgray\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:50, html.auto .sf-c-txt-lightgray\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:55, html.auto .sf-c-txt-lightgray\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:60, html.auto .sf-c-txt-lightgray\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:65, html.auto .sf-c-txt-lightgray\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:70, html.auto .sf-c-txt-lightgray\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:75, html.auto .sf-c-txt-lightgray\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:80, html.auto .sf-c-txt-lightgray\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:85, html.auto .sf-c-txt-lightgray\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:90, html.auto .sf-c-txt-lightgray\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:95, html.auto .sf-c-txt-lightgray\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:100, html.auto .sf-c-txt-lightgray\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray, html.var.auto .sf-c-txt-lightgray { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:0, html.var.auto .sf-c-txt-lightgray\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:5, html.var.auto .sf-c-txt-lightgray\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:10, html.var.auto .sf-c-txt-lightgray\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:15, html.var.auto .sf-c-txt-lightgray\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:20, html.var.auto .sf-c-txt-lightgray\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:25, html.var.auto .sf-c-txt-lightgray\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:30, html.var.auto .sf-c-txt-lightgray\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:35, html.var.auto .sf-c-txt-lightgray\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:40, html.var.auto .sf-c-txt-lightgray\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:45, html.var.auto .sf-c-txt-lightgray\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:50, html.var.auto .sf-c-txt-lightgray\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:55, html.var.auto .sf-c-txt-lightgray\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:60, html.var.auto .sf-c-txt-lightgray\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:65, html.var.auto .sf-c-txt-lightgray\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:70, html.var.auto .sf-c-txt-lightgray\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:75, html.var.auto .sf-c-txt-lightgray\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:80, html.var.auto .sf-c-txt-lightgray\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:85, html.var.auto .sf-c-txt-lightgray\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:90, html.var.auto .sf-c-txt-lightgray\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:95, html.var.auto .sf-c-txt-lightgray\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:100, html.var.auto .sf-c-txt-lightgray\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:dark, html.auto .sf-c-txt-lightgray\:dark { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:0\:dark, html.auto .sf-c-txt-lightgray\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:5\:dark, html.auto .sf-c-txt-lightgray\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:10\:dark, html.auto .sf-c-txt-lightgray\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:15\:dark, html.auto .sf-c-txt-lightgray\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:20\:dark, html.auto .sf-c-txt-lightgray\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:25\:dark, html.auto .sf-c-txt-lightgray\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:30\:dark, html.auto .sf-c-txt-lightgray\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:35\:dark, html.auto .sf-c-txt-lightgray\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:40\:dark, html.auto .sf-c-txt-lightgray\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:45\:dark, html.auto .sf-c-txt-lightgray\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:50\:dark, html.auto .sf-c-txt-lightgray\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:55\:dark, html.auto .sf-c-txt-lightgray\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:60\:dark, html.auto .sf-c-txt-lightgray\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:65\:dark, html.auto .sf-c-txt-lightgray\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:70\:dark, html.auto .sf-c-txt-lightgray\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:75\:dark, html.auto .sf-c-txt-lightgray\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:80\:dark, html.auto .sf-c-txt-lightgray\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:85\:dark, html.auto .sf-c-txt-lightgray\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:90\:dark, html.auto .sf-c-txt-lightgray\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:95\:dark, html.auto .sf-c-txt-lightgray\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgray\:100\:dark, html.auto .sf-c-txt-lightgray\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:dark, html.var.auto .sf-c-txt-lightgray\:dark { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:0\:dark, html.var.auto .sf-c-txt-lightgray\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:5\:dark, html.var.auto .sf-c-txt-lightgray\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:10\:dark, html.var.auto .sf-c-txt-lightgray\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:15\:dark, html.var.auto .sf-c-txt-lightgray\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:20\:dark, html.var.auto .sf-c-txt-lightgray\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:25\:dark, html.var.auto .sf-c-txt-lightgray\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:30\:dark, html.var.auto .sf-c-txt-lightgray\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:35\:dark, html.var.auto .sf-c-txt-lightgray\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:40\:dark, html.var.auto .sf-c-txt-lightgray\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:45\:dark, html.var.auto .sf-c-txt-lightgray\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:50\:dark, html.var.auto .sf-c-txt-lightgray\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:55\:dark, html.var.auto .sf-c-txt-lightgray\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:60\:dark, html.var.auto .sf-c-txt-lightgray\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:65\:dark, html.var.auto .sf-c-txt-lightgray\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:70\:dark, html.var.auto .sf-c-txt-lightgray\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:75\:dark, html.var.auto .sf-c-txt-lightgray\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:80\:dark, html.var.auto .sf-c-txt-lightgray\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:85\:dark, html.var.auto .sf-c-txt-lightgray\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:90\:dark, html.var.auto .sf-c-txt-lightgray\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:95\:dark, html.var.auto .sf-c-txt-lightgray\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgray\:100\:dark, html.var.auto .sf-c-txt-lightgray\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightgreen.css b/src/colors/20/lightgreen.css index 0d8a24c..1cf2aaf 100644 --- a/src/colors/20/lightgreen.css +++ b/src/colors/20/lightgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgreen'] { --sf-c-lightgreen: 120 73% 75%; --sf-c-lightgreen-0: 120 73% 0%; --sf-c-lightgreen-5: 120 73% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightgreen\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-lightgreen\:95\:dark, html.var.auto .sf-c-lightgreen\:95\:dark { color: hsl(120, 73%, 95%); background: hsl(120, 73%, 5%) } html.var[data-theme='auto'] .sf-c-lightgreen\:100\:dark, html.var.auto .sf-c-lightgreen\:100\:dark { color: hsl(120, 73%, 95%); background: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen, html.auto .sf-c-txt-lightgreen { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0, html.auto .sf-c-txt-lightgreen\:0 { color: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:5, html.auto .sf-c-txt-lightgreen\:5 { color: hsl(120, 73%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10, html.auto .sf-c-txt-lightgreen\:10 { color: hsl(120, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:15, html.auto .sf-c-txt-lightgreen\:15 { color: hsl(120, 73%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20, html.auto .sf-c-txt-lightgreen\:20 { color: hsl(120, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:25, html.auto .sf-c-txt-lightgreen\:25 { color: hsl(120, 73%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30, html.auto .sf-c-txt-lightgreen\:30 { color: hsl(120, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:35, html.auto .sf-c-txt-lightgreen\:35 { color: hsl(120, 73%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40, html.auto .sf-c-txt-lightgreen\:40 { color: hsl(120, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:45, html.auto .sf-c-txt-lightgreen\:45 { color: hsl(120, 73%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50, html.auto .sf-c-txt-lightgreen\:50 { color: hsl(120, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:55, html.auto .sf-c-txt-lightgreen\:55 { color: hsl(120, 73%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60, html.auto .sf-c-txt-lightgreen\:60 { color: hsl(120, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:65, html.auto .sf-c-txt-lightgreen\:65 { color: hsl(120, 73%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70, html.auto .sf-c-txt-lightgreen\:70 { color: hsl(120, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:75, html.auto .sf-c-txt-lightgreen\:75 { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80, html.auto .sf-c-txt-lightgreen\:80 { color: hsl(120, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:85, html.auto .sf-c-txt-lightgreen\:85 { color: hsl(120, 73%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90, html.auto .sf-c-txt-lightgreen\:90 { color: hsl(120, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:95, html.auto .sf-c-txt-lightgreen\:95 { color: hsl(120, 73%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100, html.auto .sf-c-txt-lightgreen\:100 { color: hsl(120, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen, html.var.auto .sf-c-txt-lightgreen { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0, html.var.auto .sf-c-txt-lightgreen\:0 { color: hsl(120, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:5, html.var.auto .sf-c-txt-lightgreen\:5 { color: hsl(120, 73%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10, html.var.auto .sf-c-txt-lightgreen\:10 { color: hsl(120, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:15, html.var.auto .sf-c-txt-lightgreen\:15 { color: hsl(120, 73%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20, html.var.auto .sf-c-txt-lightgreen\:20 { color: hsl(120, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:25, html.var.auto .sf-c-txt-lightgreen\:25 { color: hsl(120, 73%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30, html.var.auto .sf-c-txt-lightgreen\:30 { color: hsl(120, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:35, html.var.auto .sf-c-txt-lightgreen\:35 { color: hsl(120, 73%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40, html.var.auto .sf-c-txt-lightgreen\:40 { color: hsl(120, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:45, html.var.auto .sf-c-txt-lightgreen\:45 { color: hsl(120, 73%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50, html.var.auto .sf-c-txt-lightgreen\:50 { color: hsl(120, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:55, html.var.auto .sf-c-txt-lightgreen\:55 { color: hsl(120, 73%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60, html.var.auto .sf-c-txt-lightgreen\:60 { color: hsl(120, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:65, html.var.auto .sf-c-txt-lightgreen\:65 { color: hsl(120, 73%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70, html.var.auto .sf-c-txt-lightgreen\:70 { color: hsl(120, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:75, html.var.auto .sf-c-txt-lightgreen\:75 { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80, html.var.auto .sf-c-txt-lightgreen\:80 { color: hsl(120, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:85, html.var.auto .sf-c-txt-lightgreen\:85 { color: hsl(120, 73%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90, html.var.auto .sf-c-txt-lightgreen\:90 { color: hsl(120, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:95, html.var.auto .sf-c-txt-lightgreen\:95 { color: hsl(120, 73%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100, html.var.auto .sf-c-txt-lightgreen\:100 { color: hsl(120, 73%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:dark, html.auto .sf-c-txt-lightgreen\:dark { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0\:dark, html.auto .sf-c-txt-lightgreen\:0\:dark { color: hsl(120, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:5\:dark, html.auto .sf-c-txt-lightgreen\:5\:dark { color: hsl(120, 73%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10\:dark, html.auto .sf-c-txt-lightgreen\:10\:dark { color: hsl(120, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:15\:dark, html.auto .sf-c-txt-lightgreen\:15\:dark { color: hsl(120, 73%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20\:dark, html.auto .sf-c-txt-lightgreen\:20\:dark { color: hsl(120, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:25\:dark, html.auto .sf-c-txt-lightgreen\:25\:dark { color: hsl(120, 73%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30\:dark, html.auto .sf-c-txt-lightgreen\:30\:dark { color: hsl(120, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:35\:dark, html.auto .sf-c-txt-lightgreen\:35\:dark { color: hsl(120, 73%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40\:dark, html.auto .sf-c-txt-lightgreen\:40\:dark { color: hsl(120, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:45\:dark, html.auto .sf-c-txt-lightgreen\:45\:dark { color: hsl(120, 73%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50\:dark, html.auto .sf-c-txt-lightgreen\:50\:dark { color: hsl(120, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:55\:dark, html.auto .sf-c-txt-lightgreen\:55\:dark { color: hsl(120, 73%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60\:dark, html.auto .sf-c-txt-lightgreen\:60\:dark { color: hsl(120, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:65\:dark, html.auto .sf-c-txt-lightgreen\:65\:dark { color: hsl(120, 73%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70\:dark, html.auto .sf-c-txt-lightgreen\:70\:dark { color: hsl(120, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:75\:dark, html.auto .sf-c-txt-lightgreen\:75\:dark { color: hsl(120, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80\:dark, html.auto .sf-c-txt-lightgreen\:80\:dark { color: hsl(120, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:85\:dark, html.auto .sf-c-txt-lightgreen\:85\:dark { color: hsl(120, 73%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90\:dark, html.auto .sf-c-txt-lightgreen\:90\:dark { color: hsl(120, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:95\:dark, html.auto .sf-c-txt-lightgreen\:95\:dark { color: hsl(120, 73%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100\:dark, html.auto .sf-c-txt-lightgreen\:100\:dark { color: hsl(120, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:dark, html.var.auto .sf-c-txt-lightgreen\:dark { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:0\:dark, html.var.auto .sf-c-txt-lightgreen\:0\:dark { color: hsl(120, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:5\:dark, html.var.auto .sf-c-txt-lightgreen\:5\:dark { color: hsl(120, 73%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:10\:dark, html.var.auto .sf-c-txt-lightgreen\:10\:dark { color: hsl(120, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:15\:dark, html.var.auto .sf-c-txt-lightgreen\:15\:dark { color: hsl(120, 73%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:20\:dark, html.var.auto .sf-c-txt-lightgreen\:20\:dark { color: hsl(120, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:25\:dark, html.var.auto .sf-c-txt-lightgreen\:25\:dark { color: hsl(120, 73%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:30\:dark, html.var.auto .sf-c-txt-lightgreen\:30\:dark { color: hsl(120, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:35\:dark, html.var.auto .sf-c-txt-lightgreen\:35\:dark { color: hsl(120, 73%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:40\:dark, html.var.auto .sf-c-txt-lightgreen\:40\:dark { color: hsl(120, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:45\:dark, html.var.auto .sf-c-txt-lightgreen\:45\:dark { color: hsl(120, 73%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:50\:dark, html.var.auto .sf-c-txt-lightgreen\:50\:dark { color: hsl(120, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:55\:dark, html.var.auto .sf-c-txt-lightgreen\:55\:dark { color: hsl(120, 73%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:60\:dark, html.var.auto .sf-c-txt-lightgreen\:60\:dark { color: hsl(120, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:65\:dark, html.var.auto .sf-c-txt-lightgreen\:65\:dark { color: hsl(120, 73%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:70\:dark, html.var.auto .sf-c-txt-lightgreen\:70\:dark { color: hsl(120, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:75\:dark, html.var.auto .sf-c-txt-lightgreen\:75\:dark { color: hsl(120, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:80\:dark, html.var.auto .sf-c-txt-lightgreen\:80\:dark { color: hsl(120, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:85\:dark, html.var.auto .sf-c-txt-lightgreen\:85\:dark { color: hsl(120, 73%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:90\:dark, html.var.auto .sf-c-txt-lightgreen\:90\:dark { color: hsl(120, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:95\:dark, html.var.auto .sf-c-txt-lightgreen\:95\:dark { color: hsl(120, 73%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgreen\:100\:dark, html.var.auto .sf-c-txt-lightgreen\:100\:dark { color: hsl(120, 73%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightgrey.css b/src/colors/20/lightgrey.css index 33194e9..7d2f8e4 100644 --- a/src/colors/20/lightgrey.css +++ b/src/colors/20/lightgrey.css @@ -1,4 +1,4 @@ -:root { +[class*='lightgrey'] { --sf-c-lightgrey: 0 0% 83%; --sf-c-lightgrey-0: 0 0% 0%; --sf-c-lightgrey-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightgrey\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightgrey\:95\:dark, html.var.auto .sf-c-lightgrey\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-lightgrey\:100\:dark, html.var.auto .sf-c-lightgrey\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey, html.auto .sf-c-txt-lightgrey { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0, html.auto .sf-c-txt-lightgrey\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:5, html.auto .sf-c-txt-lightgrey\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10, html.auto .sf-c-txt-lightgrey\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:15, html.auto .sf-c-txt-lightgrey\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20, html.auto .sf-c-txt-lightgrey\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:25, html.auto .sf-c-txt-lightgrey\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30, html.auto .sf-c-txt-lightgrey\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:35, html.auto .sf-c-txt-lightgrey\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40, html.auto .sf-c-txt-lightgrey\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:45, html.auto .sf-c-txt-lightgrey\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50, html.auto .sf-c-txt-lightgrey\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:55, html.auto .sf-c-txt-lightgrey\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60, html.auto .sf-c-txt-lightgrey\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:65, html.auto .sf-c-txt-lightgrey\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70, html.auto .sf-c-txt-lightgrey\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:75, html.auto .sf-c-txt-lightgrey\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80, html.auto .sf-c-txt-lightgrey\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:85, html.auto .sf-c-txt-lightgrey\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90, html.auto .sf-c-txt-lightgrey\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:95, html.auto .sf-c-txt-lightgrey\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100, html.auto .sf-c-txt-lightgrey\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey, html.var.auto .sf-c-txt-lightgrey { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0, html.var.auto .sf-c-txt-lightgrey\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:5, html.var.auto .sf-c-txt-lightgrey\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10, html.var.auto .sf-c-txt-lightgrey\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:15, html.var.auto .sf-c-txt-lightgrey\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20, html.var.auto .sf-c-txt-lightgrey\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:25, html.var.auto .sf-c-txt-lightgrey\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30, html.var.auto .sf-c-txt-lightgrey\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:35, html.var.auto .sf-c-txt-lightgrey\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40, html.var.auto .sf-c-txt-lightgrey\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:45, html.var.auto .sf-c-txt-lightgrey\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50, html.var.auto .sf-c-txt-lightgrey\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:55, html.var.auto .sf-c-txt-lightgrey\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60, html.var.auto .sf-c-txt-lightgrey\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:65, html.var.auto .sf-c-txt-lightgrey\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70, html.var.auto .sf-c-txt-lightgrey\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:75, html.var.auto .sf-c-txt-lightgrey\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80, html.var.auto .sf-c-txt-lightgrey\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:85, html.var.auto .sf-c-txt-lightgrey\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90, html.var.auto .sf-c-txt-lightgrey\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:95, html.var.auto .sf-c-txt-lightgrey\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100, html.var.auto .sf-c-txt-lightgrey\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:dark, html.auto .sf-c-txt-lightgrey\:dark { color: hsl(0, 0%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0\:dark, html.auto .sf-c-txt-lightgrey\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:5\:dark, html.auto .sf-c-txt-lightgrey\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10\:dark, html.auto .sf-c-txt-lightgrey\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:15\:dark, html.auto .sf-c-txt-lightgrey\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20\:dark, html.auto .sf-c-txt-lightgrey\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:25\:dark, html.auto .sf-c-txt-lightgrey\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30\:dark, html.auto .sf-c-txt-lightgrey\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:35\:dark, html.auto .sf-c-txt-lightgrey\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40\:dark, html.auto .sf-c-txt-lightgrey\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:45\:dark, html.auto .sf-c-txt-lightgrey\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50\:dark, html.auto .sf-c-txt-lightgrey\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:55\:dark, html.auto .sf-c-txt-lightgrey\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60\:dark, html.auto .sf-c-txt-lightgrey\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:65\:dark, html.auto .sf-c-txt-lightgrey\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70\:dark, html.auto .sf-c-txt-lightgrey\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:75\:dark, html.auto .sf-c-txt-lightgrey\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80\:dark, html.auto .sf-c-txt-lightgrey\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:85\:dark, html.auto .sf-c-txt-lightgrey\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90\:dark, html.auto .sf-c-txt-lightgrey\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:95\:dark, html.auto .sf-c-txt-lightgrey\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100\:dark, html.auto .sf-c-txt-lightgrey\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:dark, html.var.auto .sf-c-txt-lightgrey\:dark { color: hsl(0, 0%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:0\:dark, html.var.auto .sf-c-txt-lightgrey\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:5\:dark, html.var.auto .sf-c-txt-lightgrey\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:10\:dark, html.var.auto .sf-c-txt-lightgrey\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:15\:dark, html.var.auto .sf-c-txt-lightgrey\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:20\:dark, html.var.auto .sf-c-txt-lightgrey\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:25\:dark, html.var.auto .sf-c-txt-lightgrey\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:30\:dark, html.var.auto .sf-c-txt-lightgrey\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:35\:dark, html.var.auto .sf-c-txt-lightgrey\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:40\:dark, html.var.auto .sf-c-txt-lightgrey\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:45\:dark, html.var.auto .sf-c-txt-lightgrey\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:50\:dark, html.var.auto .sf-c-txt-lightgrey\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:55\:dark, html.var.auto .sf-c-txt-lightgrey\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:60\:dark, html.var.auto .sf-c-txt-lightgrey\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:65\:dark, html.var.auto .sf-c-txt-lightgrey\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:70\:dark, html.var.auto .sf-c-txt-lightgrey\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:75\:dark, html.var.auto .sf-c-txt-lightgrey\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:80\:dark, html.var.auto .sf-c-txt-lightgrey\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:85\:dark, html.var.auto .sf-c-txt-lightgrey\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:90\:dark, html.var.auto .sf-c-txt-lightgrey\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:95\:dark, html.var.auto .sf-c-txt-lightgrey\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightgrey\:100\:dark, html.var.auto .sf-c-txt-lightgrey\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightpink.css b/src/colors/20/lightpink.css index 36b9d64..5c75a25 100644 --- a/src/colors/20/lightpink.css +++ b/src/colors/20/lightpink.css @@ -1,4 +1,4 @@ -:root { +[class*='lightpink'] { --sf-c-lightpink: 351 100% 86%; --sf-c-lightpink-0: 351 100% 0%; --sf-c-lightpink-5: 351 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightpink\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-lightpink\:95\:dark, html.var.auto .sf-c-lightpink\:95\:dark { color: hsl(351, 100%, 95%); background: hsl(351, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lightpink\:100\:dark, html.var.auto .sf-c-lightpink\:100\:dark { color: hsl(351, 100%, 95%); background: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink, html.auto .sf-c-txt-lightpink { color: hsl(351, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:0, html.auto .sf-c-txt-lightpink\:0 { color: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:5, html.auto .sf-c-txt-lightpink\:5 { color: hsl(351, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:10, html.auto .sf-c-txt-lightpink\:10 { color: hsl(351, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:15, html.auto .sf-c-txt-lightpink\:15 { color: hsl(351, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:20, html.auto .sf-c-txt-lightpink\:20 { color: hsl(351, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:25, html.auto .sf-c-txt-lightpink\:25 { color: hsl(351, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:30, html.auto .sf-c-txt-lightpink\:30 { color: hsl(351, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:35, html.auto .sf-c-txt-lightpink\:35 { color: hsl(351, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:40, html.auto .sf-c-txt-lightpink\:40 { color: hsl(351, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:45, html.auto .sf-c-txt-lightpink\:45 { color: hsl(351, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:50, html.auto .sf-c-txt-lightpink\:50 { color: hsl(351, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:55, html.auto .sf-c-txt-lightpink\:55 { color: hsl(351, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:60, html.auto .sf-c-txt-lightpink\:60 { color: hsl(351, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:65, html.auto .sf-c-txt-lightpink\:65 { color: hsl(351, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:70, html.auto .sf-c-txt-lightpink\:70 { color: hsl(351, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:75, html.auto .sf-c-txt-lightpink\:75 { color: hsl(351, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:80, html.auto .sf-c-txt-lightpink\:80 { color: hsl(351, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:85, html.auto .sf-c-txt-lightpink\:85 { color: hsl(351, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:90, html.auto .sf-c-txt-lightpink\:90 { color: hsl(351, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:95, html.auto .sf-c-txt-lightpink\:95 { color: hsl(351, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:100, html.auto .sf-c-txt-lightpink\:100 { color: hsl(351, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink, html.var.auto .sf-c-txt-lightpink { color: hsl(351, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:0, html.var.auto .sf-c-txt-lightpink\:0 { color: hsl(351, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:5, html.var.auto .sf-c-txt-lightpink\:5 { color: hsl(351, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:10, html.var.auto .sf-c-txt-lightpink\:10 { color: hsl(351, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:15, html.var.auto .sf-c-txt-lightpink\:15 { color: hsl(351, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:20, html.var.auto .sf-c-txt-lightpink\:20 { color: hsl(351, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:25, html.var.auto .sf-c-txt-lightpink\:25 { color: hsl(351, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:30, html.var.auto .sf-c-txt-lightpink\:30 { color: hsl(351, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:35, html.var.auto .sf-c-txt-lightpink\:35 { color: hsl(351, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:40, html.var.auto .sf-c-txt-lightpink\:40 { color: hsl(351, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:45, html.var.auto .sf-c-txt-lightpink\:45 { color: hsl(351, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:50, html.var.auto .sf-c-txt-lightpink\:50 { color: hsl(351, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:55, html.var.auto .sf-c-txt-lightpink\:55 { color: hsl(351, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:60, html.var.auto .sf-c-txt-lightpink\:60 { color: hsl(351, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:65, html.var.auto .sf-c-txt-lightpink\:65 { color: hsl(351, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:70, html.var.auto .sf-c-txt-lightpink\:70 { color: hsl(351, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:75, html.var.auto .sf-c-txt-lightpink\:75 { color: hsl(351, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:80, html.var.auto .sf-c-txt-lightpink\:80 { color: hsl(351, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:85, html.var.auto .sf-c-txt-lightpink\:85 { color: hsl(351, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:90, html.var.auto .sf-c-txt-lightpink\:90 { color: hsl(351, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:95, html.var.auto .sf-c-txt-lightpink\:95 { color: hsl(351, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:100, html.var.auto .sf-c-txt-lightpink\:100 { color: hsl(351, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:dark, html.auto .sf-c-txt-lightpink\:dark { color: hsl(351, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:0\:dark, html.auto .sf-c-txt-lightpink\:0\:dark { color: hsl(351, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:5\:dark, html.auto .sf-c-txt-lightpink\:5\:dark { color: hsl(351, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:10\:dark, html.auto .sf-c-txt-lightpink\:10\:dark { color: hsl(351, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:15\:dark, html.auto .sf-c-txt-lightpink\:15\:dark { color: hsl(351, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:20\:dark, html.auto .sf-c-txt-lightpink\:20\:dark { color: hsl(351, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:25\:dark, html.auto .sf-c-txt-lightpink\:25\:dark { color: hsl(351, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:30\:dark, html.auto .sf-c-txt-lightpink\:30\:dark { color: hsl(351, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:35\:dark, html.auto .sf-c-txt-lightpink\:35\:dark { color: hsl(351, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:40\:dark, html.auto .sf-c-txt-lightpink\:40\:dark { color: hsl(351, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:45\:dark, html.auto .sf-c-txt-lightpink\:45\:dark { color: hsl(351, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:50\:dark, html.auto .sf-c-txt-lightpink\:50\:dark { color: hsl(351, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:55\:dark, html.auto .sf-c-txt-lightpink\:55\:dark { color: hsl(351, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:60\:dark, html.auto .sf-c-txt-lightpink\:60\:dark { color: hsl(351, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:65\:dark, html.auto .sf-c-txt-lightpink\:65\:dark { color: hsl(351, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:70\:dark, html.auto .sf-c-txt-lightpink\:70\:dark { color: hsl(351, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:75\:dark, html.auto .sf-c-txt-lightpink\:75\:dark { color: hsl(351, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:80\:dark, html.auto .sf-c-txt-lightpink\:80\:dark { color: hsl(351, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:85\:dark, html.auto .sf-c-txt-lightpink\:85\:dark { color: hsl(351, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:90\:dark, html.auto .sf-c-txt-lightpink\:90\:dark { color: hsl(351, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:95\:dark, html.auto .sf-c-txt-lightpink\:95\:dark { color: hsl(351, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightpink\:100\:dark, html.auto .sf-c-txt-lightpink\:100\:dark { color: hsl(351, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:dark, html.var.auto .sf-c-txt-lightpink\:dark { color: hsl(351, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:0\:dark, html.var.auto .sf-c-txt-lightpink\:0\:dark { color: hsl(351, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:5\:dark, html.var.auto .sf-c-txt-lightpink\:5\:dark { color: hsl(351, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:10\:dark, html.var.auto .sf-c-txt-lightpink\:10\:dark { color: hsl(351, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:15\:dark, html.var.auto .sf-c-txt-lightpink\:15\:dark { color: hsl(351, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:20\:dark, html.var.auto .sf-c-txt-lightpink\:20\:dark { color: hsl(351, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:25\:dark, html.var.auto .sf-c-txt-lightpink\:25\:dark { color: hsl(351, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:30\:dark, html.var.auto .sf-c-txt-lightpink\:30\:dark { color: hsl(351, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:35\:dark, html.var.auto .sf-c-txt-lightpink\:35\:dark { color: hsl(351, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:40\:dark, html.var.auto .sf-c-txt-lightpink\:40\:dark { color: hsl(351, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:45\:dark, html.var.auto .sf-c-txt-lightpink\:45\:dark { color: hsl(351, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:50\:dark, html.var.auto .sf-c-txt-lightpink\:50\:dark { color: hsl(351, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:55\:dark, html.var.auto .sf-c-txt-lightpink\:55\:dark { color: hsl(351, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:60\:dark, html.var.auto .sf-c-txt-lightpink\:60\:dark { color: hsl(351, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:65\:dark, html.var.auto .sf-c-txt-lightpink\:65\:dark { color: hsl(351, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:70\:dark, html.var.auto .sf-c-txt-lightpink\:70\:dark { color: hsl(351, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:75\:dark, html.var.auto .sf-c-txt-lightpink\:75\:dark { color: hsl(351, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:80\:dark, html.var.auto .sf-c-txt-lightpink\:80\:dark { color: hsl(351, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:85\:dark, html.var.auto .sf-c-txt-lightpink\:85\:dark { color: hsl(351, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:90\:dark, html.var.auto .sf-c-txt-lightpink\:90\:dark { color: hsl(351, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:95\:dark, html.var.auto .sf-c-txt-lightpink\:95\:dark { color: hsl(351, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightpink\:100\:dark, html.var.auto .sf-c-txt-lightpink\:100\:dark { color: hsl(351, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightsalmon.css b/src/colors/20/lightsalmon.css index 0847156..50a6b16 100644 --- a/src/colors/20/lightsalmon.css +++ b/src/colors/20/lightsalmon.css @@ -1,4 +1,4 @@ -:root { +[class*='lightsalmon'] { --sf-c-lightsalmon: 17 100% 74%; --sf-c-lightsalmon-0: 17 100% 0%; --sf-c-lightsalmon-5: 17 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightsalmon\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-lightsalmon\:95\:dark, html.var.auto .sf-c-lightsalmon\:95\:dark { color: hsl(17, 100%, 95%); background: hsl(17, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lightsalmon\:100\:dark, html.var.auto .sf-c-lightsalmon\:100\:dark { color: hsl(17, 100%, 95%); background: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon, html.auto .sf-c-txt-lightsalmon { color: hsl(17, 100%, 74%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0, html.auto .sf-c-txt-lightsalmon\:0 { color: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:5, html.auto .sf-c-txt-lightsalmon\:5 { color: hsl(17, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10, html.auto .sf-c-txt-lightsalmon\:10 { color: hsl(17, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:15, html.auto .sf-c-txt-lightsalmon\:15 { color: hsl(17, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20, html.auto .sf-c-txt-lightsalmon\:20 { color: hsl(17, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:25, html.auto .sf-c-txt-lightsalmon\:25 { color: hsl(17, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30, html.auto .sf-c-txt-lightsalmon\:30 { color: hsl(17, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:35, html.auto .sf-c-txt-lightsalmon\:35 { color: hsl(17, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40, html.auto .sf-c-txt-lightsalmon\:40 { color: hsl(17, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:45, html.auto .sf-c-txt-lightsalmon\:45 { color: hsl(17, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50, html.auto .sf-c-txt-lightsalmon\:50 { color: hsl(17, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:55, html.auto .sf-c-txt-lightsalmon\:55 { color: hsl(17, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60, html.auto .sf-c-txt-lightsalmon\:60 { color: hsl(17, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:65, html.auto .sf-c-txt-lightsalmon\:65 { color: hsl(17, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70, html.auto .sf-c-txt-lightsalmon\:70 { color: hsl(17, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:75, html.auto .sf-c-txt-lightsalmon\:75 { color: hsl(17, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80, html.auto .sf-c-txt-lightsalmon\:80 { color: hsl(17, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:85, html.auto .sf-c-txt-lightsalmon\:85 { color: hsl(17, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90, html.auto .sf-c-txt-lightsalmon\:90 { color: hsl(17, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:95, html.auto .sf-c-txt-lightsalmon\:95 { color: hsl(17, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100, html.auto .sf-c-txt-lightsalmon\:100 { color: hsl(17, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon, html.var.auto .sf-c-txt-lightsalmon { color: hsl(17, 100%, 74%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0, html.var.auto .sf-c-txt-lightsalmon\:0 { color: hsl(17, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:5, html.var.auto .sf-c-txt-lightsalmon\:5 { color: hsl(17, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10, html.var.auto .sf-c-txt-lightsalmon\:10 { color: hsl(17, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:15, html.var.auto .sf-c-txt-lightsalmon\:15 { color: hsl(17, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20, html.var.auto .sf-c-txt-lightsalmon\:20 { color: hsl(17, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:25, html.var.auto .sf-c-txt-lightsalmon\:25 { color: hsl(17, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30, html.var.auto .sf-c-txt-lightsalmon\:30 { color: hsl(17, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:35, html.var.auto .sf-c-txt-lightsalmon\:35 { color: hsl(17, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40, html.var.auto .sf-c-txt-lightsalmon\:40 { color: hsl(17, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:45, html.var.auto .sf-c-txt-lightsalmon\:45 { color: hsl(17, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50, html.var.auto .sf-c-txt-lightsalmon\:50 { color: hsl(17, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:55, html.var.auto .sf-c-txt-lightsalmon\:55 { color: hsl(17, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60, html.var.auto .sf-c-txt-lightsalmon\:60 { color: hsl(17, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:65, html.var.auto .sf-c-txt-lightsalmon\:65 { color: hsl(17, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70, html.var.auto .sf-c-txt-lightsalmon\:70 { color: hsl(17, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:75, html.var.auto .sf-c-txt-lightsalmon\:75 { color: hsl(17, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80, html.var.auto .sf-c-txt-lightsalmon\:80 { color: hsl(17, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:85, html.var.auto .sf-c-txt-lightsalmon\:85 { color: hsl(17, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90, html.var.auto .sf-c-txt-lightsalmon\:90 { color: hsl(17, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:95, html.var.auto .sf-c-txt-lightsalmon\:95 { color: hsl(17, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100, html.var.auto .sf-c-txt-lightsalmon\:100 { color: hsl(17, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:dark, html.auto .sf-c-txt-lightsalmon\:dark { color: hsl(17, 100%, 74%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0\:dark, html.auto .sf-c-txt-lightsalmon\:0\:dark { color: hsl(17, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:5\:dark, html.auto .sf-c-txt-lightsalmon\:5\:dark { color: hsl(17, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10\:dark, html.auto .sf-c-txt-lightsalmon\:10\:dark { color: hsl(17, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:15\:dark, html.auto .sf-c-txt-lightsalmon\:15\:dark { color: hsl(17, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20\:dark, html.auto .sf-c-txt-lightsalmon\:20\:dark { color: hsl(17, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:25\:dark, html.auto .sf-c-txt-lightsalmon\:25\:dark { color: hsl(17, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30\:dark, html.auto .sf-c-txt-lightsalmon\:30\:dark { color: hsl(17, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:35\:dark, html.auto .sf-c-txt-lightsalmon\:35\:dark { color: hsl(17, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40\:dark, html.auto .sf-c-txt-lightsalmon\:40\:dark { color: hsl(17, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:45\:dark, html.auto .sf-c-txt-lightsalmon\:45\:dark { color: hsl(17, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50\:dark, html.auto .sf-c-txt-lightsalmon\:50\:dark { color: hsl(17, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:55\:dark, html.auto .sf-c-txt-lightsalmon\:55\:dark { color: hsl(17, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60\:dark, html.auto .sf-c-txt-lightsalmon\:60\:dark { color: hsl(17, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:65\:dark, html.auto .sf-c-txt-lightsalmon\:65\:dark { color: hsl(17, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70\:dark, html.auto .sf-c-txt-lightsalmon\:70\:dark { color: hsl(17, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:75\:dark, html.auto .sf-c-txt-lightsalmon\:75\:dark { color: hsl(17, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80\:dark, html.auto .sf-c-txt-lightsalmon\:80\:dark { color: hsl(17, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:85\:dark, html.auto .sf-c-txt-lightsalmon\:85\:dark { color: hsl(17, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90\:dark, html.auto .sf-c-txt-lightsalmon\:90\:dark { color: hsl(17, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:95\:dark, html.auto .sf-c-txt-lightsalmon\:95\:dark { color: hsl(17, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100\:dark, html.auto .sf-c-txt-lightsalmon\:100\:dark { color: hsl(17, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:dark, html.var.auto .sf-c-txt-lightsalmon\:dark { color: hsl(17, 100%, 74%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:0\:dark, html.var.auto .sf-c-txt-lightsalmon\:0\:dark { color: hsl(17, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:5\:dark, html.var.auto .sf-c-txt-lightsalmon\:5\:dark { color: hsl(17, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:10\:dark, html.var.auto .sf-c-txt-lightsalmon\:10\:dark { color: hsl(17, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:15\:dark, html.var.auto .sf-c-txt-lightsalmon\:15\:dark { color: hsl(17, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:20\:dark, html.var.auto .sf-c-txt-lightsalmon\:20\:dark { color: hsl(17, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:25\:dark, html.var.auto .sf-c-txt-lightsalmon\:25\:dark { color: hsl(17, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:30\:dark, html.var.auto .sf-c-txt-lightsalmon\:30\:dark { color: hsl(17, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:35\:dark, html.var.auto .sf-c-txt-lightsalmon\:35\:dark { color: hsl(17, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:40\:dark, html.var.auto .sf-c-txt-lightsalmon\:40\:dark { color: hsl(17, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:45\:dark, html.var.auto .sf-c-txt-lightsalmon\:45\:dark { color: hsl(17, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:50\:dark, html.var.auto .sf-c-txt-lightsalmon\:50\:dark { color: hsl(17, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:55\:dark, html.var.auto .sf-c-txt-lightsalmon\:55\:dark { color: hsl(17, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:60\:dark, html.var.auto .sf-c-txt-lightsalmon\:60\:dark { color: hsl(17, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:65\:dark, html.var.auto .sf-c-txt-lightsalmon\:65\:dark { color: hsl(17, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:70\:dark, html.var.auto .sf-c-txt-lightsalmon\:70\:dark { color: hsl(17, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:75\:dark, html.var.auto .sf-c-txt-lightsalmon\:75\:dark { color: hsl(17, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:80\:dark, html.var.auto .sf-c-txt-lightsalmon\:80\:dark { color: hsl(17, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:85\:dark, html.var.auto .sf-c-txt-lightsalmon\:85\:dark { color: hsl(17, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:90\:dark, html.var.auto .sf-c-txt-lightsalmon\:90\:dark { color: hsl(17, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:95\:dark, html.var.auto .sf-c-txt-lightsalmon\:95\:dark { color: hsl(17, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightsalmon\:100\:dark, html.var.auto .sf-c-txt-lightsalmon\:100\:dark { color: hsl(17, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightseagreen.css b/src/colors/20/lightseagreen.css index f8d4f9c..cb4ae69 100644 --- a/src/colors/20/lightseagreen.css +++ b/src/colors/20/lightseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='lightseagreen'] { --sf-c-lightseagreen: 177 70% 41%; --sf-c-lightseagreen-0: 177 70% 0%; --sf-c-lightseagreen-5: 177 70% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightseagreen\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-lightseagreen\:95\:dark, html.var.auto .sf-c-lightseagreen\:95\:dark { color: hsl(177, 70%, 95%); background: hsl(177, 70%, 5%) } html.var[data-theme='auto'] .sf-c-lightseagreen\:100\:dark, html.var.auto .sf-c-lightseagreen\:100\:dark { color: hsl(177, 70%, 95%); background: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen, html.auto .sf-c-txt-lightseagreen { color: hsl(177, 70%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0, html.auto .sf-c-txt-lightseagreen\:0 { color: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:5, html.auto .sf-c-txt-lightseagreen\:5 { color: hsl(177, 70%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10, html.auto .sf-c-txt-lightseagreen\:10 { color: hsl(177, 70%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:15, html.auto .sf-c-txt-lightseagreen\:15 { color: hsl(177, 70%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20, html.auto .sf-c-txt-lightseagreen\:20 { color: hsl(177, 70%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:25, html.auto .sf-c-txt-lightseagreen\:25 { color: hsl(177, 70%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30, html.auto .sf-c-txt-lightseagreen\:30 { color: hsl(177, 70%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:35, html.auto .sf-c-txt-lightseagreen\:35 { color: hsl(177, 70%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40, html.auto .sf-c-txt-lightseagreen\:40 { color: hsl(177, 70%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:45, html.auto .sf-c-txt-lightseagreen\:45 { color: hsl(177, 70%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50, html.auto .sf-c-txt-lightseagreen\:50 { color: hsl(177, 70%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:55, html.auto .sf-c-txt-lightseagreen\:55 { color: hsl(177, 70%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60, html.auto .sf-c-txt-lightseagreen\:60 { color: hsl(177, 70%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:65, html.auto .sf-c-txt-lightseagreen\:65 { color: hsl(177, 70%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70, html.auto .sf-c-txt-lightseagreen\:70 { color: hsl(177, 70%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:75, html.auto .sf-c-txt-lightseagreen\:75 { color: hsl(177, 70%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80, html.auto .sf-c-txt-lightseagreen\:80 { color: hsl(177, 70%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:85, html.auto .sf-c-txt-lightseagreen\:85 { color: hsl(177, 70%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90, html.auto .sf-c-txt-lightseagreen\:90 { color: hsl(177, 70%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:95, html.auto .sf-c-txt-lightseagreen\:95 { color: hsl(177, 70%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100, html.auto .sf-c-txt-lightseagreen\:100 { color: hsl(177, 70%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen, html.var.auto .sf-c-txt-lightseagreen { color: hsl(177, 70%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0, html.var.auto .sf-c-txt-lightseagreen\:0 { color: hsl(177, 70%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:5, html.var.auto .sf-c-txt-lightseagreen\:5 { color: hsl(177, 70%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10, html.var.auto .sf-c-txt-lightseagreen\:10 { color: hsl(177, 70%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:15, html.var.auto .sf-c-txt-lightseagreen\:15 { color: hsl(177, 70%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20, html.var.auto .sf-c-txt-lightseagreen\:20 { color: hsl(177, 70%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:25, html.var.auto .sf-c-txt-lightseagreen\:25 { color: hsl(177, 70%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30, html.var.auto .sf-c-txt-lightseagreen\:30 { color: hsl(177, 70%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:35, html.var.auto .sf-c-txt-lightseagreen\:35 { color: hsl(177, 70%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40, html.var.auto .sf-c-txt-lightseagreen\:40 { color: hsl(177, 70%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:45, html.var.auto .sf-c-txt-lightseagreen\:45 { color: hsl(177, 70%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50, html.var.auto .sf-c-txt-lightseagreen\:50 { color: hsl(177, 70%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:55, html.var.auto .sf-c-txt-lightseagreen\:55 { color: hsl(177, 70%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60, html.var.auto .sf-c-txt-lightseagreen\:60 { color: hsl(177, 70%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:65, html.var.auto .sf-c-txt-lightseagreen\:65 { color: hsl(177, 70%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70, html.var.auto .sf-c-txt-lightseagreen\:70 { color: hsl(177, 70%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:75, html.var.auto .sf-c-txt-lightseagreen\:75 { color: hsl(177, 70%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80, html.var.auto .sf-c-txt-lightseagreen\:80 { color: hsl(177, 70%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:85, html.var.auto .sf-c-txt-lightseagreen\:85 { color: hsl(177, 70%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90, html.var.auto .sf-c-txt-lightseagreen\:90 { color: hsl(177, 70%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:95, html.var.auto .sf-c-txt-lightseagreen\:95 { color: hsl(177, 70%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100, html.var.auto .sf-c-txt-lightseagreen\:100 { color: hsl(177, 70%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:dark, html.auto .sf-c-txt-lightseagreen\:dark { color: hsl(177, 70%, 41%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0\:dark, html.auto .sf-c-txt-lightseagreen\:0\:dark { color: hsl(177, 70%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:5\:dark, html.auto .sf-c-txt-lightseagreen\:5\:dark { color: hsl(177, 70%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10\:dark, html.auto .sf-c-txt-lightseagreen\:10\:dark { color: hsl(177, 70%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:15\:dark, html.auto .sf-c-txt-lightseagreen\:15\:dark { color: hsl(177, 70%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20\:dark, html.auto .sf-c-txt-lightseagreen\:20\:dark { color: hsl(177, 70%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:25\:dark, html.auto .sf-c-txt-lightseagreen\:25\:dark { color: hsl(177, 70%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30\:dark, html.auto .sf-c-txt-lightseagreen\:30\:dark { color: hsl(177, 70%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:35\:dark, html.auto .sf-c-txt-lightseagreen\:35\:dark { color: hsl(177, 70%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40\:dark, html.auto .sf-c-txt-lightseagreen\:40\:dark { color: hsl(177, 70%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:45\:dark, html.auto .sf-c-txt-lightseagreen\:45\:dark { color: hsl(177, 70%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50\:dark, html.auto .sf-c-txt-lightseagreen\:50\:dark { color: hsl(177, 70%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:55\:dark, html.auto .sf-c-txt-lightseagreen\:55\:dark { color: hsl(177, 70%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60\:dark, html.auto .sf-c-txt-lightseagreen\:60\:dark { color: hsl(177, 70%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:65\:dark, html.auto .sf-c-txt-lightseagreen\:65\:dark { color: hsl(177, 70%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70\:dark, html.auto .sf-c-txt-lightseagreen\:70\:dark { color: hsl(177, 70%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:75\:dark, html.auto .sf-c-txt-lightseagreen\:75\:dark { color: hsl(177, 70%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80\:dark, html.auto .sf-c-txt-lightseagreen\:80\:dark { color: hsl(177, 70%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:85\:dark, html.auto .sf-c-txt-lightseagreen\:85\:dark { color: hsl(177, 70%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90\:dark, html.auto .sf-c-txt-lightseagreen\:90\:dark { color: hsl(177, 70%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:95\:dark, html.auto .sf-c-txt-lightseagreen\:95\:dark { color: hsl(177, 70%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100\:dark, html.auto .sf-c-txt-lightseagreen\:100\:dark { color: hsl(177, 70%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:dark, html.var.auto .sf-c-txt-lightseagreen\:dark { color: hsl(177, 70%, 41%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:0\:dark, html.var.auto .sf-c-txt-lightseagreen\:0\:dark { color: hsl(177, 70%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:5\:dark, html.var.auto .sf-c-txt-lightseagreen\:5\:dark { color: hsl(177, 70%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:10\:dark, html.var.auto .sf-c-txt-lightseagreen\:10\:dark { color: hsl(177, 70%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:15\:dark, html.var.auto .sf-c-txt-lightseagreen\:15\:dark { color: hsl(177, 70%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:20\:dark, html.var.auto .sf-c-txt-lightseagreen\:20\:dark { color: hsl(177, 70%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:25\:dark, html.var.auto .sf-c-txt-lightseagreen\:25\:dark { color: hsl(177, 70%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:30\:dark, html.var.auto .sf-c-txt-lightseagreen\:30\:dark { color: hsl(177, 70%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:35\:dark, html.var.auto .sf-c-txt-lightseagreen\:35\:dark { color: hsl(177, 70%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:40\:dark, html.var.auto .sf-c-txt-lightseagreen\:40\:dark { color: hsl(177, 70%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:45\:dark, html.var.auto .sf-c-txt-lightseagreen\:45\:dark { color: hsl(177, 70%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:50\:dark, html.var.auto .sf-c-txt-lightseagreen\:50\:dark { color: hsl(177, 70%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:55\:dark, html.var.auto .sf-c-txt-lightseagreen\:55\:dark { color: hsl(177, 70%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:60\:dark, html.var.auto .sf-c-txt-lightseagreen\:60\:dark { color: hsl(177, 70%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:65\:dark, html.var.auto .sf-c-txt-lightseagreen\:65\:dark { color: hsl(177, 70%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:70\:dark, html.var.auto .sf-c-txt-lightseagreen\:70\:dark { color: hsl(177, 70%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:75\:dark, html.var.auto .sf-c-txt-lightseagreen\:75\:dark { color: hsl(177, 70%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:80\:dark, html.var.auto .sf-c-txt-lightseagreen\:80\:dark { color: hsl(177, 70%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:85\:dark, html.var.auto .sf-c-txt-lightseagreen\:85\:dark { color: hsl(177, 70%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:90\:dark, html.var.auto .sf-c-txt-lightseagreen\:90\:dark { color: hsl(177, 70%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:95\:dark, html.var.auto .sf-c-txt-lightseagreen\:95\:dark { color: hsl(177, 70%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightseagreen\:100\:dark, html.var.auto .sf-c-txt-lightseagreen\:100\:dark { color: hsl(177, 70%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightskyblue.css b/src/colors/20/lightskyblue.css index c886525..820791e 100644 --- a/src/colors/20/lightskyblue.css +++ b/src/colors/20/lightskyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightskyblue'] { --sf-c-lightskyblue: 203 92% 75%; --sf-c-lightskyblue-0: 203 92% 0%; --sf-c-lightskyblue-5: 203 92% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightskyblue\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-lightskyblue\:95\:dark, html.var.auto .sf-c-lightskyblue\:95\:dark { color: hsl(203, 92%, 95%); background: hsl(203, 92%, 5%) } html.var[data-theme='auto'] .sf-c-lightskyblue\:100\:dark, html.var.auto .sf-c-lightskyblue\:100\:dark { color: hsl(203, 92%, 95%); background: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue, html.auto .sf-c-txt-lightskyblue { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0, html.auto .sf-c-txt-lightskyblue\:0 { color: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:5, html.auto .sf-c-txt-lightskyblue\:5 { color: hsl(203, 92%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10, html.auto .sf-c-txt-lightskyblue\:10 { color: hsl(203, 92%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:15, html.auto .sf-c-txt-lightskyblue\:15 { color: hsl(203, 92%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20, html.auto .sf-c-txt-lightskyblue\:20 { color: hsl(203, 92%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:25, html.auto .sf-c-txt-lightskyblue\:25 { color: hsl(203, 92%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30, html.auto .sf-c-txt-lightskyblue\:30 { color: hsl(203, 92%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:35, html.auto .sf-c-txt-lightskyblue\:35 { color: hsl(203, 92%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40, html.auto .sf-c-txt-lightskyblue\:40 { color: hsl(203, 92%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:45, html.auto .sf-c-txt-lightskyblue\:45 { color: hsl(203, 92%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50, html.auto .sf-c-txt-lightskyblue\:50 { color: hsl(203, 92%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:55, html.auto .sf-c-txt-lightskyblue\:55 { color: hsl(203, 92%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60, html.auto .sf-c-txt-lightskyblue\:60 { color: hsl(203, 92%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:65, html.auto .sf-c-txt-lightskyblue\:65 { color: hsl(203, 92%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70, html.auto .sf-c-txt-lightskyblue\:70 { color: hsl(203, 92%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:75, html.auto .sf-c-txt-lightskyblue\:75 { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80, html.auto .sf-c-txt-lightskyblue\:80 { color: hsl(203, 92%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:85, html.auto .sf-c-txt-lightskyblue\:85 { color: hsl(203, 92%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90, html.auto .sf-c-txt-lightskyblue\:90 { color: hsl(203, 92%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:95, html.auto .sf-c-txt-lightskyblue\:95 { color: hsl(203, 92%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100, html.auto .sf-c-txt-lightskyblue\:100 { color: hsl(203, 92%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue, html.var.auto .sf-c-txt-lightskyblue { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0, html.var.auto .sf-c-txt-lightskyblue\:0 { color: hsl(203, 92%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:5, html.var.auto .sf-c-txt-lightskyblue\:5 { color: hsl(203, 92%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10, html.var.auto .sf-c-txt-lightskyblue\:10 { color: hsl(203, 92%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:15, html.var.auto .sf-c-txt-lightskyblue\:15 { color: hsl(203, 92%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20, html.var.auto .sf-c-txt-lightskyblue\:20 { color: hsl(203, 92%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:25, html.var.auto .sf-c-txt-lightskyblue\:25 { color: hsl(203, 92%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30, html.var.auto .sf-c-txt-lightskyblue\:30 { color: hsl(203, 92%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:35, html.var.auto .sf-c-txt-lightskyblue\:35 { color: hsl(203, 92%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40, html.var.auto .sf-c-txt-lightskyblue\:40 { color: hsl(203, 92%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:45, html.var.auto .sf-c-txt-lightskyblue\:45 { color: hsl(203, 92%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50, html.var.auto .sf-c-txt-lightskyblue\:50 { color: hsl(203, 92%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:55, html.var.auto .sf-c-txt-lightskyblue\:55 { color: hsl(203, 92%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60, html.var.auto .sf-c-txt-lightskyblue\:60 { color: hsl(203, 92%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:65, html.var.auto .sf-c-txt-lightskyblue\:65 { color: hsl(203, 92%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70, html.var.auto .sf-c-txt-lightskyblue\:70 { color: hsl(203, 92%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:75, html.var.auto .sf-c-txt-lightskyblue\:75 { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80, html.var.auto .sf-c-txt-lightskyblue\:80 { color: hsl(203, 92%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:85, html.var.auto .sf-c-txt-lightskyblue\:85 { color: hsl(203, 92%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90, html.var.auto .sf-c-txt-lightskyblue\:90 { color: hsl(203, 92%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:95, html.var.auto .sf-c-txt-lightskyblue\:95 { color: hsl(203, 92%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100, html.var.auto .sf-c-txt-lightskyblue\:100 { color: hsl(203, 92%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:dark, html.auto .sf-c-txt-lightskyblue\:dark { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0\:dark, html.auto .sf-c-txt-lightskyblue\:0\:dark { color: hsl(203, 92%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:5\:dark, html.auto .sf-c-txt-lightskyblue\:5\:dark { color: hsl(203, 92%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10\:dark, html.auto .sf-c-txt-lightskyblue\:10\:dark { color: hsl(203, 92%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:15\:dark, html.auto .sf-c-txt-lightskyblue\:15\:dark { color: hsl(203, 92%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20\:dark, html.auto .sf-c-txt-lightskyblue\:20\:dark { color: hsl(203, 92%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:25\:dark, html.auto .sf-c-txt-lightskyblue\:25\:dark { color: hsl(203, 92%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30\:dark, html.auto .sf-c-txt-lightskyblue\:30\:dark { color: hsl(203, 92%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:35\:dark, html.auto .sf-c-txt-lightskyblue\:35\:dark { color: hsl(203, 92%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40\:dark, html.auto .sf-c-txt-lightskyblue\:40\:dark { color: hsl(203, 92%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:45\:dark, html.auto .sf-c-txt-lightskyblue\:45\:dark { color: hsl(203, 92%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50\:dark, html.auto .sf-c-txt-lightskyblue\:50\:dark { color: hsl(203, 92%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:55\:dark, html.auto .sf-c-txt-lightskyblue\:55\:dark { color: hsl(203, 92%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60\:dark, html.auto .sf-c-txt-lightskyblue\:60\:dark { color: hsl(203, 92%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:65\:dark, html.auto .sf-c-txt-lightskyblue\:65\:dark { color: hsl(203, 92%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70\:dark, html.auto .sf-c-txt-lightskyblue\:70\:dark { color: hsl(203, 92%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:75\:dark, html.auto .sf-c-txt-lightskyblue\:75\:dark { color: hsl(203, 92%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80\:dark, html.auto .sf-c-txt-lightskyblue\:80\:dark { color: hsl(203, 92%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:85\:dark, html.auto .sf-c-txt-lightskyblue\:85\:dark { color: hsl(203, 92%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90\:dark, html.auto .sf-c-txt-lightskyblue\:90\:dark { color: hsl(203, 92%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:95\:dark, html.auto .sf-c-txt-lightskyblue\:95\:dark { color: hsl(203, 92%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100\:dark, html.auto .sf-c-txt-lightskyblue\:100\:dark { color: hsl(203, 92%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:dark, html.var.auto .sf-c-txt-lightskyblue\:dark { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:0\:dark, html.var.auto .sf-c-txt-lightskyblue\:0\:dark { color: hsl(203, 92%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:5\:dark, html.var.auto .sf-c-txt-lightskyblue\:5\:dark { color: hsl(203, 92%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:10\:dark, html.var.auto .sf-c-txt-lightskyblue\:10\:dark { color: hsl(203, 92%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:15\:dark, html.var.auto .sf-c-txt-lightskyblue\:15\:dark { color: hsl(203, 92%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:20\:dark, html.var.auto .sf-c-txt-lightskyblue\:20\:dark { color: hsl(203, 92%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:25\:dark, html.var.auto .sf-c-txt-lightskyblue\:25\:dark { color: hsl(203, 92%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:30\:dark, html.var.auto .sf-c-txt-lightskyblue\:30\:dark { color: hsl(203, 92%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:35\:dark, html.var.auto .sf-c-txt-lightskyblue\:35\:dark { color: hsl(203, 92%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:40\:dark, html.var.auto .sf-c-txt-lightskyblue\:40\:dark { color: hsl(203, 92%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:45\:dark, html.var.auto .sf-c-txt-lightskyblue\:45\:dark { color: hsl(203, 92%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:50\:dark, html.var.auto .sf-c-txt-lightskyblue\:50\:dark { color: hsl(203, 92%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:55\:dark, html.var.auto .sf-c-txt-lightskyblue\:55\:dark { color: hsl(203, 92%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:60\:dark, html.var.auto .sf-c-txt-lightskyblue\:60\:dark { color: hsl(203, 92%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:65\:dark, html.var.auto .sf-c-txt-lightskyblue\:65\:dark { color: hsl(203, 92%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:70\:dark, html.var.auto .sf-c-txt-lightskyblue\:70\:dark { color: hsl(203, 92%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:75\:dark, html.var.auto .sf-c-txt-lightskyblue\:75\:dark { color: hsl(203, 92%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:80\:dark, html.var.auto .sf-c-txt-lightskyblue\:80\:dark { color: hsl(203, 92%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:85\:dark, html.var.auto .sf-c-txt-lightskyblue\:85\:dark { color: hsl(203, 92%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:90\:dark, html.var.auto .sf-c-txt-lightskyblue\:90\:dark { color: hsl(203, 92%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:95\:dark, html.var.auto .sf-c-txt-lightskyblue\:95\:dark { color: hsl(203, 92%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightskyblue\:100\:dark, html.var.auto .sf-c-txt-lightskyblue\:100\:dark { color: hsl(203, 92%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightslategray.css b/src/colors/20/lightslategray.css index 9e6681b..bea1d15 100644 --- a/src/colors/20/lightslategray.css +++ b/src/colors/20/lightslategray.css @@ -1,4 +1,4 @@ -:root { +[class*='lightslategray'] { --sf-c-lightslategray: 210 14% 53%; --sf-c-lightslategray-0: 210 14% 0%; --sf-c-lightslategray-5: 210 14% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightslategray\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightslategray\:95\:dark, html.var.auto .sf-c-lightslategray\:95\:dark { color: hsl(210, 14%, 95%); background: hsl(210, 14%, 5%) } html.var[data-theme='auto'] .sf-c-lightslategray\:100\:dark, html.var.auto .sf-c-lightslategray\:100\:dark { color: hsl(210, 14%, 95%); background: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray, html.auto .sf-c-txt-lightslategray { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0, html.auto .sf-c-txt-lightslategray\:0 { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:5, html.auto .sf-c-txt-lightslategray\:5 { color: hsl(210, 14%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10, html.auto .sf-c-txt-lightslategray\:10 { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:15, html.auto .sf-c-txt-lightslategray\:15 { color: hsl(210, 14%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20, html.auto .sf-c-txt-lightslategray\:20 { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:25, html.auto .sf-c-txt-lightslategray\:25 { color: hsl(210, 14%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30, html.auto .sf-c-txt-lightslategray\:30 { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:35, html.auto .sf-c-txt-lightslategray\:35 { color: hsl(210, 14%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40, html.auto .sf-c-txt-lightslategray\:40 { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:45, html.auto .sf-c-txt-lightslategray\:45 { color: hsl(210, 14%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50, html.auto .sf-c-txt-lightslategray\:50 { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:55, html.auto .sf-c-txt-lightslategray\:55 { color: hsl(210, 14%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60, html.auto .sf-c-txt-lightslategray\:60 { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:65, html.auto .sf-c-txt-lightslategray\:65 { color: hsl(210, 14%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70, html.auto .sf-c-txt-lightslategray\:70 { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:75, html.auto .sf-c-txt-lightslategray\:75 { color: hsl(210, 14%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80, html.auto .sf-c-txt-lightslategray\:80 { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:85, html.auto .sf-c-txt-lightslategray\:85 { color: hsl(210, 14%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90, html.auto .sf-c-txt-lightslategray\:90 { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:95, html.auto .sf-c-txt-lightslategray\:95 { color: hsl(210, 14%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100, html.auto .sf-c-txt-lightslategray\:100 { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray, html.var.auto .sf-c-txt-lightslategray { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0, html.var.auto .sf-c-txt-lightslategray\:0 { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:5, html.var.auto .sf-c-txt-lightslategray\:5 { color: hsl(210, 14%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10, html.var.auto .sf-c-txt-lightslategray\:10 { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:15, html.var.auto .sf-c-txt-lightslategray\:15 { color: hsl(210, 14%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20, html.var.auto .sf-c-txt-lightslategray\:20 { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:25, html.var.auto .sf-c-txt-lightslategray\:25 { color: hsl(210, 14%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30, html.var.auto .sf-c-txt-lightslategray\:30 { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:35, html.var.auto .sf-c-txt-lightslategray\:35 { color: hsl(210, 14%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40, html.var.auto .sf-c-txt-lightslategray\:40 { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:45, html.var.auto .sf-c-txt-lightslategray\:45 { color: hsl(210, 14%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50, html.var.auto .sf-c-txt-lightslategray\:50 { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:55, html.var.auto .sf-c-txt-lightslategray\:55 { color: hsl(210, 14%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60, html.var.auto .sf-c-txt-lightslategray\:60 { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:65, html.var.auto .sf-c-txt-lightslategray\:65 { color: hsl(210, 14%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70, html.var.auto .sf-c-txt-lightslategray\:70 { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:75, html.var.auto .sf-c-txt-lightslategray\:75 { color: hsl(210, 14%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80, html.var.auto .sf-c-txt-lightslategray\:80 { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:85, html.var.auto .sf-c-txt-lightslategray\:85 { color: hsl(210, 14%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90, html.var.auto .sf-c-txt-lightslategray\:90 { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:95, html.var.auto .sf-c-txt-lightslategray\:95 { color: hsl(210, 14%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100, html.var.auto .sf-c-txt-lightslategray\:100 { color: hsl(210, 14%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:dark, html.auto .sf-c-txt-lightslategray\:dark { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0\:dark, html.auto .sf-c-txt-lightslategray\:0\:dark { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:5\:dark, html.auto .sf-c-txt-lightslategray\:5\:dark { color: hsl(210, 14%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10\:dark, html.auto .sf-c-txt-lightslategray\:10\:dark { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:15\:dark, html.auto .sf-c-txt-lightslategray\:15\:dark { color: hsl(210, 14%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20\:dark, html.auto .sf-c-txt-lightslategray\:20\:dark { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:25\:dark, html.auto .sf-c-txt-lightslategray\:25\:dark { color: hsl(210, 14%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30\:dark, html.auto .sf-c-txt-lightslategray\:30\:dark { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:35\:dark, html.auto .sf-c-txt-lightslategray\:35\:dark { color: hsl(210, 14%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40\:dark, html.auto .sf-c-txt-lightslategray\:40\:dark { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:45\:dark, html.auto .sf-c-txt-lightslategray\:45\:dark { color: hsl(210, 14%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50\:dark, html.auto .sf-c-txt-lightslategray\:50\:dark { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:55\:dark, html.auto .sf-c-txt-lightslategray\:55\:dark { color: hsl(210, 14%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60\:dark, html.auto .sf-c-txt-lightslategray\:60\:dark { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:65\:dark, html.auto .sf-c-txt-lightslategray\:65\:dark { color: hsl(210, 14%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70\:dark, html.auto .sf-c-txt-lightslategray\:70\:dark { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:75\:dark, html.auto .sf-c-txt-lightslategray\:75\:dark { color: hsl(210, 14%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80\:dark, html.auto .sf-c-txt-lightslategray\:80\:dark { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:85\:dark, html.auto .sf-c-txt-lightslategray\:85\:dark { color: hsl(210, 14%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90\:dark, html.auto .sf-c-txt-lightslategray\:90\:dark { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:95\:dark, html.auto .sf-c-txt-lightslategray\:95\:dark { color: hsl(210, 14%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100\:dark, html.auto .sf-c-txt-lightslategray\:100\:dark { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:dark, html.var.auto .sf-c-txt-lightslategray\:dark { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:0\:dark, html.var.auto .sf-c-txt-lightslategray\:0\:dark { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:5\:dark, html.var.auto .sf-c-txt-lightslategray\:5\:dark { color: hsl(210, 14%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:10\:dark, html.var.auto .sf-c-txt-lightslategray\:10\:dark { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:15\:dark, html.var.auto .sf-c-txt-lightslategray\:15\:dark { color: hsl(210, 14%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:20\:dark, html.var.auto .sf-c-txt-lightslategray\:20\:dark { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:25\:dark, html.var.auto .sf-c-txt-lightslategray\:25\:dark { color: hsl(210, 14%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:30\:dark, html.var.auto .sf-c-txt-lightslategray\:30\:dark { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:35\:dark, html.var.auto .sf-c-txt-lightslategray\:35\:dark { color: hsl(210, 14%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:40\:dark, html.var.auto .sf-c-txt-lightslategray\:40\:dark { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:45\:dark, html.var.auto .sf-c-txt-lightslategray\:45\:dark { color: hsl(210, 14%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:50\:dark, html.var.auto .sf-c-txt-lightslategray\:50\:dark { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:55\:dark, html.var.auto .sf-c-txt-lightslategray\:55\:dark { color: hsl(210, 14%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:60\:dark, html.var.auto .sf-c-txt-lightslategray\:60\:dark { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:65\:dark, html.var.auto .sf-c-txt-lightslategray\:65\:dark { color: hsl(210, 14%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:70\:dark, html.var.auto .sf-c-txt-lightslategray\:70\:dark { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:75\:dark, html.var.auto .sf-c-txt-lightslategray\:75\:dark { color: hsl(210, 14%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:80\:dark, html.var.auto .sf-c-txt-lightslategray\:80\:dark { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:85\:dark, html.var.auto .sf-c-txt-lightslategray\:85\:dark { color: hsl(210, 14%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:90\:dark, html.var.auto .sf-c-txt-lightslategray\:90\:dark { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:95\:dark, html.var.auto .sf-c-txt-lightslategray\:95\:dark { color: hsl(210, 14%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategray\:100\:dark, html.var.auto .sf-c-txt-lightslategray\:100\:dark { color: hsl(210, 14%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightslategrey.css b/src/colors/20/lightslategrey.css index 30abebf..84d0d89 100644 --- a/src/colors/20/lightslategrey.css +++ b/src/colors/20/lightslategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='lightslategrey'] { --sf-c-lightslategrey: 210 14% 53%; --sf-c-lightslategrey-0: 210 14% 0%; --sf-c-lightslategrey-5: 210 14% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightslategrey\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightslategrey\:95\:dark, html.var.auto .sf-c-lightslategrey\:95\:dark { color: hsl(210, 14%, 95%); background: hsl(210, 14%, 5%) } html.var[data-theme='auto'] .sf-c-lightslategrey\:100\:dark, html.var.auto .sf-c-lightslategrey\:100\:dark { color: hsl(210, 14%, 95%); background: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey, html.auto .sf-c-txt-lightslategrey { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0, html.auto .sf-c-txt-lightslategrey\:0 { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:5, html.auto .sf-c-txt-lightslategrey\:5 { color: hsl(210, 14%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10, html.auto .sf-c-txt-lightslategrey\:10 { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:15, html.auto .sf-c-txt-lightslategrey\:15 { color: hsl(210, 14%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20, html.auto .sf-c-txt-lightslategrey\:20 { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:25, html.auto .sf-c-txt-lightslategrey\:25 { color: hsl(210, 14%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30, html.auto .sf-c-txt-lightslategrey\:30 { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:35, html.auto .sf-c-txt-lightslategrey\:35 { color: hsl(210, 14%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40, html.auto .sf-c-txt-lightslategrey\:40 { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:45, html.auto .sf-c-txt-lightslategrey\:45 { color: hsl(210, 14%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50, html.auto .sf-c-txt-lightslategrey\:50 { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:55, html.auto .sf-c-txt-lightslategrey\:55 { color: hsl(210, 14%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60, html.auto .sf-c-txt-lightslategrey\:60 { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:65, html.auto .sf-c-txt-lightslategrey\:65 { color: hsl(210, 14%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70, html.auto .sf-c-txt-lightslategrey\:70 { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:75, html.auto .sf-c-txt-lightslategrey\:75 { color: hsl(210, 14%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80, html.auto .sf-c-txt-lightslategrey\:80 { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:85, html.auto .sf-c-txt-lightslategrey\:85 { color: hsl(210, 14%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90, html.auto .sf-c-txt-lightslategrey\:90 { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:95, html.auto .sf-c-txt-lightslategrey\:95 { color: hsl(210, 14%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100, html.auto .sf-c-txt-lightslategrey\:100 { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey, html.var.auto .sf-c-txt-lightslategrey { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0, html.var.auto .sf-c-txt-lightslategrey\:0 { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:5, html.var.auto .sf-c-txt-lightslategrey\:5 { color: hsl(210, 14%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10, html.var.auto .sf-c-txt-lightslategrey\:10 { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:15, html.var.auto .sf-c-txt-lightslategrey\:15 { color: hsl(210, 14%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20, html.var.auto .sf-c-txt-lightslategrey\:20 { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:25, html.var.auto .sf-c-txt-lightslategrey\:25 { color: hsl(210, 14%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30, html.var.auto .sf-c-txt-lightslategrey\:30 { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:35, html.var.auto .sf-c-txt-lightslategrey\:35 { color: hsl(210, 14%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40, html.var.auto .sf-c-txt-lightslategrey\:40 { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:45, html.var.auto .sf-c-txt-lightslategrey\:45 { color: hsl(210, 14%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50, html.var.auto .sf-c-txt-lightslategrey\:50 { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:55, html.var.auto .sf-c-txt-lightslategrey\:55 { color: hsl(210, 14%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60, html.var.auto .sf-c-txt-lightslategrey\:60 { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:65, html.var.auto .sf-c-txt-lightslategrey\:65 { color: hsl(210, 14%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70, html.var.auto .sf-c-txt-lightslategrey\:70 { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:75, html.var.auto .sf-c-txt-lightslategrey\:75 { color: hsl(210, 14%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80, html.var.auto .sf-c-txt-lightslategrey\:80 { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:85, html.var.auto .sf-c-txt-lightslategrey\:85 { color: hsl(210, 14%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90, html.var.auto .sf-c-txt-lightslategrey\:90 { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:95, html.var.auto .sf-c-txt-lightslategrey\:95 { color: hsl(210, 14%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100, html.var.auto .sf-c-txt-lightslategrey\:100 { color: hsl(210, 14%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:dark, html.auto .sf-c-txt-lightslategrey\:dark { color: hsl(210, 14%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0\:dark, html.auto .sf-c-txt-lightslategrey\:0\:dark { color: hsl(210, 14%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:5\:dark, html.auto .sf-c-txt-lightslategrey\:5\:dark { color: hsl(210, 14%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10\:dark, html.auto .sf-c-txt-lightslategrey\:10\:dark { color: hsl(210, 14%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:15\:dark, html.auto .sf-c-txt-lightslategrey\:15\:dark { color: hsl(210, 14%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20\:dark, html.auto .sf-c-txt-lightslategrey\:20\:dark { color: hsl(210, 14%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:25\:dark, html.auto .sf-c-txt-lightslategrey\:25\:dark { color: hsl(210, 14%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30\:dark, html.auto .sf-c-txt-lightslategrey\:30\:dark { color: hsl(210, 14%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:35\:dark, html.auto .sf-c-txt-lightslategrey\:35\:dark { color: hsl(210, 14%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40\:dark, html.auto .sf-c-txt-lightslategrey\:40\:dark { color: hsl(210, 14%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:45\:dark, html.auto .sf-c-txt-lightslategrey\:45\:dark { color: hsl(210, 14%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50\:dark, html.auto .sf-c-txt-lightslategrey\:50\:dark { color: hsl(210, 14%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:55\:dark, html.auto .sf-c-txt-lightslategrey\:55\:dark { color: hsl(210, 14%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60\:dark, html.auto .sf-c-txt-lightslategrey\:60\:dark { color: hsl(210, 14%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:65\:dark, html.auto .sf-c-txt-lightslategrey\:65\:dark { color: hsl(210, 14%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70\:dark, html.auto .sf-c-txt-lightslategrey\:70\:dark { color: hsl(210, 14%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:75\:dark, html.auto .sf-c-txt-lightslategrey\:75\:dark { color: hsl(210, 14%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80\:dark, html.auto .sf-c-txt-lightslategrey\:80\:dark { color: hsl(210, 14%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:85\:dark, html.auto .sf-c-txt-lightslategrey\:85\:dark { color: hsl(210, 14%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90\:dark, html.auto .sf-c-txt-lightslategrey\:90\:dark { color: hsl(210, 14%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:95\:dark, html.auto .sf-c-txt-lightslategrey\:95\:dark { color: hsl(210, 14%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100\:dark, html.auto .sf-c-txt-lightslategrey\:100\:dark { color: hsl(210, 14%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:dark, html.var.auto .sf-c-txt-lightslategrey\:dark { color: hsl(210, 14%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:0\:dark, html.var.auto .sf-c-txt-lightslategrey\:0\:dark { color: hsl(210, 14%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:5\:dark, html.var.auto .sf-c-txt-lightslategrey\:5\:dark { color: hsl(210, 14%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:10\:dark, html.var.auto .sf-c-txt-lightslategrey\:10\:dark { color: hsl(210, 14%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:15\:dark, html.var.auto .sf-c-txt-lightslategrey\:15\:dark { color: hsl(210, 14%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:20\:dark, html.var.auto .sf-c-txt-lightslategrey\:20\:dark { color: hsl(210, 14%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:25\:dark, html.var.auto .sf-c-txt-lightslategrey\:25\:dark { color: hsl(210, 14%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:30\:dark, html.var.auto .sf-c-txt-lightslategrey\:30\:dark { color: hsl(210, 14%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:35\:dark, html.var.auto .sf-c-txt-lightslategrey\:35\:dark { color: hsl(210, 14%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:40\:dark, html.var.auto .sf-c-txt-lightslategrey\:40\:dark { color: hsl(210, 14%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:45\:dark, html.var.auto .sf-c-txt-lightslategrey\:45\:dark { color: hsl(210, 14%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:50\:dark, html.var.auto .sf-c-txt-lightslategrey\:50\:dark { color: hsl(210, 14%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:55\:dark, html.var.auto .sf-c-txt-lightslategrey\:55\:dark { color: hsl(210, 14%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:60\:dark, html.var.auto .sf-c-txt-lightslategrey\:60\:dark { color: hsl(210, 14%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:65\:dark, html.var.auto .sf-c-txt-lightslategrey\:65\:dark { color: hsl(210, 14%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:70\:dark, html.var.auto .sf-c-txt-lightslategrey\:70\:dark { color: hsl(210, 14%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:75\:dark, html.var.auto .sf-c-txt-lightslategrey\:75\:dark { color: hsl(210, 14%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:80\:dark, html.var.auto .sf-c-txt-lightslategrey\:80\:dark { color: hsl(210, 14%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:85\:dark, html.var.auto .sf-c-txt-lightslategrey\:85\:dark { color: hsl(210, 14%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:90\:dark, html.var.auto .sf-c-txt-lightslategrey\:90\:dark { color: hsl(210, 14%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:95\:dark, html.var.auto .sf-c-txt-lightslategrey\:95\:dark { color: hsl(210, 14%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightslategrey\:100\:dark, html.var.auto .sf-c-txt-lightslategrey\:100\:dark { color: hsl(210, 14%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightsteelblue.css b/src/colors/20/lightsteelblue.css index 62cf213..e64ada9 100644 --- a/src/colors/20/lightsteelblue.css +++ b/src/colors/20/lightsteelblue.css @@ -1,4 +1,4 @@ -:root { +[class*='lightsteelblue'] { --sf-c-lightsteelblue: 214 41% 78%; --sf-c-lightsteelblue-0: 214 41% 0%; --sf-c-lightsteelblue-5: 214 41% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightsteelblue\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-lightsteelblue\:95\:dark, html.var.auto .sf-c-lightsteelblue\:95\:dark { color: hsl(214, 41%, 95%); background: hsl(214, 41%, 5%) } html.var[data-theme='auto'] .sf-c-lightsteelblue\:100\:dark, html.var.auto .sf-c-lightsteelblue\:100\:dark { color: hsl(214, 41%, 95%); background: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue, html.auto .sf-c-txt-lightsteelblue { color: hsl(214, 41%, 78%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0, html.auto .sf-c-txt-lightsteelblue\:0 { color: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:5, html.auto .sf-c-txt-lightsteelblue\:5 { color: hsl(214, 41%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10, html.auto .sf-c-txt-lightsteelblue\:10 { color: hsl(214, 41%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:15, html.auto .sf-c-txt-lightsteelblue\:15 { color: hsl(214, 41%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20, html.auto .sf-c-txt-lightsteelblue\:20 { color: hsl(214, 41%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:25, html.auto .sf-c-txt-lightsteelblue\:25 { color: hsl(214, 41%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30, html.auto .sf-c-txt-lightsteelblue\:30 { color: hsl(214, 41%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:35, html.auto .sf-c-txt-lightsteelblue\:35 { color: hsl(214, 41%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40, html.auto .sf-c-txt-lightsteelblue\:40 { color: hsl(214, 41%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:45, html.auto .sf-c-txt-lightsteelblue\:45 { color: hsl(214, 41%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50, html.auto .sf-c-txt-lightsteelblue\:50 { color: hsl(214, 41%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:55, html.auto .sf-c-txt-lightsteelblue\:55 { color: hsl(214, 41%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60, html.auto .sf-c-txt-lightsteelblue\:60 { color: hsl(214, 41%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:65, html.auto .sf-c-txt-lightsteelblue\:65 { color: hsl(214, 41%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70, html.auto .sf-c-txt-lightsteelblue\:70 { color: hsl(214, 41%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:75, html.auto .sf-c-txt-lightsteelblue\:75 { color: hsl(214, 41%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80, html.auto .sf-c-txt-lightsteelblue\:80 { color: hsl(214, 41%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:85, html.auto .sf-c-txt-lightsteelblue\:85 { color: hsl(214, 41%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90, html.auto .sf-c-txt-lightsteelblue\:90 { color: hsl(214, 41%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:95, html.auto .sf-c-txt-lightsteelblue\:95 { color: hsl(214, 41%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100, html.auto .sf-c-txt-lightsteelblue\:100 { color: hsl(214, 41%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue, html.var.auto .sf-c-txt-lightsteelblue { color: hsl(214, 41%, 78%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0, html.var.auto .sf-c-txt-lightsteelblue\:0 { color: hsl(214, 41%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:5, html.var.auto .sf-c-txt-lightsteelblue\:5 { color: hsl(214, 41%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10, html.var.auto .sf-c-txt-lightsteelblue\:10 { color: hsl(214, 41%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:15, html.var.auto .sf-c-txt-lightsteelblue\:15 { color: hsl(214, 41%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20, html.var.auto .sf-c-txt-lightsteelblue\:20 { color: hsl(214, 41%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:25, html.var.auto .sf-c-txt-lightsteelblue\:25 { color: hsl(214, 41%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30, html.var.auto .sf-c-txt-lightsteelblue\:30 { color: hsl(214, 41%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:35, html.var.auto .sf-c-txt-lightsteelblue\:35 { color: hsl(214, 41%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40, html.var.auto .sf-c-txt-lightsteelblue\:40 { color: hsl(214, 41%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:45, html.var.auto .sf-c-txt-lightsteelblue\:45 { color: hsl(214, 41%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50, html.var.auto .sf-c-txt-lightsteelblue\:50 { color: hsl(214, 41%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:55, html.var.auto .sf-c-txt-lightsteelblue\:55 { color: hsl(214, 41%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60, html.var.auto .sf-c-txt-lightsteelblue\:60 { color: hsl(214, 41%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:65, html.var.auto .sf-c-txt-lightsteelblue\:65 { color: hsl(214, 41%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70, html.var.auto .sf-c-txt-lightsteelblue\:70 { color: hsl(214, 41%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:75, html.var.auto .sf-c-txt-lightsteelblue\:75 { color: hsl(214, 41%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80, html.var.auto .sf-c-txt-lightsteelblue\:80 { color: hsl(214, 41%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:85, html.var.auto .sf-c-txt-lightsteelblue\:85 { color: hsl(214, 41%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90, html.var.auto .sf-c-txt-lightsteelblue\:90 { color: hsl(214, 41%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:95, html.var.auto .sf-c-txt-lightsteelblue\:95 { color: hsl(214, 41%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100, html.var.auto .sf-c-txt-lightsteelblue\:100 { color: hsl(214, 41%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:dark, html.auto .sf-c-txt-lightsteelblue\:dark { color: hsl(214, 41%, 78%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0\:dark, html.auto .sf-c-txt-lightsteelblue\:0\:dark { color: hsl(214, 41%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:5\:dark, html.auto .sf-c-txt-lightsteelblue\:5\:dark { color: hsl(214, 41%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10\:dark, html.auto .sf-c-txt-lightsteelblue\:10\:dark { color: hsl(214, 41%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:15\:dark, html.auto .sf-c-txt-lightsteelblue\:15\:dark { color: hsl(214, 41%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20\:dark, html.auto .sf-c-txt-lightsteelblue\:20\:dark { color: hsl(214, 41%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:25\:dark, html.auto .sf-c-txt-lightsteelblue\:25\:dark { color: hsl(214, 41%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30\:dark, html.auto .sf-c-txt-lightsteelblue\:30\:dark { color: hsl(214, 41%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:35\:dark, html.auto .sf-c-txt-lightsteelblue\:35\:dark { color: hsl(214, 41%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40\:dark, html.auto .sf-c-txt-lightsteelblue\:40\:dark { color: hsl(214, 41%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:45\:dark, html.auto .sf-c-txt-lightsteelblue\:45\:dark { color: hsl(214, 41%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50\:dark, html.auto .sf-c-txt-lightsteelblue\:50\:dark { color: hsl(214, 41%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:55\:dark, html.auto .sf-c-txt-lightsteelblue\:55\:dark { color: hsl(214, 41%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60\:dark, html.auto .sf-c-txt-lightsteelblue\:60\:dark { color: hsl(214, 41%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:65\:dark, html.auto .sf-c-txt-lightsteelblue\:65\:dark { color: hsl(214, 41%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70\:dark, html.auto .sf-c-txt-lightsteelblue\:70\:dark { color: hsl(214, 41%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:75\:dark, html.auto .sf-c-txt-lightsteelblue\:75\:dark { color: hsl(214, 41%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80\:dark, html.auto .sf-c-txt-lightsteelblue\:80\:dark { color: hsl(214, 41%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:85\:dark, html.auto .sf-c-txt-lightsteelblue\:85\:dark { color: hsl(214, 41%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90\:dark, html.auto .sf-c-txt-lightsteelblue\:90\:dark { color: hsl(214, 41%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:95\:dark, html.auto .sf-c-txt-lightsteelblue\:95\:dark { color: hsl(214, 41%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100\:dark, html.auto .sf-c-txt-lightsteelblue\:100\:dark { color: hsl(214, 41%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:dark, html.var.auto .sf-c-txt-lightsteelblue\:dark { color: hsl(214, 41%, 78%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:0\:dark, html.var.auto .sf-c-txt-lightsteelblue\:0\:dark { color: hsl(214, 41%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:5\:dark, html.var.auto .sf-c-txt-lightsteelblue\:5\:dark { color: hsl(214, 41%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:10\:dark, html.var.auto .sf-c-txt-lightsteelblue\:10\:dark { color: hsl(214, 41%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:15\:dark, html.var.auto .sf-c-txt-lightsteelblue\:15\:dark { color: hsl(214, 41%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:20\:dark, html.var.auto .sf-c-txt-lightsteelblue\:20\:dark { color: hsl(214, 41%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:25\:dark, html.var.auto .sf-c-txt-lightsteelblue\:25\:dark { color: hsl(214, 41%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:30\:dark, html.var.auto .sf-c-txt-lightsteelblue\:30\:dark { color: hsl(214, 41%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:35\:dark, html.var.auto .sf-c-txt-lightsteelblue\:35\:dark { color: hsl(214, 41%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:40\:dark, html.var.auto .sf-c-txt-lightsteelblue\:40\:dark { color: hsl(214, 41%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:45\:dark, html.var.auto .sf-c-txt-lightsteelblue\:45\:dark { color: hsl(214, 41%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:50\:dark, html.var.auto .sf-c-txt-lightsteelblue\:50\:dark { color: hsl(214, 41%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:55\:dark, html.var.auto .sf-c-txt-lightsteelblue\:55\:dark { color: hsl(214, 41%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:60\:dark, html.var.auto .sf-c-txt-lightsteelblue\:60\:dark { color: hsl(214, 41%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:65\:dark, html.var.auto .sf-c-txt-lightsteelblue\:65\:dark { color: hsl(214, 41%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:70\:dark, html.var.auto .sf-c-txt-lightsteelblue\:70\:dark { color: hsl(214, 41%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:75\:dark, html.var.auto .sf-c-txt-lightsteelblue\:75\:dark { color: hsl(214, 41%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:80\:dark, html.var.auto .sf-c-txt-lightsteelblue\:80\:dark { color: hsl(214, 41%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:85\:dark, html.var.auto .sf-c-txt-lightsteelblue\:85\:dark { color: hsl(214, 41%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:90\:dark, html.var.auto .sf-c-txt-lightsteelblue\:90\:dark { color: hsl(214, 41%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:95\:dark, html.var.auto .sf-c-txt-lightsteelblue\:95\:dark { color: hsl(214, 41%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightsteelblue\:100\:dark, html.var.auto .sf-c-txt-lightsteelblue\:100\:dark { color: hsl(214, 41%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lightyellow.css b/src/colors/20/lightyellow.css index 6909b53..b2bb7dc 100644 --- a/src/colors/20/lightyellow.css +++ b/src/colors/20/lightyellow.css @@ -1,4 +1,4 @@ -:root { +[class*='lightyellow'] { --sf-c-lightyellow: 60 100% 94%; --sf-c-lightyellow-0: 60 100% 0%; --sf-c-lightyellow-5: 60 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lightyellow\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-lightyellow\:95\:dark, html.var.auto .sf-c-lightyellow\:95\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lightyellow\:100\:dark, html.var.auto .sf-c-lightyellow\:100\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow, html.auto .sf-c-txt-lightyellow { color: hsl(60, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0, html.auto .sf-c-txt-lightyellow\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:5, html.auto .sf-c-txt-lightyellow\:5 { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10, html.auto .sf-c-txt-lightyellow\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:15, html.auto .sf-c-txt-lightyellow\:15 { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20, html.auto .sf-c-txt-lightyellow\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:25, html.auto .sf-c-txt-lightyellow\:25 { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30, html.auto .sf-c-txt-lightyellow\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:35, html.auto .sf-c-txt-lightyellow\:35 { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40, html.auto .sf-c-txt-lightyellow\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:45, html.auto .sf-c-txt-lightyellow\:45 { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50, html.auto .sf-c-txt-lightyellow\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:55, html.auto .sf-c-txt-lightyellow\:55 { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60, html.auto .sf-c-txt-lightyellow\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:65, html.auto .sf-c-txt-lightyellow\:65 { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70, html.auto .sf-c-txt-lightyellow\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:75, html.auto .sf-c-txt-lightyellow\:75 { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80, html.auto .sf-c-txt-lightyellow\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:85, html.auto .sf-c-txt-lightyellow\:85 { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90, html.auto .sf-c-txt-lightyellow\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:95, html.auto .sf-c-txt-lightyellow\:95 { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100, html.auto .sf-c-txt-lightyellow\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow, html.var.auto .sf-c-txt-lightyellow { color: hsl(60, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0, html.var.auto .sf-c-txt-lightyellow\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:5, html.var.auto .sf-c-txt-lightyellow\:5 { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10, html.var.auto .sf-c-txt-lightyellow\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:15, html.var.auto .sf-c-txt-lightyellow\:15 { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20, html.var.auto .sf-c-txt-lightyellow\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:25, html.var.auto .sf-c-txt-lightyellow\:25 { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30, html.var.auto .sf-c-txt-lightyellow\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:35, html.var.auto .sf-c-txt-lightyellow\:35 { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40, html.var.auto .sf-c-txt-lightyellow\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:45, html.var.auto .sf-c-txt-lightyellow\:45 { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50, html.var.auto .sf-c-txt-lightyellow\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:55, html.var.auto .sf-c-txt-lightyellow\:55 { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60, html.var.auto .sf-c-txt-lightyellow\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:65, html.var.auto .sf-c-txt-lightyellow\:65 { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70, html.var.auto .sf-c-txt-lightyellow\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:75, html.var.auto .sf-c-txt-lightyellow\:75 { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80, html.var.auto .sf-c-txt-lightyellow\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:85, html.var.auto .sf-c-txt-lightyellow\:85 { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90, html.var.auto .sf-c-txt-lightyellow\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:95, html.var.auto .sf-c-txt-lightyellow\:95 { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100, html.var.auto .sf-c-txt-lightyellow\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:dark, html.auto .sf-c-txt-lightyellow\:dark { color: hsl(60, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0\:dark, html.auto .sf-c-txt-lightyellow\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:5\:dark, html.auto .sf-c-txt-lightyellow\:5\:dark { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10\:dark, html.auto .sf-c-txt-lightyellow\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:15\:dark, html.auto .sf-c-txt-lightyellow\:15\:dark { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20\:dark, html.auto .sf-c-txt-lightyellow\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:25\:dark, html.auto .sf-c-txt-lightyellow\:25\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30\:dark, html.auto .sf-c-txt-lightyellow\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:35\:dark, html.auto .sf-c-txt-lightyellow\:35\:dark { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40\:dark, html.auto .sf-c-txt-lightyellow\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:45\:dark, html.auto .sf-c-txt-lightyellow\:45\:dark { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50\:dark, html.auto .sf-c-txt-lightyellow\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:55\:dark, html.auto .sf-c-txt-lightyellow\:55\:dark { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60\:dark, html.auto .sf-c-txt-lightyellow\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:65\:dark, html.auto .sf-c-txt-lightyellow\:65\:dark { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70\:dark, html.auto .sf-c-txt-lightyellow\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:75\:dark, html.auto .sf-c-txt-lightyellow\:75\:dark { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80\:dark, html.auto .sf-c-txt-lightyellow\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:85\:dark, html.auto .sf-c-txt-lightyellow\:85\:dark { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90\:dark, html.auto .sf-c-txt-lightyellow\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:95\:dark, html.auto .sf-c-txt-lightyellow\:95\:dark { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100\:dark, html.auto .sf-c-txt-lightyellow\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:dark, html.var.auto .sf-c-txt-lightyellow\:dark { color: hsl(60, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:0\:dark, html.var.auto .sf-c-txt-lightyellow\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:5\:dark, html.var.auto .sf-c-txt-lightyellow\:5\:dark { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:10\:dark, html.var.auto .sf-c-txt-lightyellow\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:15\:dark, html.var.auto .sf-c-txt-lightyellow\:15\:dark { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:20\:dark, html.var.auto .sf-c-txt-lightyellow\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:25\:dark, html.var.auto .sf-c-txt-lightyellow\:25\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:30\:dark, html.var.auto .sf-c-txt-lightyellow\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:35\:dark, html.var.auto .sf-c-txt-lightyellow\:35\:dark { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:40\:dark, html.var.auto .sf-c-txt-lightyellow\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:45\:dark, html.var.auto .sf-c-txt-lightyellow\:45\:dark { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:50\:dark, html.var.auto .sf-c-txt-lightyellow\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:55\:dark, html.var.auto .sf-c-txt-lightyellow\:55\:dark { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:60\:dark, html.var.auto .sf-c-txt-lightyellow\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:65\:dark, html.var.auto .sf-c-txt-lightyellow\:65\:dark { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:70\:dark, html.var.auto .sf-c-txt-lightyellow\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:75\:dark, html.var.auto .sf-c-txt-lightyellow\:75\:dark { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:80\:dark, html.var.auto .sf-c-txt-lightyellow\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:85\:dark, html.var.auto .sf-c-txt-lightyellow\:85\:dark { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:90\:dark, html.var.auto .sf-c-txt-lightyellow\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:95\:dark, html.var.auto .sf-c-txt-lightyellow\:95\:dark { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lightyellow\:100\:dark, html.var.auto .sf-c-txt-lightyellow\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/lime.css b/src/colors/20/lime.css index 80cef80..e658bf2 100644 --- a/src/colors/20/lime.css +++ b/src/colors/20/lime.css @@ -1,4 +1,4 @@ -:root { +[class*='lime'] { --sf-c-lime: 120 100% 50%; --sf-c-lime-0: 120 100% 0%; --sf-c-lime-5: 120 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-lime\:100\:dark, html.dark .sf-c-txt-lime\ html.var[data-theme='auto'] .sf-c-lime\:95\:dark, html.var.auto .sf-c-lime\:95\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 5%) } html.var[data-theme='auto'] .sf-c-lime\:100\:dark, html.var.auto .sf-c-lime\:100\:dark { color: hsl(120, 100%, 95%); background: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime, html.auto .sf-c-txt-lime { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:0, html.auto .sf-c-txt-lime\:0 { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:5, html.auto .sf-c-txt-lime\:5 { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:10, html.auto .sf-c-txt-lime\:10 { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:15, html.auto .sf-c-txt-lime\:15 { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:20, html.auto .sf-c-txt-lime\:20 { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:25, html.auto .sf-c-txt-lime\:25 { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:30, html.auto .sf-c-txt-lime\:30 { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:35, html.auto .sf-c-txt-lime\:35 { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:40, html.auto .sf-c-txt-lime\:40 { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:45, html.auto .sf-c-txt-lime\:45 { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:50, html.auto .sf-c-txt-lime\:50 { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:55, html.auto .sf-c-txt-lime\:55 { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:60, html.auto .sf-c-txt-lime\:60 { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:65, html.auto .sf-c-txt-lime\:65 { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:70, html.auto .sf-c-txt-lime\:70 { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:75, html.auto .sf-c-txt-lime\:75 { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:80, html.auto .sf-c-txt-lime\:80 { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:85, html.auto .sf-c-txt-lime\:85 { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:90, html.auto .sf-c-txt-lime\:90 { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:95, html.auto .sf-c-txt-lime\:95 { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:100, html.auto .sf-c-txt-lime\:100 { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lime, html.var.auto .sf-c-txt-lime { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:0, html.var.auto .sf-c-txt-lime\:0 { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:5, html.var.auto .sf-c-txt-lime\:5 { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:10, html.var.auto .sf-c-txt-lime\:10 { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:15, html.var.auto .sf-c-txt-lime\:15 { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:20, html.var.auto .sf-c-txt-lime\:20 { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:25, html.var.auto .sf-c-txt-lime\:25 { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:30, html.var.auto .sf-c-txt-lime\:30 { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:35, html.var.auto .sf-c-txt-lime\:35 { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:40, html.var.auto .sf-c-txt-lime\:40 { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:45, html.var.auto .sf-c-txt-lime\:45 { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:50, html.var.auto .sf-c-txt-lime\:50 { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:55, html.var.auto .sf-c-txt-lime\:55 { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:60, html.var.auto .sf-c-txt-lime\:60 { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:65, html.var.auto .sf-c-txt-lime\:65 { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:70, html.var.auto .sf-c-txt-lime\:70 { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:75, html.var.auto .sf-c-txt-lime\:75 { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:80, html.var.auto .sf-c-txt-lime\:80 { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:85, html.var.auto .sf-c-txt-lime\:85 { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:90, html.var.auto .sf-c-txt-lime\:90 { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:95, html.var.auto .sf-c-txt-lime\:95 { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:100, html.var.auto .sf-c-txt-lime\:100 { color: hsl(120, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:dark, html.auto .sf-c-txt-lime\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark, html.auto .sf-c-txt-lime\:0\:dark { color: hsl(120, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:5\:dark, html.auto .sf-c-txt-lime\:5\:dark { color: hsl(120, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark, html.auto .sf-c-txt-lime\:10\:dark { color: hsl(120, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:15\:dark, html.auto .sf-c-txt-lime\:15\:dark { color: hsl(120, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark, html.auto .sf-c-txt-lime\:20\:dark { color: hsl(120, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:25\:dark, html.auto .sf-c-txt-lime\:25\:dark { color: hsl(120, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark, html.auto .sf-c-txt-lime\:30\:dark { color: hsl(120, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:35\:dark, html.auto .sf-c-txt-lime\:35\:dark { color: hsl(120, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark, html.auto .sf-c-txt-lime\:40\:dark { color: hsl(120, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:45\:dark, html.auto .sf-c-txt-lime\:45\:dark { color: hsl(120, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark, html.auto .sf-c-txt-lime\:50\:dark { color: hsl(120, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:55\:dark, html.auto .sf-c-txt-lime\:55\:dark { color: hsl(120, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark, html.auto .sf-c-txt-lime\:60\:dark { color: hsl(120, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:65\:dark, html.auto .sf-c-txt-lime\:65\:dark { color: hsl(120, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark, html.auto .sf-c-txt-lime\:70\:dark { color: hsl(120, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:75\:dark, html.auto .sf-c-txt-lime\:75\:dark { color: hsl(120, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark, html.auto .sf-c-txt-lime\:80\:dark { color: hsl(120, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:85\:dark, html.auto .sf-c-txt-lime\:85\:dark { color: hsl(120, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark, html.auto .sf-c-txt-lime\:90\:dark { color: hsl(120, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:95\:dark, html.auto .sf-c-txt-lime\:95\:dark { color: hsl(120, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark, html.auto .sf-c-txt-lime\:100\:dark { color: hsl(120, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:dark, html.var.auto .sf-c-txt-lime\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark, html.var.auto .sf-c-txt-lime\:0\:dark { color: hsl(120, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:5\:dark, html.var.auto .sf-c-txt-lime\:5\:dark { color: hsl(120, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark, html.var.auto .sf-c-txt-lime\:10\:dark { color: hsl(120, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:15\:dark, html.var.auto .sf-c-txt-lime\:15\:dark { color: hsl(120, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark, html.var.auto .sf-c-txt-lime\:20\:dark { color: hsl(120, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:25\:dark, html.var.auto .sf-c-txt-lime\:25\:dark { color: hsl(120, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark, html.var.auto .sf-c-txt-lime\:30\:dark { color: hsl(120, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:35\:dark, html.var.auto .sf-c-txt-lime\:35\:dark { color: hsl(120, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark, html.var.auto .sf-c-txt-lime\:40\:dark { color: hsl(120, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:45\:dark, html.var.auto .sf-c-txt-lime\:45\:dark { color: hsl(120, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark, html.var.auto .sf-c-txt-lime\:50\:dark { color: hsl(120, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:55\:dark, html.var.auto .sf-c-txt-lime\:55\:dark { color: hsl(120, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark, html.var.auto .sf-c-txt-lime\:60\:dark { color: hsl(120, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:65\:dark, html.var.auto .sf-c-txt-lime\:65\:dark { color: hsl(120, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark, html.var.auto .sf-c-txt-lime\:70\:dark { color: hsl(120, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:75\:dark, html.var.auto .sf-c-txt-lime\:75\:dark { color: hsl(120, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark, html.var.auto .sf-c-txt-lime\:80\:dark { color: hsl(120, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:85\:dark, html.var.auto .sf-c-txt-lime\:85\:dark { color: hsl(120, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark, html.var.auto .sf-c-txt-lime\:90\:dark { color: hsl(120, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:95\:dark, html.var.auto .sf-c-txt-lime\:95\:dark { color: hsl(120, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark, html.var.auto .sf-c-txt-lime\:100\:dark { color: hsl(120, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/limegreen.css b/src/colors/20/limegreen.css index 390c19e..148fe1c 100644 --- a/src/colors/20/limegreen.css +++ b/src/colors/20/limegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='limegreen'] { --sf-c-limegreen: 120 61% 50%; --sf-c-limegreen-0: 120 61% 0%; --sf-c-limegreen-5: 120 61% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-limegreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-limegreen\:95\:dark, html.var.auto .sf-c-limegreen\:95\:dark { color: hsl(120, 61%, 95%); background: hsl(120, 61%, 5%) } html.var[data-theme='auto'] .sf-c-limegreen\:100\:dark, html.var.auto .sf-c-limegreen\:100\:dark { color: hsl(120, 61%, 95%); background: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen, html.auto .sf-c-txt-limegreen { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:0, html.auto .sf-c-txt-limegreen\:0 { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:5, html.auto .sf-c-txt-limegreen\:5 { color: hsl(120, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:10, html.auto .sf-c-txt-limegreen\:10 { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:15, html.auto .sf-c-txt-limegreen\:15 { color: hsl(120, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:20, html.auto .sf-c-txt-limegreen\:20 { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:25, html.auto .sf-c-txt-limegreen\:25 { color: hsl(120, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:30, html.auto .sf-c-txt-limegreen\:30 { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:35, html.auto .sf-c-txt-limegreen\:35 { color: hsl(120, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:40, html.auto .sf-c-txt-limegreen\:40 { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:45, html.auto .sf-c-txt-limegreen\:45 { color: hsl(120, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:50, html.auto .sf-c-txt-limegreen\:50 { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:55, html.auto .sf-c-txt-limegreen\:55 { color: hsl(120, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:60, html.auto .sf-c-txt-limegreen\:60 { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:65, html.auto .sf-c-txt-limegreen\:65 { color: hsl(120, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:70, html.auto .sf-c-txt-limegreen\:70 { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:75, html.auto .sf-c-txt-limegreen\:75 { color: hsl(120, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:80, html.auto .sf-c-txt-limegreen\:80 { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:85, html.auto .sf-c-txt-limegreen\:85 { color: hsl(120, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:90, html.auto .sf-c-txt-limegreen\:90 { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:95, html.auto .sf-c-txt-limegreen\:95 { color: hsl(120, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:100, html.auto .sf-c-txt-limegreen\:100 { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen, html.var.auto .sf-c-txt-limegreen { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:0, html.var.auto .sf-c-txt-limegreen\:0 { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:5, html.var.auto .sf-c-txt-limegreen\:5 { color: hsl(120, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:10, html.var.auto .sf-c-txt-limegreen\:10 { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:15, html.var.auto .sf-c-txt-limegreen\:15 { color: hsl(120, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:20, html.var.auto .sf-c-txt-limegreen\:20 { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:25, html.var.auto .sf-c-txt-limegreen\:25 { color: hsl(120, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:30, html.var.auto .sf-c-txt-limegreen\:30 { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:35, html.var.auto .sf-c-txt-limegreen\:35 { color: hsl(120, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:40, html.var.auto .sf-c-txt-limegreen\:40 { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:45, html.var.auto .sf-c-txt-limegreen\:45 { color: hsl(120, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:50, html.var.auto .sf-c-txt-limegreen\:50 { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:55, html.var.auto .sf-c-txt-limegreen\:55 { color: hsl(120, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:60, html.var.auto .sf-c-txt-limegreen\:60 { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:65, html.var.auto .sf-c-txt-limegreen\:65 { color: hsl(120, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:70, html.var.auto .sf-c-txt-limegreen\:70 { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:75, html.var.auto .sf-c-txt-limegreen\:75 { color: hsl(120, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:80, html.var.auto .sf-c-txt-limegreen\:80 { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:85, html.var.auto .sf-c-txt-limegreen\:85 { color: hsl(120, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:90, html.var.auto .sf-c-txt-limegreen\:90 { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:95, html.var.auto .sf-c-txt-limegreen\:95 { color: hsl(120, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:100, html.var.auto .sf-c-txt-limegreen\:100 { color: hsl(120, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:dark, html.auto .sf-c-txt-limegreen\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:0\:dark, html.auto .sf-c-txt-limegreen\:0\:dark { color: hsl(120, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:5\:dark, html.auto .sf-c-txt-limegreen\:5\:dark { color: hsl(120, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:10\:dark, html.auto .sf-c-txt-limegreen\:10\:dark { color: hsl(120, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:15\:dark, html.auto .sf-c-txt-limegreen\:15\:dark { color: hsl(120, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:20\:dark, html.auto .sf-c-txt-limegreen\:20\:dark { color: hsl(120, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:25\:dark, html.auto .sf-c-txt-limegreen\:25\:dark { color: hsl(120, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:30\:dark, html.auto .sf-c-txt-limegreen\:30\:dark { color: hsl(120, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:35\:dark, html.auto .sf-c-txt-limegreen\:35\:dark { color: hsl(120, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:40\:dark, html.auto .sf-c-txt-limegreen\:40\:dark { color: hsl(120, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:45\:dark, html.auto .sf-c-txt-limegreen\:45\:dark { color: hsl(120, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:50\:dark, html.auto .sf-c-txt-limegreen\:50\:dark { color: hsl(120, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:55\:dark, html.auto .sf-c-txt-limegreen\:55\:dark { color: hsl(120, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:60\:dark, html.auto .sf-c-txt-limegreen\:60\:dark { color: hsl(120, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:65\:dark, html.auto .sf-c-txt-limegreen\:65\:dark { color: hsl(120, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:70\:dark, html.auto .sf-c-txt-limegreen\:70\:dark { color: hsl(120, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:75\:dark, html.auto .sf-c-txt-limegreen\:75\:dark { color: hsl(120, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:80\:dark, html.auto .sf-c-txt-limegreen\:80\:dark { color: hsl(120, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:85\:dark, html.auto .sf-c-txt-limegreen\:85\:dark { color: hsl(120, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:90\:dark, html.auto .sf-c-txt-limegreen\:90\:dark { color: hsl(120, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:95\:dark, html.auto .sf-c-txt-limegreen\:95\:dark { color: hsl(120, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-limegreen\:100\:dark, html.auto .sf-c-txt-limegreen\:100\:dark { color: hsl(120, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:dark, html.var.auto .sf-c-txt-limegreen\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:0\:dark, html.var.auto .sf-c-txt-limegreen\:0\:dark { color: hsl(120, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:5\:dark, html.var.auto .sf-c-txt-limegreen\:5\:dark { color: hsl(120, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:10\:dark, html.var.auto .sf-c-txt-limegreen\:10\:dark { color: hsl(120, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:15\:dark, html.var.auto .sf-c-txt-limegreen\:15\:dark { color: hsl(120, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:20\:dark, html.var.auto .sf-c-txt-limegreen\:20\:dark { color: hsl(120, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:25\:dark, html.var.auto .sf-c-txt-limegreen\:25\:dark { color: hsl(120, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:30\:dark, html.var.auto .sf-c-txt-limegreen\:30\:dark { color: hsl(120, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:35\:dark, html.var.auto .sf-c-txt-limegreen\:35\:dark { color: hsl(120, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:40\:dark, html.var.auto .sf-c-txt-limegreen\:40\:dark { color: hsl(120, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:45\:dark, html.var.auto .sf-c-txt-limegreen\:45\:dark { color: hsl(120, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:50\:dark, html.var.auto .sf-c-txt-limegreen\:50\:dark { color: hsl(120, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:55\:dark, html.var.auto .sf-c-txt-limegreen\:55\:dark { color: hsl(120, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:60\:dark, html.var.auto .sf-c-txt-limegreen\:60\:dark { color: hsl(120, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:65\:dark, html.var.auto .sf-c-txt-limegreen\:65\:dark { color: hsl(120, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:70\:dark, html.var.auto .sf-c-txt-limegreen\:70\:dark { color: hsl(120, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:75\:dark, html.var.auto .sf-c-txt-limegreen\:75\:dark { color: hsl(120, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:80\:dark, html.var.auto .sf-c-txt-limegreen\:80\:dark { color: hsl(120, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:85\:dark, html.var.auto .sf-c-txt-limegreen\:85\:dark { color: hsl(120, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:90\:dark, html.var.auto .sf-c-txt-limegreen\:90\:dark { color: hsl(120, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:95\:dark, html.var.auto .sf-c-txt-limegreen\:95\:dark { color: hsl(120, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-limegreen\:100\:dark, html.var.auto .sf-c-txt-limegreen\:100\:dark { color: hsl(120, 61%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/linen.css b/src/colors/20/linen.css index cf7662a..ac3d501 100644 --- a/src/colors/20/linen.css +++ b/src/colors/20/linen.css @@ -1,4 +1,4 @@ -:root { +[class*='linen'] { --sf-c-linen: 30 67% 94%; --sf-c-linen-0: 30 67% 0%; --sf-c-linen-5: 30 67% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-linen\:100\:dark, html.dark .sf-c-txt-line html.var[data-theme='auto'] .sf-c-linen\:95\:dark, html.var.auto .sf-c-linen\:95\:dark { color: hsl(30, 67%, 95%); background: hsl(30, 67%, 5%) } html.var[data-theme='auto'] .sf-c-linen\:100\:dark, html.var.auto .sf-c-linen\:100\:dark { color: hsl(30, 67%, 95%); background: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen, html.auto .sf-c-txt-linen { color: hsl(30, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:0, html.auto .sf-c-txt-linen\:0 { color: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:5, html.auto .sf-c-txt-linen\:5 { color: hsl(30, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:10, html.auto .sf-c-txt-linen\:10 { color: hsl(30, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:15, html.auto .sf-c-txt-linen\:15 { color: hsl(30, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:20, html.auto .sf-c-txt-linen\:20 { color: hsl(30, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:25, html.auto .sf-c-txt-linen\:25 { color: hsl(30, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:30, html.auto .sf-c-txt-linen\:30 { color: hsl(30, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:35, html.auto .sf-c-txt-linen\:35 { color: hsl(30, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:40, html.auto .sf-c-txt-linen\:40 { color: hsl(30, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:45, html.auto .sf-c-txt-linen\:45 { color: hsl(30, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:50, html.auto .sf-c-txt-linen\:50 { color: hsl(30, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:55, html.auto .sf-c-txt-linen\:55 { color: hsl(30, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:60, html.auto .sf-c-txt-linen\:60 { color: hsl(30, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:65, html.auto .sf-c-txt-linen\:65 { color: hsl(30, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:70, html.auto .sf-c-txt-linen\:70 { color: hsl(30, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:75, html.auto .sf-c-txt-linen\:75 { color: hsl(30, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:80, html.auto .sf-c-txt-linen\:80 { color: hsl(30, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:85, html.auto .sf-c-txt-linen\:85 { color: hsl(30, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:90, html.auto .sf-c-txt-linen\:90 { color: hsl(30, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:95, html.auto .sf-c-txt-linen\:95 { color: hsl(30, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:100, html.auto .sf-c-txt-linen\:100 { color: hsl(30, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-linen, html.var.auto .sf-c-txt-linen { color: hsl(30, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:0, html.var.auto .sf-c-txt-linen\:0 { color: hsl(30, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:5, html.var.auto .sf-c-txt-linen\:5 { color: hsl(30, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:10, html.var.auto .sf-c-txt-linen\:10 { color: hsl(30, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:15, html.var.auto .sf-c-txt-linen\:15 { color: hsl(30, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:20, html.var.auto .sf-c-txt-linen\:20 { color: hsl(30, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:25, html.var.auto .sf-c-txt-linen\:25 { color: hsl(30, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:30, html.var.auto .sf-c-txt-linen\:30 { color: hsl(30, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:35, html.var.auto .sf-c-txt-linen\:35 { color: hsl(30, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:40, html.var.auto .sf-c-txt-linen\:40 { color: hsl(30, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:45, html.var.auto .sf-c-txt-linen\:45 { color: hsl(30, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:50, html.var.auto .sf-c-txt-linen\:50 { color: hsl(30, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:55, html.var.auto .sf-c-txt-linen\:55 { color: hsl(30, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:60, html.var.auto .sf-c-txt-linen\:60 { color: hsl(30, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:65, html.var.auto .sf-c-txt-linen\:65 { color: hsl(30, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:70, html.var.auto .sf-c-txt-linen\:70 { color: hsl(30, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:75, html.var.auto .sf-c-txt-linen\:75 { color: hsl(30, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:80, html.var.auto .sf-c-txt-linen\:80 { color: hsl(30, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:85, html.var.auto .sf-c-txt-linen\:85 { color: hsl(30, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:90, html.var.auto .sf-c-txt-linen\:90 { color: hsl(30, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:95, html.var.auto .sf-c-txt-linen\:95 { color: hsl(30, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:100, html.var.auto .sf-c-txt-linen\:100 { color: hsl(30, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:dark, html.auto .sf-c-txt-linen\:dark { color: hsl(30, 67%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:0\:dark, html.auto .sf-c-txt-linen\:0\:dark { color: hsl(30, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:5\:dark, html.auto .sf-c-txt-linen\:5\:dark { color: hsl(30, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:10\:dark, html.auto .sf-c-txt-linen\:10\:dark { color: hsl(30, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:15\:dark, html.auto .sf-c-txt-linen\:15\:dark { color: hsl(30, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:20\:dark, html.auto .sf-c-txt-linen\:20\:dark { color: hsl(30, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:25\:dark, html.auto .sf-c-txt-linen\:25\:dark { color: hsl(30, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:30\:dark, html.auto .sf-c-txt-linen\:30\:dark { color: hsl(30, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:35\:dark, html.auto .sf-c-txt-linen\:35\:dark { color: hsl(30, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:40\:dark, html.auto .sf-c-txt-linen\:40\:dark { color: hsl(30, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:45\:dark, html.auto .sf-c-txt-linen\:45\:dark { color: hsl(30, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:50\:dark, html.auto .sf-c-txt-linen\:50\:dark { color: hsl(30, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:55\:dark, html.auto .sf-c-txt-linen\:55\:dark { color: hsl(30, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:60\:dark, html.auto .sf-c-txt-linen\:60\:dark { color: hsl(30, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:65\:dark, html.auto .sf-c-txt-linen\:65\:dark { color: hsl(30, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:70\:dark, html.auto .sf-c-txt-linen\:70\:dark { color: hsl(30, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:75\:dark, html.auto .sf-c-txt-linen\:75\:dark { color: hsl(30, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:80\:dark, html.auto .sf-c-txt-linen\:80\:dark { color: hsl(30, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:85\:dark, html.auto .sf-c-txt-linen\:85\:dark { color: hsl(30, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:90\:dark, html.auto .sf-c-txt-linen\:90\:dark { color: hsl(30, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:95\:dark, html.auto .sf-c-txt-linen\:95\:dark { color: hsl(30, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-linen\:100\:dark, html.auto .sf-c-txt-linen\:100\:dark { color: hsl(30, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:dark, html.var.auto .sf-c-txt-linen\:dark { color: hsl(30, 67%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:0\:dark, html.var.auto .sf-c-txt-linen\:0\:dark { color: hsl(30, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:5\:dark, html.var.auto .sf-c-txt-linen\:5\:dark { color: hsl(30, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:10\:dark, html.var.auto .sf-c-txt-linen\:10\:dark { color: hsl(30, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:15\:dark, html.var.auto .sf-c-txt-linen\:15\:dark { color: hsl(30, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:20\:dark, html.var.auto .sf-c-txt-linen\:20\:dark { color: hsl(30, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:25\:dark, html.var.auto .sf-c-txt-linen\:25\:dark { color: hsl(30, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:30\:dark, html.var.auto .sf-c-txt-linen\:30\:dark { color: hsl(30, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:35\:dark, html.var.auto .sf-c-txt-linen\:35\:dark { color: hsl(30, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:40\:dark, html.var.auto .sf-c-txt-linen\:40\:dark { color: hsl(30, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:45\:dark, html.var.auto .sf-c-txt-linen\:45\:dark { color: hsl(30, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:50\:dark, html.var.auto .sf-c-txt-linen\:50\:dark { color: hsl(30, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:55\:dark, html.var.auto .sf-c-txt-linen\:55\:dark { color: hsl(30, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:60\:dark, html.var.auto .sf-c-txt-linen\:60\:dark { color: hsl(30, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:65\:dark, html.var.auto .sf-c-txt-linen\:65\:dark { color: hsl(30, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:70\:dark, html.var.auto .sf-c-txt-linen\:70\:dark { color: hsl(30, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:75\:dark, html.var.auto .sf-c-txt-linen\:75\:dark { color: hsl(30, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:80\:dark, html.var.auto .sf-c-txt-linen\:80\:dark { color: hsl(30, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:85\:dark, html.var.auto .sf-c-txt-linen\:85\:dark { color: hsl(30, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:90\:dark, html.var.auto .sf-c-txt-linen\:90\:dark { color: hsl(30, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:95\:dark, html.var.auto .sf-c-txt-linen\:95\:dark { color: hsl(30, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-linen\:100\:dark, html.var.auto .sf-c-txt-linen\:100\:dark { color: hsl(30, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/magenta.css b/src/colors/20/magenta.css index eef83d0..2de10fc 100644 --- a/src/colors/20/magenta.css +++ b/src/colors/20/magenta.css @@ -1,4 +1,4 @@ -:root { +[class*='magenta'] { --sf-c-magenta: 300 100% 50%; --sf-c-magenta-0: 300 100% 0%; --sf-c-magenta-5: 300 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-magenta\:100\:dark, html.dark .sf-c-txt-ma html.var[data-theme='auto'] .sf-c-magenta\:95\:dark, html.var.auto .sf-c-magenta\:95\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 5%) } html.var[data-theme='auto'] .sf-c-magenta\:100\:dark, html.var.auto .sf-c-magenta\:100\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta, html.auto .sf-c-txt-magenta { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:0, html.auto .sf-c-txt-magenta\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:5, html.auto .sf-c-txt-magenta\:5 { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:10, html.auto .sf-c-txt-magenta\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:15, html.auto .sf-c-txt-magenta\:15 { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:20, html.auto .sf-c-txt-magenta\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:25, html.auto .sf-c-txt-magenta\:25 { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:30, html.auto .sf-c-txt-magenta\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:35, html.auto .sf-c-txt-magenta\:35 { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:40, html.auto .sf-c-txt-magenta\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:45, html.auto .sf-c-txt-magenta\:45 { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:50, html.auto .sf-c-txt-magenta\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:55, html.auto .sf-c-txt-magenta\:55 { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:60, html.auto .sf-c-txt-magenta\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:65, html.auto .sf-c-txt-magenta\:65 { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:70, html.auto .sf-c-txt-magenta\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:75, html.auto .sf-c-txt-magenta\:75 { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:80, html.auto .sf-c-txt-magenta\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:85, html.auto .sf-c-txt-magenta\:85 { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:90, html.auto .sf-c-txt-magenta\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:95, html.auto .sf-c-txt-magenta\:95 { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:100, html.auto .sf-c-txt-magenta\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-magenta, html.var.auto .sf-c-txt-magenta { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:0, html.var.auto .sf-c-txt-magenta\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:5, html.var.auto .sf-c-txt-magenta\:5 { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:10, html.var.auto .sf-c-txt-magenta\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:15, html.var.auto .sf-c-txt-magenta\:15 { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:20, html.var.auto .sf-c-txt-magenta\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:25, html.var.auto .sf-c-txt-magenta\:25 { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:30, html.var.auto .sf-c-txt-magenta\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:35, html.var.auto .sf-c-txt-magenta\:35 { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:40, html.var.auto .sf-c-txt-magenta\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:45, html.var.auto .sf-c-txt-magenta\:45 { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:50, html.var.auto .sf-c-txt-magenta\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:55, html.var.auto .sf-c-txt-magenta\:55 { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:60, html.var.auto .sf-c-txt-magenta\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:65, html.var.auto .sf-c-txt-magenta\:65 { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:70, html.var.auto .sf-c-txt-magenta\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:75, html.var.auto .sf-c-txt-magenta\:75 { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:80, html.var.auto .sf-c-txt-magenta\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:85, html.var.auto .sf-c-txt-magenta\:85 { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:90, html.var.auto .sf-c-txt-magenta\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:95, html.var.auto .sf-c-txt-magenta\:95 { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:100, html.var.auto .sf-c-txt-magenta\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:dark, html.auto .sf-c-txt-magenta\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:0\:dark, html.auto .sf-c-txt-magenta\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:5\:dark, html.auto .sf-c-txt-magenta\:5\:dark { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:10\:dark, html.auto .sf-c-txt-magenta\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:15\:dark, html.auto .sf-c-txt-magenta\:15\:dark { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:20\:dark, html.auto .sf-c-txt-magenta\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:25\:dark, html.auto .sf-c-txt-magenta\:25\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:30\:dark, html.auto .sf-c-txt-magenta\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:35\:dark, html.auto .sf-c-txt-magenta\:35\:dark { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:40\:dark, html.auto .sf-c-txt-magenta\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:45\:dark, html.auto .sf-c-txt-magenta\:45\:dark { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:50\:dark, html.auto .sf-c-txt-magenta\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:55\:dark, html.auto .sf-c-txt-magenta\:55\:dark { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:60\:dark, html.auto .sf-c-txt-magenta\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:65\:dark, html.auto .sf-c-txt-magenta\:65\:dark { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:70\:dark, html.auto .sf-c-txt-magenta\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:75\:dark, html.auto .sf-c-txt-magenta\:75\:dark { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:80\:dark, html.auto .sf-c-txt-magenta\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:85\:dark, html.auto .sf-c-txt-magenta\:85\:dark { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:90\:dark, html.auto .sf-c-txt-magenta\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:95\:dark, html.auto .sf-c-txt-magenta\:95\:dark { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-magenta\:100\:dark, html.auto .sf-c-txt-magenta\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:dark, html.var.auto .sf-c-txt-magenta\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:0\:dark, html.var.auto .sf-c-txt-magenta\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:5\:dark, html.var.auto .sf-c-txt-magenta\:5\:dark { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:10\:dark, html.var.auto .sf-c-txt-magenta\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:15\:dark, html.var.auto .sf-c-txt-magenta\:15\:dark { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:20\:dark, html.var.auto .sf-c-txt-magenta\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:25\:dark, html.var.auto .sf-c-txt-magenta\:25\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:30\:dark, html.var.auto .sf-c-txt-magenta\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:35\:dark, html.var.auto .sf-c-txt-magenta\:35\:dark { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:40\:dark, html.var.auto .sf-c-txt-magenta\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:45\:dark, html.var.auto .sf-c-txt-magenta\:45\:dark { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:50\:dark, html.var.auto .sf-c-txt-magenta\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:55\:dark, html.var.auto .sf-c-txt-magenta\:55\:dark { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:60\:dark, html.var.auto .sf-c-txt-magenta\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:65\:dark, html.var.auto .sf-c-txt-magenta\:65\:dark { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:70\:dark, html.var.auto .sf-c-txt-magenta\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:75\:dark, html.var.auto .sf-c-txt-magenta\:75\:dark { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:80\:dark, html.var.auto .sf-c-txt-magenta\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:85\:dark, html.var.auto .sf-c-txt-magenta\:85\:dark { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:90\:dark, html.var.auto .sf-c-txt-magenta\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:95\:dark, html.var.auto .sf-c-txt-magenta\:95\:dark { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-magenta\:100\:dark, html.var.auto .sf-c-txt-magenta\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/maroon.css b/src/colors/20/maroon.css index 4569280..0e1bf3b 100644 --- a/src/colors/20/maroon.css +++ b/src/colors/20/maroon.css @@ -1,4 +1,4 @@ -:root { +[class*='maroon'] { --sf-c-maroon: 0 100% 25%; --sf-c-maroon-0: 0 100% 0%; --sf-c-maroon-5: 0 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-maroon\:100\:dark, html.dark .sf-c-txt-mar html.var[data-theme='auto'] .sf-c-maroon\:95\:dark, html.var.auto .sf-c-maroon\:95\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 5%) } html.var[data-theme='auto'] .sf-c-maroon\:100\:dark, html.var.auto .sf-c-maroon\:100\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon, html.auto .sf-c-txt-maroon { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:0, html.auto .sf-c-txt-maroon\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:5, html.auto .sf-c-txt-maroon\:5 { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:10, html.auto .sf-c-txt-maroon\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:15, html.auto .sf-c-txt-maroon\:15 { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:20, html.auto .sf-c-txt-maroon\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:25, html.auto .sf-c-txt-maroon\:25 { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:30, html.auto .sf-c-txt-maroon\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:35, html.auto .sf-c-txt-maroon\:35 { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:40, html.auto .sf-c-txt-maroon\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:45, html.auto .sf-c-txt-maroon\:45 { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:50, html.auto .sf-c-txt-maroon\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:55, html.auto .sf-c-txt-maroon\:55 { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:60, html.auto .sf-c-txt-maroon\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:65, html.auto .sf-c-txt-maroon\:65 { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:70, html.auto .sf-c-txt-maroon\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:75, html.auto .sf-c-txt-maroon\:75 { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:80, html.auto .sf-c-txt-maroon\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:85, html.auto .sf-c-txt-maroon\:85 { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:90, html.auto .sf-c-txt-maroon\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:95, html.auto .sf-c-txt-maroon\:95 { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:100, html.auto .sf-c-txt-maroon\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-maroon, html.var.auto .sf-c-txt-maroon { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:0, html.var.auto .sf-c-txt-maroon\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:5, html.var.auto .sf-c-txt-maroon\:5 { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:10, html.var.auto .sf-c-txt-maroon\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:15, html.var.auto .sf-c-txt-maroon\:15 { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:20, html.var.auto .sf-c-txt-maroon\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:25, html.var.auto .sf-c-txt-maroon\:25 { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:30, html.var.auto .sf-c-txt-maroon\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:35, html.var.auto .sf-c-txt-maroon\:35 { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:40, html.var.auto .sf-c-txt-maroon\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:45, html.var.auto .sf-c-txt-maroon\:45 { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:50, html.var.auto .sf-c-txt-maroon\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:55, html.var.auto .sf-c-txt-maroon\:55 { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:60, html.var.auto .sf-c-txt-maroon\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:65, html.var.auto .sf-c-txt-maroon\:65 { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:70, html.var.auto .sf-c-txt-maroon\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:75, html.var.auto .sf-c-txt-maroon\:75 { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:80, html.var.auto .sf-c-txt-maroon\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:85, html.var.auto .sf-c-txt-maroon\:85 { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:90, html.var.auto .sf-c-txt-maroon\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:95, html.var.auto .sf-c-txt-maroon\:95 { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:100, html.var.auto .sf-c-txt-maroon\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:dark, html.auto .sf-c-txt-maroon\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark, html.auto .sf-c-txt-maroon\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:5\:dark, html.auto .sf-c-txt-maroon\:5\:dark { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark, html.auto .sf-c-txt-maroon\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:15\:dark, html.auto .sf-c-txt-maroon\:15\:dark { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark, html.auto .sf-c-txt-maroon\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:25\:dark, html.auto .sf-c-txt-maroon\:25\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark, html.auto .sf-c-txt-maroon\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:35\:dark, html.auto .sf-c-txt-maroon\:35\:dark { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark, html.auto .sf-c-txt-maroon\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:45\:dark, html.auto .sf-c-txt-maroon\:45\:dark { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark, html.auto .sf-c-txt-maroon\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:55\:dark, html.auto .sf-c-txt-maroon\:55\:dark { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark, html.auto .sf-c-txt-maroon\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:65\:dark, html.auto .sf-c-txt-maroon\:65\:dark { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark, html.auto .sf-c-txt-maroon\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:75\:dark, html.auto .sf-c-txt-maroon\:75\:dark { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark, html.auto .sf-c-txt-maroon\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:85\:dark, html.auto .sf-c-txt-maroon\:85\:dark { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark, html.auto .sf-c-txt-maroon\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:95\:dark, html.auto .sf-c-txt-maroon\:95\:dark { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark, html.auto .sf-c-txt-maroon\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:dark, html.var.auto .sf-c-txt-maroon\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark, html.var.auto .sf-c-txt-maroon\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:5\:dark, html.var.auto .sf-c-txt-maroon\:5\:dark { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark, html.var.auto .sf-c-txt-maroon\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:15\:dark, html.var.auto .sf-c-txt-maroon\:15\:dark { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark, html.var.auto .sf-c-txt-maroon\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:25\:dark, html.var.auto .sf-c-txt-maroon\:25\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark, html.var.auto .sf-c-txt-maroon\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:35\:dark, html.var.auto .sf-c-txt-maroon\:35\:dark { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark, html.var.auto .sf-c-txt-maroon\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:45\:dark, html.var.auto .sf-c-txt-maroon\:45\:dark { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark, html.var.auto .sf-c-txt-maroon\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:55\:dark, html.var.auto .sf-c-txt-maroon\:55\:dark { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark, html.var.auto .sf-c-txt-maroon\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:65\:dark, html.var.auto .sf-c-txt-maroon\:65\:dark { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark, html.var.auto .sf-c-txt-maroon\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:75\:dark, html.var.auto .sf-c-txt-maroon\:75\:dark { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark, html.var.auto .sf-c-txt-maroon\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:85\:dark, html.var.auto .sf-c-txt-maroon\:85\:dark { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark, html.var.auto .sf-c-txt-maroon\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:95\:dark, html.var.auto .sf-c-txt-maroon\:95\:dark { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark, html.var.auto .sf-c-txt-maroon\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumaquamarine.css b/src/colors/20/mediumaquamarine.css index b8a3fc9..657b3fe 100644 --- a/src/colors/20/mediumaquamarine.css +++ b/src/colors/20/mediumaquamarine.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumaquamarine'] { --sf-c-mediumaquamarine: 160 51% 60%; --sf-c-mediumaquamarine-0: 160 51% 0%; --sf-c-mediumaquamarine-5: 160 51% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumaquamarine\:100\:dark, html.dark .sf html.var[data-theme='auto'] .sf-c-mediumaquamarine\:95\:dark, html.var.auto .sf-c-mediumaquamarine\:95\:dark { color: hsl(160, 51%, 95%); background: hsl(160, 51%, 5%) } html.var[data-theme='auto'] .sf-c-mediumaquamarine\:100\:dark, html.var.auto .sf-c-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 95%); background: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine, html.auto .sf-c-txt-mediumaquamarine { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0, html.auto .sf-c-txt-mediumaquamarine\:0 { color: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:5, html.auto .sf-c-txt-mediumaquamarine\:5 { color: hsl(160, 51%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10, html.auto .sf-c-txt-mediumaquamarine\:10 { color: hsl(160, 51%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:15, html.auto .sf-c-txt-mediumaquamarine\:15 { color: hsl(160, 51%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20, html.auto .sf-c-txt-mediumaquamarine\:20 { color: hsl(160, 51%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:25, html.auto .sf-c-txt-mediumaquamarine\:25 { color: hsl(160, 51%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30, html.auto .sf-c-txt-mediumaquamarine\:30 { color: hsl(160, 51%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:35, html.auto .sf-c-txt-mediumaquamarine\:35 { color: hsl(160, 51%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40, html.auto .sf-c-txt-mediumaquamarine\:40 { color: hsl(160, 51%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:45, html.auto .sf-c-txt-mediumaquamarine\:45 { color: hsl(160, 51%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50, html.auto .sf-c-txt-mediumaquamarine\:50 { color: hsl(160, 51%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:55, html.auto .sf-c-txt-mediumaquamarine\:55 { color: hsl(160, 51%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60, html.auto .sf-c-txt-mediumaquamarine\:60 { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:65, html.auto .sf-c-txt-mediumaquamarine\:65 { color: hsl(160, 51%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70, html.auto .sf-c-txt-mediumaquamarine\:70 { color: hsl(160, 51%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:75, html.auto .sf-c-txt-mediumaquamarine\:75 { color: hsl(160, 51%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80, html.auto .sf-c-txt-mediumaquamarine\:80 { color: hsl(160, 51%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:85, html.auto .sf-c-txt-mediumaquamarine\:85 { color: hsl(160, 51%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90, html.auto .sf-c-txt-mediumaquamarine\:90 { color: hsl(160, 51%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:95, html.auto .sf-c-txt-mediumaquamarine\:95 { color: hsl(160, 51%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100, html.auto .sf-c-txt-mediumaquamarine\:100 { color: hsl(160, 51%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine, html.var.auto .sf-c-txt-mediumaquamarine { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0, html.var.auto .sf-c-txt-mediumaquamarine\:0 { color: hsl(160, 51%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:5, html.var.auto .sf-c-txt-mediumaquamarine\:5 { color: hsl(160, 51%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10, html.var.auto .sf-c-txt-mediumaquamarine\:10 { color: hsl(160, 51%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:15, html.var.auto .sf-c-txt-mediumaquamarine\:15 { color: hsl(160, 51%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20, html.var.auto .sf-c-txt-mediumaquamarine\:20 { color: hsl(160, 51%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:25, html.var.auto .sf-c-txt-mediumaquamarine\:25 { color: hsl(160, 51%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30, html.var.auto .sf-c-txt-mediumaquamarine\:30 { color: hsl(160, 51%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:35, html.var.auto .sf-c-txt-mediumaquamarine\:35 { color: hsl(160, 51%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40, html.var.auto .sf-c-txt-mediumaquamarine\:40 { color: hsl(160, 51%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:45, html.var.auto .sf-c-txt-mediumaquamarine\:45 { color: hsl(160, 51%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50, html.var.auto .sf-c-txt-mediumaquamarine\:50 { color: hsl(160, 51%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:55, html.var.auto .sf-c-txt-mediumaquamarine\:55 { color: hsl(160, 51%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60, html.var.auto .sf-c-txt-mediumaquamarine\:60 { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:65, html.var.auto .sf-c-txt-mediumaquamarine\:65 { color: hsl(160, 51%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70, html.var.auto .sf-c-txt-mediumaquamarine\:70 { color: hsl(160, 51%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:75, html.var.auto .sf-c-txt-mediumaquamarine\:75 { color: hsl(160, 51%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80, html.var.auto .sf-c-txt-mediumaquamarine\:80 { color: hsl(160, 51%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:85, html.var.auto .sf-c-txt-mediumaquamarine\:85 { color: hsl(160, 51%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90, html.var.auto .sf-c-txt-mediumaquamarine\:90 { color: hsl(160, 51%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:95, html.var.auto .sf-c-txt-mediumaquamarine\:95 { color: hsl(160, 51%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100, html.var.auto .sf-c-txt-mediumaquamarine\:100 { color: hsl(160, 51%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:dark, html.auto .sf-c-txt-mediumaquamarine\:dark { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0\:dark, html.auto .sf-c-txt-mediumaquamarine\:0\:dark { color: hsl(160, 51%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:5\:dark, html.auto .sf-c-txt-mediumaquamarine\:5\:dark { color: hsl(160, 51%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10\:dark, html.auto .sf-c-txt-mediumaquamarine\:10\:dark { color: hsl(160, 51%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:15\:dark, html.auto .sf-c-txt-mediumaquamarine\:15\:dark { color: hsl(160, 51%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20\:dark, html.auto .sf-c-txt-mediumaquamarine\:20\:dark { color: hsl(160, 51%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:25\:dark, html.auto .sf-c-txt-mediumaquamarine\:25\:dark { color: hsl(160, 51%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30\:dark, html.auto .sf-c-txt-mediumaquamarine\:30\:dark { color: hsl(160, 51%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:35\:dark, html.auto .sf-c-txt-mediumaquamarine\:35\:dark { color: hsl(160, 51%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40\:dark, html.auto .sf-c-txt-mediumaquamarine\:40\:dark { color: hsl(160, 51%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:45\:dark, html.auto .sf-c-txt-mediumaquamarine\:45\:dark { color: hsl(160, 51%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50\:dark, html.auto .sf-c-txt-mediumaquamarine\:50\:dark { color: hsl(160, 51%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:55\:dark, html.auto .sf-c-txt-mediumaquamarine\:55\:dark { color: hsl(160, 51%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60\:dark, html.auto .sf-c-txt-mediumaquamarine\:60\:dark { color: hsl(160, 51%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:65\:dark, html.auto .sf-c-txt-mediumaquamarine\:65\:dark { color: hsl(160, 51%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70\:dark, html.auto .sf-c-txt-mediumaquamarine\:70\:dark { color: hsl(160, 51%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:75\:dark, html.auto .sf-c-txt-mediumaquamarine\:75\:dark { color: hsl(160, 51%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80\:dark, html.auto .sf-c-txt-mediumaquamarine\:80\:dark { color: hsl(160, 51%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:85\:dark, html.auto .sf-c-txt-mediumaquamarine\:85\:dark { color: hsl(160, 51%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90\:dark, html.auto .sf-c-txt-mediumaquamarine\:90\:dark { color: hsl(160, 51%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:95\:dark, html.auto .sf-c-txt-mediumaquamarine\:95\:dark { color: hsl(160, 51%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100\:dark, html.auto .sf-c-txt-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:dark { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:0\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:0\:dark { color: hsl(160, 51%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:5\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:5\:dark { color: hsl(160, 51%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:10\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:10\:dark { color: hsl(160, 51%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:15\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:15\:dark { color: hsl(160, 51%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:20\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:20\:dark { color: hsl(160, 51%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:25\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:25\:dark { color: hsl(160, 51%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:30\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:30\:dark { color: hsl(160, 51%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:35\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:35\:dark { color: hsl(160, 51%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:40\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:40\:dark { color: hsl(160, 51%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:45\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:45\:dark { color: hsl(160, 51%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:50\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:50\:dark { color: hsl(160, 51%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:55\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:55\:dark { color: hsl(160, 51%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:60\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:60\:dark { color: hsl(160, 51%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:65\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:65\:dark { color: hsl(160, 51%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:70\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:70\:dark { color: hsl(160, 51%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:75\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:75\:dark { color: hsl(160, 51%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:80\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:80\:dark { color: hsl(160, 51%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:85\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:85\:dark { color: hsl(160, 51%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:90\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:90\:dark { color: hsl(160, 51%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:95\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:95\:dark { color: hsl(160, 51%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumaquamarine\:100\:dark, html.var.auto .sf-c-txt-mediumaquamarine\:100\:dark { color: hsl(160, 51%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumblue.css b/src/colors/20/mediumblue.css index aadfb67..06dc15f 100644 --- a/src/colors/20/mediumblue.css +++ b/src/colors/20/mediumblue.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumblue'] { --sf-c-mediumblue: 240 100% 40%; --sf-c-mediumblue-0: 240 100% 0%; --sf-c-mediumblue-5: 240 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-mediumblue\:95\:dark, html.var.auto .sf-c-mediumblue\:95\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 5%) } html.var[data-theme='auto'] .sf-c-mediumblue\:100\:dark, html.var.auto .sf-c-mediumblue\:100\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue, html.auto .sf-c-txt-mediumblue { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0, html.auto .sf-c-txt-mediumblue\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:5, html.auto .sf-c-txt-mediumblue\:5 { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10, html.auto .sf-c-txt-mediumblue\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:15, html.auto .sf-c-txt-mediumblue\:15 { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20, html.auto .sf-c-txt-mediumblue\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:25, html.auto .sf-c-txt-mediumblue\:25 { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30, html.auto .sf-c-txt-mediumblue\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:35, html.auto .sf-c-txt-mediumblue\:35 { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40, html.auto .sf-c-txt-mediumblue\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:45, html.auto .sf-c-txt-mediumblue\:45 { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50, html.auto .sf-c-txt-mediumblue\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:55, html.auto .sf-c-txt-mediumblue\:55 { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60, html.auto .sf-c-txt-mediumblue\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:65, html.auto .sf-c-txt-mediumblue\:65 { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70, html.auto .sf-c-txt-mediumblue\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:75, html.auto .sf-c-txt-mediumblue\:75 { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80, html.auto .sf-c-txt-mediumblue\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:85, html.auto .sf-c-txt-mediumblue\:85 { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90, html.auto .sf-c-txt-mediumblue\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:95, html.auto .sf-c-txt-mediumblue\:95 { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100, html.auto .sf-c-txt-mediumblue\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue, html.var.auto .sf-c-txt-mediumblue { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0, html.var.auto .sf-c-txt-mediumblue\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:5, html.var.auto .sf-c-txt-mediumblue\:5 { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10, html.var.auto .sf-c-txt-mediumblue\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:15, html.var.auto .sf-c-txt-mediumblue\:15 { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20, html.var.auto .sf-c-txt-mediumblue\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:25, html.var.auto .sf-c-txt-mediumblue\:25 { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30, html.var.auto .sf-c-txt-mediumblue\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:35, html.var.auto .sf-c-txt-mediumblue\:35 { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40, html.var.auto .sf-c-txt-mediumblue\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:45, html.var.auto .sf-c-txt-mediumblue\:45 { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50, html.var.auto .sf-c-txt-mediumblue\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:55, html.var.auto .sf-c-txt-mediumblue\:55 { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60, html.var.auto .sf-c-txt-mediumblue\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:65, html.var.auto .sf-c-txt-mediumblue\:65 { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70, html.var.auto .sf-c-txt-mediumblue\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:75, html.var.auto .sf-c-txt-mediumblue\:75 { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80, html.var.auto .sf-c-txt-mediumblue\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:85, html.var.auto .sf-c-txt-mediumblue\:85 { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90, html.var.auto .sf-c-txt-mediumblue\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:95, html.var.auto .sf-c-txt-mediumblue\:95 { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100, html.var.auto .sf-c-txt-mediumblue\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:dark, html.auto .sf-c-txt-mediumblue\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0\:dark, html.auto .sf-c-txt-mediumblue\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:5\:dark, html.auto .sf-c-txt-mediumblue\:5\:dark { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10\:dark, html.auto .sf-c-txt-mediumblue\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:15\:dark, html.auto .sf-c-txt-mediumblue\:15\:dark { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20\:dark, html.auto .sf-c-txt-mediumblue\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:25\:dark, html.auto .sf-c-txt-mediumblue\:25\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30\:dark, html.auto .sf-c-txt-mediumblue\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:35\:dark, html.auto .sf-c-txt-mediumblue\:35\:dark { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40\:dark, html.auto .sf-c-txt-mediumblue\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:45\:dark, html.auto .sf-c-txt-mediumblue\:45\:dark { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50\:dark, html.auto .sf-c-txt-mediumblue\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:55\:dark, html.auto .sf-c-txt-mediumblue\:55\:dark { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60\:dark, html.auto .sf-c-txt-mediumblue\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:65\:dark, html.auto .sf-c-txt-mediumblue\:65\:dark { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70\:dark, html.auto .sf-c-txt-mediumblue\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:75\:dark, html.auto .sf-c-txt-mediumblue\:75\:dark { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80\:dark, html.auto .sf-c-txt-mediumblue\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:85\:dark, html.auto .sf-c-txt-mediumblue\:85\:dark { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90\:dark, html.auto .sf-c-txt-mediumblue\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:95\:dark, html.auto .sf-c-txt-mediumblue\:95\:dark { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100\:dark, html.auto .sf-c-txt-mediumblue\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:dark, html.var.auto .sf-c-txt-mediumblue\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:0\:dark, html.var.auto .sf-c-txt-mediumblue\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:5\:dark, html.var.auto .sf-c-txt-mediumblue\:5\:dark { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:10\:dark, html.var.auto .sf-c-txt-mediumblue\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:15\:dark, html.var.auto .sf-c-txt-mediumblue\:15\:dark { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:20\:dark, html.var.auto .sf-c-txt-mediumblue\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:25\:dark, html.var.auto .sf-c-txt-mediumblue\:25\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:30\:dark, html.var.auto .sf-c-txt-mediumblue\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:35\:dark, html.var.auto .sf-c-txt-mediumblue\:35\:dark { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:40\:dark, html.var.auto .sf-c-txt-mediumblue\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:45\:dark, html.var.auto .sf-c-txt-mediumblue\:45\:dark { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:50\:dark, html.var.auto .sf-c-txt-mediumblue\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:55\:dark, html.var.auto .sf-c-txt-mediumblue\:55\:dark { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:60\:dark, html.var.auto .sf-c-txt-mediumblue\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:65\:dark, html.var.auto .sf-c-txt-mediumblue\:65\:dark { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:70\:dark, html.var.auto .sf-c-txt-mediumblue\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:75\:dark, html.var.auto .sf-c-txt-mediumblue\:75\:dark { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:80\:dark, html.var.auto .sf-c-txt-mediumblue\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:85\:dark, html.var.auto .sf-c-txt-mediumblue\:85\:dark { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:90\:dark, html.var.auto .sf-c-txt-mediumblue\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:95\:dark, html.var.auto .sf-c-txt-mediumblue\:95\:dark { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumblue\:100\:dark, html.var.auto .sf-c-txt-mediumblue\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumorchid.css b/src/colors/20/mediumorchid.css index 90a8b91..254cced 100644 --- a/src/colors/20/mediumorchid.css +++ b/src/colors/20/mediumorchid.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumorchid'] { --sf-c-mediumorchid: 288 59% 58%; --sf-c-mediumorchid-0: 288 59% 0%; --sf-c-mediumorchid-5: 288 59% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumorchid\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-mediumorchid\:95\:dark, html.var.auto .sf-c-mediumorchid\:95\:dark { color: hsl(288, 59%, 95%); background: hsl(288, 59%, 5%) } html.var[data-theme='auto'] .sf-c-mediumorchid\:100\:dark, html.var.auto .sf-c-mediumorchid\:100\:dark { color: hsl(288, 59%, 95%); background: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid, html.auto .sf-c-txt-mediumorchid { color: hsl(288, 59%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0, html.auto .sf-c-txt-mediumorchid\:0 { color: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:5, html.auto .sf-c-txt-mediumorchid\:5 { color: hsl(288, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10, html.auto .sf-c-txt-mediumorchid\:10 { color: hsl(288, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:15, html.auto .sf-c-txt-mediumorchid\:15 { color: hsl(288, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20, html.auto .sf-c-txt-mediumorchid\:20 { color: hsl(288, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:25, html.auto .sf-c-txt-mediumorchid\:25 { color: hsl(288, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30, html.auto .sf-c-txt-mediumorchid\:30 { color: hsl(288, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:35, html.auto .sf-c-txt-mediumorchid\:35 { color: hsl(288, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40, html.auto .sf-c-txt-mediumorchid\:40 { color: hsl(288, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:45, html.auto .sf-c-txt-mediumorchid\:45 { color: hsl(288, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50, html.auto .sf-c-txt-mediumorchid\:50 { color: hsl(288, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:55, html.auto .sf-c-txt-mediumorchid\:55 { color: hsl(288, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60, html.auto .sf-c-txt-mediumorchid\:60 { color: hsl(288, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:65, html.auto .sf-c-txt-mediumorchid\:65 { color: hsl(288, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70, html.auto .sf-c-txt-mediumorchid\:70 { color: hsl(288, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:75, html.auto .sf-c-txt-mediumorchid\:75 { color: hsl(288, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80, html.auto .sf-c-txt-mediumorchid\:80 { color: hsl(288, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:85, html.auto .sf-c-txt-mediumorchid\:85 { color: hsl(288, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90, html.auto .sf-c-txt-mediumorchid\:90 { color: hsl(288, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:95, html.auto .sf-c-txt-mediumorchid\:95 { color: hsl(288, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100, html.auto .sf-c-txt-mediumorchid\:100 { color: hsl(288, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid, html.var.auto .sf-c-txt-mediumorchid { color: hsl(288, 59%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0, html.var.auto .sf-c-txt-mediumorchid\:0 { color: hsl(288, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:5, html.var.auto .sf-c-txt-mediumorchid\:5 { color: hsl(288, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10, html.var.auto .sf-c-txt-mediumorchid\:10 { color: hsl(288, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:15, html.var.auto .sf-c-txt-mediumorchid\:15 { color: hsl(288, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20, html.var.auto .sf-c-txt-mediumorchid\:20 { color: hsl(288, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:25, html.var.auto .sf-c-txt-mediumorchid\:25 { color: hsl(288, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30, html.var.auto .sf-c-txt-mediumorchid\:30 { color: hsl(288, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:35, html.var.auto .sf-c-txt-mediumorchid\:35 { color: hsl(288, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40, html.var.auto .sf-c-txt-mediumorchid\:40 { color: hsl(288, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:45, html.var.auto .sf-c-txt-mediumorchid\:45 { color: hsl(288, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50, html.var.auto .sf-c-txt-mediumorchid\:50 { color: hsl(288, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:55, html.var.auto .sf-c-txt-mediumorchid\:55 { color: hsl(288, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60, html.var.auto .sf-c-txt-mediumorchid\:60 { color: hsl(288, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:65, html.var.auto .sf-c-txt-mediumorchid\:65 { color: hsl(288, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70, html.var.auto .sf-c-txt-mediumorchid\:70 { color: hsl(288, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:75, html.var.auto .sf-c-txt-mediumorchid\:75 { color: hsl(288, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80, html.var.auto .sf-c-txt-mediumorchid\:80 { color: hsl(288, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:85, html.var.auto .sf-c-txt-mediumorchid\:85 { color: hsl(288, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90, html.var.auto .sf-c-txt-mediumorchid\:90 { color: hsl(288, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:95, html.var.auto .sf-c-txt-mediumorchid\:95 { color: hsl(288, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100, html.var.auto .sf-c-txt-mediumorchid\:100 { color: hsl(288, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:dark, html.auto .sf-c-txt-mediumorchid\:dark { color: hsl(288, 59%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0\:dark, html.auto .sf-c-txt-mediumorchid\:0\:dark { color: hsl(288, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:5\:dark, html.auto .sf-c-txt-mediumorchid\:5\:dark { color: hsl(288, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10\:dark, html.auto .sf-c-txt-mediumorchid\:10\:dark { color: hsl(288, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:15\:dark, html.auto .sf-c-txt-mediumorchid\:15\:dark { color: hsl(288, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20\:dark, html.auto .sf-c-txt-mediumorchid\:20\:dark { color: hsl(288, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:25\:dark, html.auto .sf-c-txt-mediumorchid\:25\:dark { color: hsl(288, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30\:dark, html.auto .sf-c-txt-mediumorchid\:30\:dark { color: hsl(288, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:35\:dark, html.auto .sf-c-txt-mediumorchid\:35\:dark { color: hsl(288, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40\:dark, html.auto .sf-c-txt-mediumorchid\:40\:dark { color: hsl(288, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:45\:dark, html.auto .sf-c-txt-mediumorchid\:45\:dark { color: hsl(288, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50\:dark, html.auto .sf-c-txt-mediumorchid\:50\:dark { color: hsl(288, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:55\:dark, html.auto .sf-c-txt-mediumorchid\:55\:dark { color: hsl(288, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60\:dark, html.auto .sf-c-txt-mediumorchid\:60\:dark { color: hsl(288, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:65\:dark, html.auto .sf-c-txt-mediumorchid\:65\:dark { color: hsl(288, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70\:dark, html.auto .sf-c-txt-mediumorchid\:70\:dark { color: hsl(288, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:75\:dark, html.auto .sf-c-txt-mediumorchid\:75\:dark { color: hsl(288, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80\:dark, html.auto .sf-c-txt-mediumorchid\:80\:dark { color: hsl(288, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:85\:dark, html.auto .sf-c-txt-mediumorchid\:85\:dark { color: hsl(288, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90\:dark, html.auto .sf-c-txt-mediumorchid\:90\:dark { color: hsl(288, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:95\:dark, html.auto .sf-c-txt-mediumorchid\:95\:dark { color: hsl(288, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100\:dark, html.auto .sf-c-txt-mediumorchid\:100\:dark { color: hsl(288, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:dark, html.var.auto .sf-c-txt-mediumorchid\:dark { color: hsl(288, 59%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:0\:dark, html.var.auto .sf-c-txt-mediumorchid\:0\:dark { color: hsl(288, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:5\:dark, html.var.auto .sf-c-txt-mediumorchid\:5\:dark { color: hsl(288, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:10\:dark, html.var.auto .sf-c-txt-mediumorchid\:10\:dark { color: hsl(288, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:15\:dark, html.var.auto .sf-c-txt-mediumorchid\:15\:dark { color: hsl(288, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:20\:dark, html.var.auto .sf-c-txt-mediumorchid\:20\:dark { color: hsl(288, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:25\:dark, html.var.auto .sf-c-txt-mediumorchid\:25\:dark { color: hsl(288, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:30\:dark, html.var.auto .sf-c-txt-mediumorchid\:30\:dark { color: hsl(288, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:35\:dark, html.var.auto .sf-c-txt-mediumorchid\:35\:dark { color: hsl(288, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:40\:dark, html.var.auto .sf-c-txt-mediumorchid\:40\:dark { color: hsl(288, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:45\:dark, html.var.auto .sf-c-txt-mediumorchid\:45\:dark { color: hsl(288, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:50\:dark, html.var.auto .sf-c-txt-mediumorchid\:50\:dark { color: hsl(288, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:55\:dark, html.var.auto .sf-c-txt-mediumorchid\:55\:dark { color: hsl(288, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:60\:dark, html.var.auto .sf-c-txt-mediumorchid\:60\:dark { color: hsl(288, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:65\:dark, html.var.auto .sf-c-txt-mediumorchid\:65\:dark { color: hsl(288, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:70\:dark, html.var.auto .sf-c-txt-mediumorchid\:70\:dark { color: hsl(288, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:75\:dark, html.var.auto .sf-c-txt-mediumorchid\:75\:dark { color: hsl(288, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:80\:dark, html.var.auto .sf-c-txt-mediumorchid\:80\:dark { color: hsl(288, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:85\:dark, html.var.auto .sf-c-txt-mediumorchid\:85\:dark { color: hsl(288, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:90\:dark, html.var.auto .sf-c-txt-mediumorchid\:90\:dark { color: hsl(288, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:95\:dark, html.var.auto .sf-c-txt-mediumorchid\:95\:dark { color: hsl(288, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumorchid\:100\:dark, html.var.auto .sf-c-txt-mediumorchid\:100\:dark { color: hsl(288, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumpurple.css b/src/colors/20/mediumpurple.css index 9dceee2..4637f10 100644 --- a/src/colors/20/mediumpurple.css +++ b/src/colors/20/mediumpurple.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumpurple'] { --sf-c-mediumpurple: 260 60% 65%; --sf-c-mediumpurple-0: 260 60% 0%; --sf-c-mediumpurple-5: 260 60% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumpurple\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-mediumpurple\:95\:dark, html.var.auto .sf-c-mediumpurple\:95\:dark { color: hsl(260, 60%, 95%); background: hsl(260, 60%, 5%) } html.var[data-theme='auto'] .sf-c-mediumpurple\:100\:dark, html.var.auto .sf-c-mediumpurple\:100\:dark { color: hsl(260, 60%, 95%); background: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple, html.auto .sf-c-txt-mediumpurple { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0, html.auto .sf-c-txt-mediumpurple\:0 { color: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:5, html.auto .sf-c-txt-mediumpurple\:5 { color: hsl(260, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10, html.auto .sf-c-txt-mediumpurple\:10 { color: hsl(260, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:15, html.auto .sf-c-txt-mediumpurple\:15 { color: hsl(260, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20, html.auto .sf-c-txt-mediumpurple\:20 { color: hsl(260, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:25, html.auto .sf-c-txt-mediumpurple\:25 { color: hsl(260, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30, html.auto .sf-c-txt-mediumpurple\:30 { color: hsl(260, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:35, html.auto .sf-c-txt-mediumpurple\:35 { color: hsl(260, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40, html.auto .sf-c-txt-mediumpurple\:40 { color: hsl(260, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:45, html.auto .sf-c-txt-mediumpurple\:45 { color: hsl(260, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50, html.auto .sf-c-txt-mediumpurple\:50 { color: hsl(260, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:55, html.auto .sf-c-txt-mediumpurple\:55 { color: hsl(260, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60, html.auto .sf-c-txt-mediumpurple\:60 { color: hsl(260, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:65, html.auto .sf-c-txt-mediumpurple\:65 { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70, html.auto .sf-c-txt-mediumpurple\:70 { color: hsl(260, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:75, html.auto .sf-c-txt-mediumpurple\:75 { color: hsl(260, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80, html.auto .sf-c-txt-mediumpurple\:80 { color: hsl(260, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:85, html.auto .sf-c-txt-mediumpurple\:85 { color: hsl(260, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90, html.auto .sf-c-txt-mediumpurple\:90 { color: hsl(260, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:95, html.auto .sf-c-txt-mediumpurple\:95 { color: hsl(260, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100, html.auto .sf-c-txt-mediumpurple\:100 { color: hsl(260, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple, html.var.auto .sf-c-txt-mediumpurple { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0, html.var.auto .sf-c-txt-mediumpurple\:0 { color: hsl(260, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:5, html.var.auto .sf-c-txt-mediumpurple\:5 { color: hsl(260, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10, html.var.auto .sf-c-txt-mediumpurple\:10 { color: hsl(260, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:15, html.var.auto .sf-c-txt-mediumpurple\:15 { color: hsl(260, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20, html.var.auto .sf-c-txt-mediumpurple\:20 { color: hsl(260, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:25, html.var.auto .sf-c-txt-mediumpurple\:25 { color: hsl(260, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30, html.var.auto .sf-c-txt-mediumpurple\:30 { color: hsl(260, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:35, html.var.auto .sf-c-txt-mediumpurple\:35 { color: hsl(260, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40, html.var.auto .sf-c-txt-mediumpurple\:40 { color: hsl(260, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:45, html.var.auto .sf-c-txt-mediumpurple\:45 { color: hsl(260, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50, html.var.auto .sf-c-txt-mediumpurple\:50 { color: hsl(260, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:55, html.var.auto .sf-c-txt-mediumpurple\:55 { color: hsl(260, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60, html.var.auto .sf-c-txt-mediumpurple\:60 { color: hsl(260, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:65, html.var.auto .sf-c-txt-mediumpurple\:65 { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70, html.var.auto .sf-c-txt-mediumpurple\:70 { color: hsl(260, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:75, html.var.auto .sf-c-txt-mediumpurple\:75 { color: hsl(260, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80, html.var.auto .sf-c-txt-mediumpurple\:80 { color: hsl(260, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:85, html.var.auto .sf-c-txt-mediumpurple\:85 { color: hsl(260, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90, html.var.auto .sf-c-txt-mediumpurple\:90 { color: hsl(260, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:95, html.var.auto .sf-c-txt-mediumpurple\:95 { color: hsl(260, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100, html.var.auto .sf-c-txt-mediumpurple\:100 { color: hsl(260, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:dark, html.auto .sf-c-txt-mediumpurple\:dark { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0\:dark, html.auto .sf-c-txt-mediumpurple\:0\:dark { color: hsl(260, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:5\:dark, html.auto .sf-c-txt-mediumpurple\:5\:dark { color: hsl(260, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10\:dark, html.auto .sf-c-txt-mediumpurple\:10\:dark { color: hsl(260, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:15\:dark, html.auto .sf-c-txt-mediumpurple\:15\:dark { color: hsl(260, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20\:dark, html.auto .sf-c-txt-mediumpurple\:20\:dark { color: hsl(260, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:25\:dark, html.auto .sf-c-txt-mediumpurple\:25\:dark { color: hsl(260, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30\:dark, html.auto .sf-c-txt-mediumpurple\:30\:dark { color: hsl(260, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:35\:dark, html.auto .sf-c-txt-mediumpurple\:35\:dark { color: hsl(260, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40\:dark, html.auto .sf-c-txt-mediumpurple\:40\:dark { color: hsl(260, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:45\:dark, html.auto .sf-c-txt-mediumpurple\:45\:dark { color: hsl(260, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50\:dark, html.auto .sf-c-txt-mediumpurple\:50\:dark { color: hsl(260, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:55\:dark, html.auto .sf-c-txt-mediumpurple\:55\:dark { color: hsl(260, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60\:dark, html.auto .sf-c-txt-mediumpurple\:60\:dark { color: hsl(260, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:65\:dark, html.auto .sf-c-txt-mediumpurple\:65\:dark { color: hsl(260, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70\:dark, html.auto .sf-c-txt-mediumpurple\:70\:dark { color: hsl(260, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:75\:dark, html.auto .sf-c-txt-mediumpurple\:75\:dark { color: hsl(260, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80\:dark, html.auto .sf-c-txt-mediumpurple\:80\:dark { color: hsl(260, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:85\:dark, html.auto .sf-c-txt-mediumpurple\:85\:dark { color: hsl(260, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90\:dark, html.auto .sf-c-txt-mediumpurple\:90\:dark { color: hsl(260, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:95\:dark, html.auto .sf-c-txt-mediumpurple\:95\:dark { color: hsl(260, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100\:dark, html.auto .sf-c-txt-mediumpurple\:100\:dark { color: hsl(260, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:dark, html.var.auto .sf-c-txt-mediumpurple\:dark { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:0\:dark, html.var.auto .sf-c-txt-mediumpurple\:0\:dark { color: hsl(260, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:5\:dark, html.var.auto .sf-c-txt-mediumpurple\:5\:dark { color: hsl(260, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:10\:dark, html.var.auto .sf-c-txt-mediumpurple\:10\:dark { color: hsl(260, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:15\:dark, html.var.auto .sf-c-txt-mediumpurple\:15\:dark { color: hsl(260, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:20\:dark, html.var.auto .sf-c-txt-mediumpurple\:20\:dark { color: hsl(260, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:25\:dark, html.var.auto .sf-c-txt-mediumpurple\:25\:dark { color: hsl(260, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:30\:dark, html.var.auto .sf-c-txt-mediumpurple\:30\:dark { color: hsl(260, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:35\:dark, html.var.auto .sf-c-txt-mediumpurple\:35\:dark { color: hsl(260, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:40\:dark, html.var.auto .sf-c-txt-mediumpurple\:40\:dark { color: hsl(260, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:45\:dark, html.var.auto .sf-c-txt-mediumpurple\:45\:dark { color: hsl(260, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:50\:dark, html.var.auto .sf-c-txt-mediumpurple\:50\:dark { color: hsl(260, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:55\:dark, html.var.auto .sf-c-txt-mediumpurple\:55\:dark { color: hsl(260, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:60\:dark, html.var.auto .sf-c-txt-mediumpurple\:60\:dark { color: hsl(260, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:65\:dark, html.var.auto .sf-c-txt-mediumpurple\:65\:dark { color: hsl(260, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:70\:dark, html.var.auto .sf-c-txt-mediumpurple\:70\:dark { color: hsl(260, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:75\:dark, html.var.auto .sf-c-txt-mediumpurple\:75\:dark { color: hsl(260, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:80\:dark, html.var.auto .sf-c-txt-mediumpurple\:80\:dark { color: hsl(260, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:85\:dark, html.var.auto .sf-c-txt-mediumpurple\:85\:dark { color: hsl(260, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:90\:dark, html.var.auto .sf-c-txt-mediumpurple\:90\:dark { color: hsl(260, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:95\:dark, html.var.auto .sf-c-txt-mediumpurple\:95\:dark { color: hsl(260, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumpurple\:100\:dark, html.var.auto .sf-c-txt-mediumpurple\:100\:dark { color: hsl(260, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumseagreen.css b/src/colors/20/mediumseagreen.css index 1a0ae88..2869430 100644 --- a/src/colors/20/mediumseagreen.css +++ b/src/colors/20/mediumseagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumseagreen'] { --sf-c-mediumseagreen: 147 50% 47%; --sf-c-mediumseagreen-0: 147 50% 0%; --sf-c-mediumseagreen-5: 147 50% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumseagreen\:100\:dark, html.dark .sf-c html.var[data-theme='auto'] .sf-c-mediumseagreen\:95\:dark, html.var.auto .sf-c-mediumseagreen\:95\:dark { color: hsl(147, 50%, 95%); background: hsl(147, 50%, 5%) } html.var[data-theme='auto'] .sf-c-mediumseagreen\:100\:dark, html.var.auto .sf-c-mediumseagreen\:100\:dark { color: hsl(147, 50%, 95%); background: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen, html.auto .sf-c-txt-mediumseagreen { color: hsl(147, 50%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0, html.auto .sf-c-txt-mediumseagreen\:0 { color: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:5, html.auto .sf-c-txt-mediumseagreen\:5 { color: hsl(147, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10, html.auto .sf-c-txt-mediumseagreen\:10 { color: hsl(147, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:15, html.auto .sf-c-txt-mediumseagreen\:15 { color: hsl(147, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20, html.auto .sf-c-txt-mediumseagreen\:20 { color: hsl(147, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:25, html.auto .sf-c-txt-mediumseagreen\:25 { color: hsl(147, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30, html.auto .sf-c-txt-mediumseagreen\:30 { color: hsl(147, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:35, html.auto .sf-c-txt-mediumseagreen\:35 { color: hsl(147, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40, html.auto .sf-c-txt-mediumseagreen\:40 { color: hsl(147, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:45, html.auto .sf-c-txt-mediumseagreen\:45 { color: hsl(147, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50, html.auto .sf-c-txt-mediumseagreen\:50 { color: hsl(147, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:55, html.auto .sf-c-txt-mediumseagreen\:55 { color: hsl(147, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60, html.auto .sf-c-txt-mediumseagreen\:60 { color: hsl(147, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:65, html.auto .sf-c-txt-mediumseagreen\:65 { color: hsl(147, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70, html.auto .sf-c-txt-mediumseagreen\:70 { color: hsl(147, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:75, html.auto .sf-c-txt-mediumseagreen\:75 { color: hsl(147, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80, html.auto .sf-c-txt-mediumseagreen\:80 { color: hsl(147, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:85, html.auto .sf-c-txt-mediumseagreen\:85 { color: hsl(147, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90, html.auto .sf-c-txt-mediumseagreen\:90 { color: hsl(147, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:95, html.auto .sf-c-txt-mediumseagreen\:95 { color: hsl(147, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100, html.auto .sf-c-txt-mediumseagreen\:100 { color: hsl(147, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen, html.var.auto .sf-c-txt-mediumseagreen { color: hsl(147, 50%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0, html.var.auto .sf-c-txt-mediumseagreen\:0 { color: hsl(147, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:5, html.var.auto .sf-c-txt-mediumseagreen\:5 { color: hsl(147, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10, html.var.auto .sf-c-txt-mediumseagreen\:10 { color: hsl(147, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:15, html.var.auto .sf-c-txt-mediumseagreen\:15 { color: hsl(147, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20, html.var.auto .sf-c-txt-mediumseagreen\:20 { color: hsl(147, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:25, html.var.auto .sf-c-txt-mediumseagreen\:25 { color: hsl(147, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30, html.var.auto .sf-c-txt-mediumseagreen\:30 { color: hsl(147, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:35, html.var.auto .sf-c-txt-mediumseagreen\:35 { color: hsl(147, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40, html.var.auto .sf-c-txt-mediumseagreen\:40 { color: hsl(147, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:45, html.var.auto .sf-c-txt-mediumseagreen\:45 { color: hsl(147, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50, html.var.auto .sf-c-txt-mediumseagreen\:50 { color: hsl(147, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:55, html.var.auto .sf-c-txt-mediumseagreen\:55 { color: hsl(147, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60, html.var.auto .sf-c-txt-mediumseagreen\:60 { color: hsl(147, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:65, html.var.auto .sf-c-txt-mediumseagreen\:65 { color: hsl(147, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70, html.var.auto .sf-c-txt-mediumseagreen\:70 { color: hsl(147, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:75, html.var.auto .sf-c-txt-mediumseagreen\:75 { color: hsl(147, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80, html.var.auto .sf-c-txt-mediumseagreen\:80 { color: hsl(147, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:85, html.var.auto .sf-c-txt-mediumseagreen\:85 { color: hsl(147, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90, html.var.auto .sf-c-txt-mediumseagreen\:90 { color: hsl(147, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:95, html.var.auto .sf-c-txt-mediumseagreen\:95 { color: hsl(147, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100, html.var.auto .sf-c-txt-mediumseagreen\:100 { color: hsl(147, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:dark, html.auto .sf-c-txt-mediumseagreen\:dark { color: hsl(147, 50%, 47%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0\:dark, html.auto .sf-c-txt-mediumseagreen\:0\:dark { color: hsl(147, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:5\:dark, html.auto .sf-c-txt-mediumseagreen\:5\:dark { color: hsl(147, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10\:dark, html.auto .sf-c-txt-mediumseagreen\:10\:dark { color: hsl(147, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:15\:dark, html.auto .sf-c-txt-mediumseagreen\:15\:dark { color: hsl(147, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20\:dark, html.auto .sf-c-txt-mediumseagreen\:20\:dark { color: hsl(147, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:25\:dark, html.auto .sf-c-txt-mediumseagreen\:25\:dark { color: hsl(147, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30\:dark, html.auto .sf-c-txt-mediumseagreen\:30\:dark { color: hsl(147, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:35\:dark, html.auto .sf-c-txt-mediumseagreen\:35\:dark { color: hsl(147, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40\:dark, html.auto .sf-c-txt-mediumseagreen\:40\:dark { color: hsl(147, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:45\:dark, html.auto .sf-c-txt-mediumseagreen\:45\:dark { color: hsl(147, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50\:dark, html.auto .sf-c-txt-mediumseagreen\:50\:dark { color: hsl(147, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:55\:dark, html.auto .sf-c-txt-mediumseagreen\:55\:dark { color: hsl(147, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60\:dark, html.auto .sf-c-txt-mediumseagreen\:60\:dark { color: hsl(147, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:65\:dark, html.auto .sf-c-txt-mediumseagreen\:65\:dark { color: hsl(147, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70\:dark, html.auto .sf-c-txt-mediumseagreen\:70\:dark { color: hsl(147, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:75\:dark, html.auto .sf-c-txt-mediumseagreen\:75\:dark { color: hsl(147, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80\:dark, html.auto .sf-c-txt-mediumseagreen\:80\:dark { color: hsl(147, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:85\:dark, html.auto .sf-c-txt-mediumseagreen\:85\:dark { color: hsl(147, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90\:dark, html.auto .sf-c-txt-mediumseagreen\:90\:dark { color: hsl(147, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:95\:dark, html.auto .sf-c-txt-mediumseagreen\:95\:dark { color: hsl(147, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100\:dark, html.auto .sf-c-txt-mediumseagreen\:100\:dark { color: hsl(147, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:dark, html.var.auto .sf-c-txt-mediumseagreen\:dark { color: hsl(147, 50%, 47%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:0\:dark, html.var.auto .sf-c-txt-mediumseagreen\:0\:dark { color: hsl(147, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:5\:dark, html.var.auto .sf-c-txt-mediumseagreen\:5\:dark { color: hsl(147, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:10\:dark, html.var.auto .sf-c-txt-mediumseagreen\:10\:dark { color: hsl(147, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:15\:dark, html.var.auto .sf-c-txt-mediumseagreen\:15\:dark { color: hsl(147, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:20\:dark, html.var.auto .sf-c-txt-mediumseagreen\:20\:dark { color: hsl(147, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:25\:dark, html.var.auto .sf-c-txt-mediumseagreen\:25\:dark { color: hsl(147, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:30\:dark, html.var.auto .sf-c-txt-mediumseagreen\:30\:dark { color: hsl(147, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:35\:dark, html.var.auto .sf-c-txt-mediumseagreen\:35\:dark { color: hsl(147, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:40\:dark, html.var.auto .sf-c-txt-mediumseagreen\:40\:dark { color: hsl(147, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:45\:dark, html.var.auto .sf-c-txt-mediumseagreen\:45\:dark { color: hsl(147, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:50\:dark, html.var.auto .sf-c-txt-mediumseagreen\:50\:dark { color: hsl(147, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:55\:dark, html.var.auto .sf-c-txt-mediumseagreen\:55\:dark { color: hsl(147, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:60\:dark, html.var.auto .sf-c-txt-mediumseagreen\:60\:dark { color: hsl(147, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:65\:dark, html.var.auto .sf-c-txt-mediumseagreen\:65\:dark { color: hsl(147, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:70\:dark, html.var.auto .sf-c-txt-mediumseagreen\:70\:dark { color: hsl(147, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:75\:dark, html.var.auto .sf-c-txt-mediumseagreen\:75\:dark { color: hsl(147, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:80\:dark, html.var.auto .sf-c-txt-mediumseagreen\:80\:dark { color: hsl(147, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:85\:dark, html.var.auto .sf-c-txt-mediumseagreen\:85\:dark { color: hsl(147, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:90\:dark, html.var.auto .sf-c-txt-mediumseagreen\:90\:dark { color: hsl(147, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:95\:dark, html.var.auto .sf-c-txt-mediumseagreen\:95\:dark { color: hsl(147, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumseagreen\:100\:dark, html.var.auto .sf-c-txt-mediumseagreen\:100\:dark { color: hsl(147, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumslateblue.css b/src/colors/20/mediumslateblue.css index f0898af..1f6e2ef 100644 --- a/src/colors/20/mediumslateblue.css +++ b/src/colors/20/mediumslateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumslateblue'] { --sf-c-mediumslateblue: 249 80% 67%; --sf-c-mediumslateblue-0: 249 80% 0%; --sf-c-mediumslateblue-5: 249 80% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumslateblue\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumslateblue\:95\:dark, html.var.auto .sf-c-mediumslateblue\:95\:dark { color: hsl(249, 80%, 95%); background: hsl(249, 80%, 5%) } html.var[data-theme='auto'] .sf-c-mediumslateblue\:100\:dark, html.var.auto .sf-c-mediumslateblue\:100\:dark { color: hsl(249, 80%, 95%); background: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue, html.auto .sf-c-txt-mediumslateblue { color: hsl(249, 80%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0, html.auto .sf-c-txt-mediumslateblue\:0 { color: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:5, html.auto .sf-c-txt-mediumslateblue\:5 { color: hsl(249, 80%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10, html.auto .sf-c-txt-mediumslateblue\:10 { color: hsl(249, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:15, html.auto .sf-c-txt-mediumslateblue\:15 { color: hsl(249, 80%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20, html.auto .sf-c-txt-mediumslateblue\:20 { color: hsl(249, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:25, html.auto .sf-c-txt-mediumslateblue\:25 { color: hsl(249, 80%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30, html.auto .sf-c-txt-mediumslateblue\:30 { color: hsl(249, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:35, html.auto .sf-c-txt-mediumslateblue\:35 { color: hsl(249, 80%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40, html.auto .sf-c-txt-mediumslateblue\:40 { color: hsl(249, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:45, html.auto .sf-c-txt-mediumslateblue\:45 { color: hsl(249, 80%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50, html.auto .sf-c-txt-mediumslateblue\:50 { color: hsl(249, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:55, html.auto .sf-c-txt-mediumslateblue\:55 { color: hsl(249, 80%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60, html.auto .sf-c-txt-mediumslateblue\:60 { color: hsl(249, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:65, html.auto .sf-c-txt-mediumslateblue\:65 { color: hsl(249, 80%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70, html.auto .sf-c-txt-mediumslateblue\:70 { color: hsl(249, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:75, html.auto .sf-c-txt-mediumslateblue\:75 { color: hsl(249, 80%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80, html.auto .sf-c-txt-mediumslateblue\:80 { color: hsl(249, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:85, html.auto .sf-c-txt-mediumslateblue\:85 { color: hsl(249, 80%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90, html.auto .sf-c-txt-mediumslateblue\:90 { color: hsl(249, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:95, html.auto .sf-c-txt-mediumslateblue\:95 { color: hsl(249, 80%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100, html.auto .sf-c-txt-mediumslateblue\:100 { color: hsl(249, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue, html.var.auto .sf-c-txt-mediumslateblue { color: hsl(249, 80%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0, html.var.auto .sf-c-txt-mediumslateblue\:0 { color: hsl(249, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:5, html.var.auto .sf-c-txt-mediumslateblue\:5 { color: hsl(249, 80%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10, html.var.auto .sf-c-txt-mediumslateblue\:10 { color: hsl(249, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:15, html.var.auto .sf-c-txt-mediumslateblue\:15 { color: hsl(249, 80%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20, html.var.auto .sf-c-txt-mediumslateblue\:20 { color: hsl(249, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:25, html.var.auto .sf-c-txt-mediumslateblue\:25 { color: hsl(249, 80%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30, html.var.auto .sf-c-txt-mediumslateblue\:30 { color: hsl(249, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:35, html.var.auto .sf-c-txt-mediumslateblue\:35 { color: hsl(249, 80%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40, html.var.auto .sf-c-txt-mediumslateblue\:40 { color: hsl(249, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:45, html.var.auto .sf-c-txt-mediumslateblue\:45 { color: hsl(249, 80%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50, html.var.auto .sf-c-txt-mediumslateblue\:50 { color: hsl(249, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:55, html.var.auto .sf-c-txt-mediumslateblue\:55 { color: hsl(249, 80%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60, html.var.auto .sf-c-txt-mediumslateblue\:60 { color: hsl(249, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:65, html.var.auto .sf-c-txt-mediumslateblue\:65 { color: hsl(249, 80%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70, html.var.auto .sf-c-txt-mediumslateblue\:70 { color: hsl(249, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:75, html.var.auto .sf-c-txt-mediumslateblue\:75 { color: hsl(249, 80%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80, html.var.auto .sf-c-txt-mediumslateblue\:80 { color: hsl(249, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:85, html.var.auto .sf-c-txt-mediumslateblue\:85 { color: hsl(249, 80%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90, html.var.auto .sf-c-txt-mediumslateblue\:90 { color: hsl(249, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:95, html.var.auto .sf-c-txt-mediumslateblue\:95 { color: hsl(249, 80%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100, html.var.auto .sf-c-txt-mediumslateblue\:100 { color: hsl(249, 80%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:dark, html.auto .sf-c-txt-mediumslateblue\:dark { color: hsl(249, 80%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0\:dark, html.auto .sf-c-txt-mediumslateblue\:0\:dark { color: hsl(249, 80%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:5\:dark, html.auto .sf-c-txt-mediumslateblue\:5\:dark { color: hsl(249, 80%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10\:dark, html.auto .sf-c-txt-mediumslateblue\:10\:dark { color: hsl(249, 80%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:15\:dark, html.auto .sf-c-txt-mediumslateblue\:15\:dark { color: hsl(249, 80%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20\:dark, html.auto .sf-c-txt-mediumslateblue\:20\:dark { color: hsl(249, 80%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:25\:dark, html.auto .sf-c-txt-mediumslateblue\:25\:dark { color: hsl(249, 80%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30\:dark, html.auto .sf-c-txt-mediumslateblue\:30\:dark { color: hsl(249, 80%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:35\:dark, html.auto .sf-c-txt-mediumslateblue\:35\:dark { color: hsl(249, 80%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40\:dark, html.auto .sf-c-txt-mediumslateblue\:40\:dark { color: hsl(249, 80%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:45\:dark, html.auto .sf-c-txt-mediumslateblue\:45\:dark { color: hsl(249, 80%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50\:dark, html.auto .sf-c-txt-mediumslateblue\:50\:dark { color: hsl(249, 80%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:55\:dark, html.auto .sf-c-txt-mediumslateblue\:55\:dark { color: hsl(249, 80%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60\:dark, html.auto .sf-c-txt-mediumslateblue\:60\:dark { color: hsl(249, 80%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:65\:dark, html.auto .sf-c-txt-mediumslateblue\:65\:dark { color: hsl(249, 80%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70\:dark, html.auto .sf-c-txt-mediumslateblue\:70\:dark { color: hsl(249, 80%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:75\:dark, html.auto .sf-c-txt-mediumslateblue\:75\:dark { color: hsl(249, 80%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80\:dark, html.auto .sf-c-txt-mediumslateblue\:80\:dark { color: hsl(249, 80%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:85\:dark, html.auto .sf-c-txt-mediumslateblue\:85\:dark { color: hsl(249, 80%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90\:dark, html.auto .sf-c-txt-mediumslateblue\:90\:dark { color: hsl(249, 80%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:95\:dark, html.auto .sf-c-txt-mediumslateblue\:95\:dark { color: hsl(249, 80%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100\:dark, html.auto .sf-c-txt-mediumslateblue\:100\:dark { color: hsl(249, 80%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:dark, html.var.auto .sf-c-txt-mediumslateblue\:dark { color: hsl(249, 80%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:0\:dark, html.var.auto .sf-c-txt-mediumslateblue\:0\:dark { color: hsl(249, 80%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:5\:dark, html.var.auto .sf-c-txt-mediumslateblue\:5\:dark { color: hsl(249, 80%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:10\:dark, html.var.auto .sf-c-txt-mediumslateblue\:10\:dark { color: hsl(249, 80%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:15\:dark, html.var.auto .sf-c-txt-mediumslateblue\:15\:dark { color: hsl(249, 80%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:20\:dark, html.var.auto .sf-c-txt-mediumslateblue\:20\:dark { color: hsl(249, 80%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:25\:dark, html.var.auto .sf-c-txt-mediumslateblue\:25\:dark { color: hsl(249, 80%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:30\:dark, html.var.auto .sf-c-txt-mediumslateblue\:30\:dark { color: hsl(249, 80%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:35\:dark, html.var.auto .sf-c-txt-mediumslateblue\:35\:dark { color: hsl(249, 80%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:40\:dark, html.var.auto .sf-c-txt-mediumslateblue\:40\:dark { color: hsl(249, 80%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:45\:dark, html.var.auto .sf-c-txt-mediumslateblue\:45\:dark { color: hsl(249, 80%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:50\:dark, html.var.auto .sf-c-txt-mediumslateblue\:50\:dark { color: hsl(249, 80%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:55\:dark, html.var.auto .sf-c-txt-mediumslateblue\:55\:dark { color: hsl(249, 80%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:60\:dark, html.var.auto .sf-c-txt-mediumslateblue\:60\:dark { color: hsl(249, 80%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:65\:dark, html.var.auto .sf-c-txt-mediumslateblue\:65\:dark { color: hsl(249, 80%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:70\:dark, html.var.auto .sf-c-txt-mediumslateblue\:70\:dark { color: hsl(249, 80%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:75\:dark, html.var.auto .sf-c-txt-mediumslateblue\:75\:dark { color: hsl(249, 80%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:80\:dark, html.var.auto .sf-c-txt-mediumslateblue\:80\:dark { color: hsl(249, 80%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:85\:dark, html.var.auto .sf-c-txt-mediumslateblue\:85\:dark { color: hsl(249, 80%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:90\:dark, html.var.auto .sf-c-txt-mediumslateblue\:90\:dark { color: hsl(249, 80%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:95\:dark, html.var.auto .sf-c-txt-mediumslateblue\:95\:dark { color: hsl(249, 80%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumslateblue\:100\:dark, html.var.auto .sf-c-txt-mediumslateblue\:100\:dark { color: hsl(249, 80%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumspringgreen.css b/src/colors/20/mediumspringgreen.css index 2b0b21c..615427a 100644 --- a/src/colors/20/mediumspringgreen.css +++ b/src/colors/20/mediumspringgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumspringgreen'] { --sf-c-mediumspringgreen: 157 100% 49%; --sf-c-mediumspringgreen-0: 157 100% 0%; --sf-c-mediumspringgreen-5: 157 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumspringgreen\:100\:dark, html.dark .s html.var[data-theme='auto'] .sf-c-mediumspringgreen\:95\:dark, html.var.auto .sf-c-mediumspringgreen\:95\:dark { color: hsl(157, 100%, 95%); background: hsl(157, 100%, 5%) } html.var[data-theme='auto'] .sf-c-mediumspringgreen\:100\:dark, html.var.auto .sf-c-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 95%); background: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen, html.auto .sf-c-txt-mediumspringgreen { color: hsl(157, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0, html.auto .sf-c-txt-mediumspringgreen\:0 { color: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:5, html.auto .sf-c-txt-mediumspringgreen\:5 { color: hsl(157, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10, html.auto .sf-c-txt-mediumspringgreen\:10 { color: hsl(157, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:15, html.auto .sf-c-txt-mediumspringgreen\:15 { color: hsl(157, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20, html.auto .sf-c-txt-mediumspringgreen\:20 { color: hsl(157, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:25, html.auto .sf-c-txt-mediumspringgreen\:25 { color: hsl(157, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30, html.auto .sf-c-txt-mediumspringgreen\:30 { color: hsl(157, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:35, html.auto .sf-c-txt-mediumspringgreen\:35 { color: hsl(157, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40, html.auto .sf-c-txt-mediumspringgreen\:40 { color: hsl(157, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:45, html.auto .sf-c-txt-mediumspringgreen\:45 { color: hsl(157, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50, html.auto .sf-c-txt-mediumspringgreen\:50 { color: hsl(157, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:55, html.auto .sf-c-txt-mediumspringgreen\:55 { color: hsl(157, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60, html.auto .sf-c-txt-mediumspringgreen\:60 { color: hsl(157, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:65, html.auto .sf-c-txt-mediumspringgreen\:65 { color: hsl(157, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70, html.auto .sf-c-txt-mediumspringgreen\:70 { color: hsl(157, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:75, html.auto .sf-c-txt-mediumspringgreen\:75 { color: hsl(157, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80, html.auto .sf-c-txt-mediumspringgreen\:80 { color: hsl(157, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:85, html.auto .sf-c-txt-mediumspringgreen\:85 { color: hsl(157, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90, html.auto .sf-c-txt-mediumspringgreen\:90 { color: hsl(157, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:95, html.auto .sf-c-txt-mediumspringgreen\:95 { color: hsl(157, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100, html.auto .sf-c-txt-mediumspringgreen\:100 { color: hsl(157, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen, html.var.auto .sf-c-txt-mediumspringgreen { color: hsl(157, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0, html.var.auto .sf-c-txt-mediumspringgreen\:0 { color: hsl(157, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:5, html.var.auto .sf-c-txt-mediumspringgreen\:5 { color: hsl(157, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10, html.var.auto .sf-c-txt-mediumspringgreen\:10 { color: hsl(157, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:15, html.var.auto .sf-c-txt-mediumspringgreen\:15 { color: hsl(157, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20, html.var.auto .sf-c-txt-mediumspringgreen\:20 { color: hsl(157, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:25, html.var.auto .sf-c-txt-mediumspringgreen\:25 { color: hsl(157, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30, html.var.auto .sf-c-txt-mediumspringgreen\:30 { color: hsl(157, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:35, html.var.auto .sf-c-txt-mediumspringgreen\:35 { color: hsl(157, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40, html.var.auto .sf-c-txt-mediumspringgreen\:40 { color: hsl(157, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:45, html.var.auto .sf-c-txt-mediumspringgreen\:45 { color: hsl(157, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50, html.var.auto .sf-c-txt-mediumspringgreen\:50 { color: hsl(157, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:55, html.var.auto .sf-c-txt-mediumspringgreen\:55 { color: hsl(157, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60, html.var.auto .sf-c-txt-mediumspringgreen\:60 { color: hsl(157, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:65, html.var.auto .sf-c-txt-mediumspringgreen\:65 { color: hsl(157, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70, html.var.auto .sf-c-txt-mediumspringgreen\:70 { color: hsl(157, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:75, html.var.auto .sf-c-txt-mediumspringgreen\:75 { color: hsl(157, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80, html.var.auto .sf-c-txt-mediumspringgreen\:80 { color: hsl(157, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:85, html.var.auto .sf-c-txt-mediumspringgreen\:85 { color: hsl(157, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90, html.var.auto .sf-c-txt-mediumspringgreen\:90 { color: hsl(157, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:95, html.var.auto .sf-c-txt-mediumspringgreen\:95 { color: hsl(157, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100, html.var.auto .sf-c-txt-mediumspringgreen\:100 { color: hsl(157, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:dark, html.auto .sf-c-txt-mediumspringgreen\:dark { color: hsl(157, 100%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0\:dark, html.auto .sf-c-txt-mediumspringgreen\:0\:dark { color: hsl(157, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:5\:dark, html.auto .sf-c-txt-mediumspringgreen\:5\:dark { color: hsl(157, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10\:dark, html.auto .sf-c-txt-mediumspringgreen\:10\:dark { color: hsl(157, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:15\:dark, html.auto .sf-c-txt-mediumspringgreen\:15\:dark { color: hsl(157, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20\:dark, html.auto .sf-c-txt-mediumspringgreen\:20\:dark { color: hsl(157, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:25\:dark, html.auto .sf-c-txt-mediumspringgreen\:25\:dark { color: hsl(157, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30\:dark, html.auto .sf-c-txt-mediumspringgreen\:30\:dark { color: hsl(157, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:35\:dark, html.auto .sf-c-txt-mediumspringgreen\:35\:dark { color: hsl(157, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40\:dark, html.auto .sf-c-txt-mediumspringgreen\:40\:dark { color: hsl(157, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:45\:dark, html.auto .sf-c-txt-mediumspringgreen\:45\:dark { color: hsl(157, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50\:dark, html.auto .sf-c-txt-mediumspringgreen\:50\:dark { color: hsl(157, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:55\:dark, html.auto .sf-c-txt-mediumspringgreen\:55\:dark { color: hsl(157, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60\:dark, html.auto .sf-c-txt-mediumspringgreen\:60\:dark { color: hsl(157, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:65\:dark, html.auto .sf-c-txt-mediumspringgreen\:65\:dark { color: hsl(157, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70\:dark, html.auto .sf-c-txt-mediumspringgreen\:70\:dark { color: hsl(157, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:75\:dark, html.auto .sf-c-txt-mediumspringgreen\:75\:dark { color: hsl(157, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80\:dark, html.auto .sf-c-txt-mediumspringgreen\:80\:dark { color: hsl(157, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:85\:dark, html.auto .sf-c-txt-mediumspringgreen\:85\:dark { color: hsl(157, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90\:dark, html.auto .sf-c-txt-mediumspringgreen\:90\:dark { color: hsl(157, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:95\:dark, html.auto .sf-c-txt-mediumspringgreen\:95\:dark { color: hsl(157, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100\:dark, html.auto .sf-c-txt-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:dark { color: hsl(157, 100%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:0\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:0\:dark { color: hsl(157, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:5\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:5\:dark { color: hsl(157, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:10\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:10\:dark { color: hsl(157, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:15\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:15\:dark { color: hsl(157, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:20\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:20\:dark { color: hsl(157, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:25\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:25\:dark { color: hsl(157, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:30\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:30\:dark { color: hsl(157, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:35\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:35\:dark { color: hsl(157, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:40\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:40\:dark { color: hsl(157, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:45\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:45\:dark { color: hsl(157, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:50\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:50\:dark { color: hsl(157, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:55\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:55\:dark { color: hsl(157, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:60\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:60\:dark { color: hsl(157, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:65\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:65\:dark { color: hsl(157, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:70\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:70\:dark { color: hsl(157, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:75\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:75\:dark { color: hsl(157, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:80\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:80\:dark { color: hsl(157, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:85\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:85\:dark { color: hsl(157, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:90\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:90\:dark { color: hsl(157, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:95\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:95\:dark { color: hsl(157, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumspringgreen\:100\:dark, html.var.auto .sf-c-txt-mediumspringgreen\:100\:dark { color: hsl(157, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumturquoise.css b/src/colors/20/mediumturquoise.css index 16ae759..eaeaaf3 100644 --- a/src/colors/20/mediumturquoise.css +++ b/src/colors/20/mediumturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumturquoise'] { --sf-c-mediumturquoise: 178 60% 55%; --sf-c-mediumturquoise-0: 178 60% 0%; --sf-c-mediumturquoise-5: 178 60% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumturquoise\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumturquoise\:95\:dark, html.var.auto .sf-c-mediumturquoise\:95\:dark { color: hsl(178, 60%, 95%); background: hsl(178, 60%, 5%) } html.var[data-theme='auto'] .sf-c-mediumturquoise\:100\:dark, html.var.auto .sf-c-mediumturquoise\:100\:dark { color: hsl(178, 60%, 95%); background: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise, html.auto .sf-c-txt-mediumturquoise { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0, html.auto .sf-c-txt-mediumturquoise\:0 { color: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:5, html.auto .sf-c-txt-mediumturquoise\:5 { color: hsl(178, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10, html.auto .sf-c-txt-mediumturquoise\:10 { color: hsl(178, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:15, html.auto .sf-c-txt-mediumturquoise\:15 { color: hsl(178, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20, html.auto .sf-c-txt-mediumturquoise\:20 { color: hsl(178, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:25, html.auto .sf-c-txt-mediumturquoise\:25 { color: hsl(178, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30, html.auto .sf-c-txt-mediumturquoise\:30 { color: hsl(178, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:35, html.auto .sf-c-txt-mediumturquoise\:35 { color: hsl(178, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40, html.auto .sf-c-txt-mediumturquoise\:40 { color: hsl(178, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:45, html.auto .sf-c-txt-mediumturquoise\:45 { color: hsl(178, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50, html.auto .sf-c-txt-mediumturquoise\:50 { color: hsl(178, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:55, html.auto .sf-c-txt-mediumturquoise\:55 { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60, html.auto .sf-c-txt-mediumturquoise\:60 { color: hsl(178, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:65, html.auto .sf-c-txt-mediumturquoise\:65 { color: hsl(178, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70, html.auto .sf-c-txt-mediumturquoise\:70 { color: hsl(178, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:75, html.auto .sf-c-txt-mediumturquoise\:75 { color: hsl(178, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80, html.auto .sf-c-txt-mediumturquoise\:80 { color: hsl(178, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:85, html.auto .sf-c-txt-mediumturquoise\:85 { color: hsl(178, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90, html.auto .sf-c-txt-mediumturquoise\:90 { color: hsl(178, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:95, html.auto .sf-c-txt-mediumturquoise\:95 { color: hsl(178, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100, html.auto .sf-c-txt-mediumturquoise\:100 { color: hsl(178, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise, html.var.auto .sf-c-txt-mediumturquoise { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0, html.var.auto .sf-c-txt-mediumturquoise\:0 { color: hsl(178, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:5, html.var.auto .sf-c-txt-mediumturquoise\:5 { color: hsl(178, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10, html.var.auto .sf-c-txt-mediumturquoise\:10 { color: hsl(178, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:15, html.var.auto .sf-c-txt-mediumturquoise\:15 { color: hsl(178, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20, html.var.auto .sf-c-txt-mediumturquoise\:20 { color: hsl(178, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:25, html.var.auto .sf-c-txt-mediumturquoise\:25 { color: hsl(178, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30, html.var.auto .sf-c-txt-mediumturquoise\:30 { color: hsl(178, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:35, html.var.auto .sf-c-txt-mediumturquoise\:35 { color: hsl(178, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40, html.var.auto .sf-c-txt-mediumturquoise\:40 { color: hsl(178, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:45, html.var.auto .sf-c-txt-mediumturquoise\:45 { color: hsl(178, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50, html.var.auto .sf-c-txt-mediumturquoise\:50 { color: hsl(178, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:55, html.var.auto .sf-c-txt-mediumturquoise\:55 { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60, html.var.auto .sf-c-txt-mediumturquoise\:60 { color: hsl(178, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:65, html.var.auto .sf-c-txt-mediumturquoise\:65 { color: hsl(178, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70, html.var.auto .sf-c-txt-mediumturquoise\:70 { color: hsl(178, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:75, html.var.auto .sf-c-txt-mediumturquoise\:75 { color: hsl(178, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80, html.var.auto .sf-c-txt-mediumturquoise\:80 { color: hsl(178, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:85, html.var.auto .sf-c-txt-mediumturquoise\:85 { color: hsl(178, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90, html.var.auto .sf-c-txt-mediumturquoise\:90 { color: hsl(178, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:95, html.var.auto .sf-c-txt-mediumturquoise\:95 { color: hsl(178, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100, html.var.auto .sf-c-txt-mediumturquoise\:100 { color: hsl(178, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:dark, html.auto .sf-c-txt-mediumturquoise\:dark { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0\:dark, html.auto .sf-c-txt-mediumturquoise\:0\:dark { color: hsl(178, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:5\:dark, html.auto .sf-c-txt-mediumturquoise\:5\:dark { color: hsl(178, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10\:dark, html.auto .sf-c-txt-mediumturquoise\:10\:dark { color: hsl(178, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:15\:dark, html.auto .sf-c-txt-mediumturquoise\:15\:dark { color: hsl(178, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20\:dark, html.auto .sf-c-txt-mediumturquoise\:20\:dark { color: hsl(178, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:25\:dark, html.auto .sf-c-txt-mediumturquoise\:25\:dark { color: hsl(178, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30\:dark, html.auto .sf-c-txt-mediumturquoise\:30\:dark { color: hsl(178, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:35\:dark, html.auto .sf-c-txt-mediumturquoise\:35\:dark { color: hsl(178, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40\:dark, html.auto .sf-c-txt-mediumturquoise\:40\:dark { color: hsl(178, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:45\:dark, html.auto .sf-c-txt-mediumturquoise\:45\:dark { color: hsl(178, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50\:dark, html.auto .sf-c-txt-mediumturquoise\:50\:dark { color: hsl(178, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:55\:dark, html.auto .sf-c-txt-mediumturquoise\:55\:dark { color: hsl(178, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60\:dark, html.auto .sf-c-txt-mediumturquoise\:60\:dark { color: hsl(178, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:65\:dark, html.auto .sf-c-txt-mediumturquoise\:65\:dark { color: hsl(178, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70\:dark, html.auto .sf-c-txt-mediumturquoise\:70\:dark { color: hsl(178, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:75\:dark, html.auto .sf-c-txt-mediumturquoise\:75\:dark { color: hsl(178, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80\:dark, html.auto .sf-c-txt-mediumturquoise\:80\:dark { color: hsl(178, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:85\:dark, html.auto .sf-c-txt-mediumturquoise\:85\:dark { color: hsl(178, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90\:dark, html.auto .sf-c-txt-mediumturquoise\:90\:dark { color: hsl(178, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:95\:dark, html.auto .sf-c-txt-mediumturquoise\:95\:dark { color: hsl(178, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100\:dark, html.auto .sf-c-txt-mediumturquoise\:100\:dark { color: hsl(178, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:dark, html.var.auto .sf-c-txt-mediumturquoise\:dark { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:0\:dark, html.var.auto .sf-c-txt-mediumturquoise\:0\:dark { color: hsl(178, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:5\:dark, html.var.auto .sf-c-txt-mediumturquoise\:5\:dark { color: hsl(178, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:10\:dark, html.var.auto .sf-c-txt-mediumturquoise\:10\:dark { color: hsl(178, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:15\:dark, html.var.auto .sf-c-txt-mediumturquoise\:15\:dark { color: hsl(178, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:20\:dark, html.var.auto .sf-c-txt-mediumturquoise\:20\:dark { color: hsl(178, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:25\:dark, html.var.auto .sf-c-txt-mediumturquoise\:25\:dark { color: hsl(178, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:30\:dark, html.var.auto .sf-c-txt-mediumturquoise\:30\:dark { color: hsl(178, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:35\:dark, html.var.auto .sf-c-txt-mediumturquoise\:35\:dark { color: hsl(178, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:40\:dark, html.var.auto .sf-c-txt-mediumturquoise\:40\:dark { color: hsl(178, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:45\:dark, html.var.auto .sf-c-txt-mediumturquoise\:45\:dark { color: hsl(178, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:50\:dark, html.var.auto .sf-c-txt-mediumturquoise\:50\:dark { color: hsl(178, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:55\:dark, html.var.auto .sf-c-txt-mediumturquoise\:55\:dark { color: hsl(178, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:60\:dark, html.var.auto .sf-c-txt-mediumturquoise\:60\:dark { color: hsl(178, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:65\:dark, html.var.auto .sf-c-txt-mediumturquoise\:65\:dark { color: hsl(178, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:70\:dark, html.var.auto .sf-c-txt-mediumturquoise\:70\:dark { color: hsl(178, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:75\:dark, html.var.auto .sf-c-txt-mediumturquoise\:75\:dark { color: hsl(178, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:80\:dark, html.var.auto .sf-c-txt-mediumturquoise\:80\:dark { color: hsl(178, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:85\:dark, html.var.auto .sf-c-txt-mediumturquoise\:85\:dark { color: hsl(178, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:90\:dark, html.var.auto .sf-c-txt-mediumturquoise\:90\:dark { color: hsl(178, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:95\:dark, html.var.auto .sf-c-txt-mediumturquoise\:95\:dark { color: hsl(178, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumturquoise\:100\:dark, html.var.auto .sf-c-txt-mediumturquoise\:100\:dark { color: hsl(178, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mediumvioletred.css b/src/colors/20/mediumvioletred.css index 9405621..9fc397b 100644 --- a/src/colors/20/mediumvioletred.css +++ b/src/colors/20/mediumvioletred.css @@ -1,4 +1,4 @@ -:root { +[class*='mediumvioletred'] { --sf-c-mediumvioletred: 322 81% 43%; --sf-c-mediumvioletred-0: 322 81% 0%; --sf-c-mediumvioletred-5: 322 81% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mediumvioletred\:100\:dark, html.dark .sf- html.var[data-theme='auto'] .sf-c-mediumvioletred\:95\:dark, html.var.auto .sf-c-mediumvioletred\:95\:dark { color: hsl(322, 81%, 95%); background: hsl(322, 81%, 5%) } html.var[data-theme='auto'] .sf-c-mediumvioletred\:100\:dark, html.var.auto .sf-c-mediumvioletred\:100\:dark { color: hsl(322, 81%, 95%); background: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred, html.auto .sf-c-txt-mediumvioletred { color: hsl(322, 81%, 43%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0, html.auto .sf-c-txt-mediumvioletred\:0 { color: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:5, html.auto .sf-c-txt-mediumvioletred\:5 { color: hsl(322, 81%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10, html.auto .sf-c-txt-mediumvioletred\:10 { color: hsl(322, 81%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:15, html.auto .sf-c-txt-mediumvioletred\:15 { color: hsl(322, 81%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20, html.auto .sf-c-txt-mediumvioletred\:20 { color: hsl(322, 81%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:25, html.auto .sf-c-txt-mediumvioletred\:25 { color: hsl(322, 81%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30, html.auto .sf-c-txt-mediumvioletred\:30 { color: hsl(322, 81%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:35, html.auto .sf-c-txt-mediumvioletred\:35 { color: hsl(322, 81%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40, html.auto .sf-c-txt-mediumvioletred\:40 { color: hsl(322, 81%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:45, html.auto .sf-c-txt-mediumvioletred\:45 { color: hsl(322, 81%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50, html.auto .sf-c-txt-mediumvioletred\:50 { color: hsl(322, 81%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:55, html.auto .sf-c-txt-mediumvioletred\:55 { color: hsl(322, 81%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60, html.auto .sf-c-txt-mediumvioletred\:60 { color: hsl(322, 81%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:65, html.auto .sf-c-txt-mediumvioletred\:65 { color: hsl(322, 81%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70, html.auto .sf-c-txt-mediumvioletred\:70 { color: hsl(322, 81%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:75, html.auto .sf-c-txt-mediumvioletred\:75 { color: hsl(322, 81%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80, html.auto .sf-c-txt-mediumvioletred\:80 { color: hsl(322, 81%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:85, html.auto .sf-c-txt-mediumvioletred\:85 { color: hsl(322, 81%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90, html.auto .sf-c-txt-mediumvioletred\:90 { color: hsl(322, 81%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:95, html.auto .sf-c-txt-mediumvioletred\:95 { color: hsl(322, 81%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100, html.auto .sf-c-txt-mediumvioletred\:100 { color: hsl(322, 81%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred, html.var.auto .sf-c-txt-mediumvioletred { color: hsl(322, 81%, 43%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0, html.var.auto .sf-c-txt-mediumvioletred\:0 { color: hsl(322, 81%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:5, html.var.auto .sf-c-txt-mediumvioletred\:5 { color: hsl(322, 81%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10, html.var.auto .sf-c-txt-mediumvioletred\:10 { color: hsl(322, 81%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:15, html.var.auto .sf-c-txt-mediumvioletred\:15 { color: hsl(322, 81%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20, html.var.auto .sf-c-txt-mediumvioletred\:20 { color: hsl(322, 81%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:25, html.var.auto .sf-c-txt-mediumvioletred\:25 { color: hsl(322, 81%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30, html.var.auto .sf-c-txt-mediumvioletred\:30 { color: hsl(322, 81%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:35, html.var.auto .sf-c-txt-mediumvioletred\:35 { color: hsl(322, 81%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40, html.var.auto .sf-c-txt-mediumvioletred\:40 { color: hsl(322, 81%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:45, html.var.auto .sf-c-txt-mediumvioletred\:45 { color: hsl(322, 81%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50, html.var.auto .sf-c-txt-mediumvioletred\:50 { color: hsl(322, 81%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:55, html.var.auto .sf-c-txt-mediumvioletred\:55 { color: hsl(322, 81%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60, html.var.auto .sf-c-txt-mediumvioletred\:60 { color: hsl(322, 81%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:65, html.var.auto .sf-c-txt-mediumvioletred\:65 { color: hsl(322, 81%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70, html.var.auto .sf-c-txt-mediumvioletred\:70 { color: hsl(322, 81%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:75, html.var.auto .sf-c-txt-mediumvioletred\:75 { color: hsl(322, 81%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80, html.var.auto .sf-c-txt-mediumvioletred\:80 { color: hsl(322, 81%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:85, html.var.auto .sf-c-txt-mediumvioletred\:85 { color: hsl(322, 81%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90, html.var.auto .sf-c-txt-mediumvioletred\:90 { color: hsl(322, 81%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:95, html.var.auto .sf-c-txt-mediumvioletred\:95 { color: hsl(322, 81%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100, html.var.auto .sf-c-txt-mediumvioletred\:100 { color: hsl(322, 81%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:dark, html.auto .sf-c-txt-mediumvioletred\:dark { color: hsl(322, 81%, 43%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0\:dark, html.auto .sf-c-txt-mediumvioletred\:0\:dark { color: hsl(322, 81%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:5\:dark, html.auto .sf-c-txt-mediumvioletred\:5\:dark { color: hsl(322, 81%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10\:dark, html.auto .sf-c-txt-mediumvioletred\:10\:dark { color: hsl(322, 81%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:15\:dark, html.auto .sf-c-txt-mediumvioletred\:15\:dark { color: hsl(322, 81%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20\:dark, html.auto .sf-c-txt-mediumvioletred\:20\:dark { color: hsl(322, 81%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:25\:dark, html.auto .sf-c-txt-mediumvioletred\:25\:dark { color: hsl(322, 81%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30\:dark, html.auto .sf-c-txt-mediumvioletred\:30\:dark { color: hsl(322, 81%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:35\:dark, html.auto .sf-c-txt-mediumvioletred\:35\:dark { color: hsl(322, 81%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40\:dark, html.auto .sf-c-txt-mediumvioletred\:40\:dark { color: hsl(322, 81%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:45\:dark, html.auto .sf-c-txt-mediumvioletred\:45\:dark { color: hsl(322, 81%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50\:dark, html.auto .sf-c-txt-mediumvioletred\:50\:dark { color: hsl(322, 81%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:55\:dark, html.auto .sf-c-txt-mediumvioletred\:55\:dark { color: hsl(322, 81%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60\:dark, html.auto .sf-c-txt-mediumvioletred\:60\:dark { color: hsl(322, 81%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:65\:dark, html.auto .sf-c-txt-mediumvioletred\:65\:dark { color: hsl(322, 81%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70\:dark, html.auto .sf-c-txt-mediumvioletred\:70\:dark { color: hsl(322, 81%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:75\:dark, html.auto .sf-c-txt-mediumvioletred\:75\:dark { color: hsl(322, 81%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80\:dark, html.auto .sf-c-txt-mediumvioletred\:80\:dark { color: hsl(322, 81%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:85\:dark, html.auto .sf-c-txt-mediumvioletred\:85\:dark { color: hsl(322, 81%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90\:dark, html.auto .sf-c-txt-mediumvioletred\:90\:dark { color: hsl(322, 81%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:95\:dark, html.auto .sf-c-txt-mediumvioletred\:95\:dark { color: hsl(322, 81%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100\:dark, html.auto .sf-c-txt-mediumvioletred\:100\:dark { color: hsl(322, 81%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:dark, html.var.auto .sf-c-txt-mediumvioletred\:dark { color: hsl(322, 81%, 43%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:0\:dark, html.var.auto .sf-c-txt-mediumvioletred\:0\:dark { color: hsl(322, 81%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:5\:dark, html.var.auto .sf-c-txt-mediumvioletred\:5\:dark { color: hsl(322, 81%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:10\:dark, html.var.auto .sf-c-txt-mediumvioletred\:10\:dark { color: hsl(322, 81%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:15\:dark, html.var.auto .sf-c-txt-mediumvioletred\:15\:dark { color: hsl(322, 81%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:20\:dark, html.var.auto .sf-c-txt-mediumvioletred\:20\:dark { color: hsl(322, 81%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:25\:dark, html.var.auto .sf-c-txt-mediumvioletred\:25\:dark { color: hsl(322, 81%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:30\:dark, html.var.auto .sf-c-txt-mediumvioletred\:30\:dark { color: hsl(322, 81%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:35\:dark, html.var.auto .sf-c-txt-mediumvioletred\:35\:dark { color: hsl(322, 81%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:40\:dark, html.var.auto .sf-c-txt-mediumvioletred\:40\:dark { color: hsl(322, 81%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:45\:dark, html.var.auto .sf-c-txt-mediumvioletred\:45\:dark { color: hsl(322, 81%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:50\:dark, html.var.auto .sf-c-txt-mediumvioletred\:50\:dark { color: hsl(322, 81%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:55\:dark, html.var.auto .sf-c-txt-mediumvioletred\:55\:dark { color: hsl(322, 81%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:60\:dark, html.var.auto .sf-c-txt-mediumvioletred\:60\:dark { color: hsl(322, 81%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:65\:dark, html.var.auto .sf-c-txt-mediumvioletred\:65\:dark { color: hsl(322, 81%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:70\:dark, html.var.auto .sf-c-txt-mediumvioletred\:70\:dark { color: hsl(322, 81%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:75\:dark, html.var.auto .sf-c-txt-mediumvioletred\:75\:dark { color: hsl(322, 81%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:80\:dark, html.var.auto .sf-c-txt-mediumvioletred\:80\:dark { color: hsl(322, 81%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:85\:dark, html.var.auto .sf-c-txt-mediumvioletred\:85\:dark { color: hsl(322, 81%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:90\:dark, html.var.auto .sf-c-txt-mediumvioletred\:90\:dark { color: hsl(322, 81%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:95\:dark, html.var.auto .sf-c-txt-mediumvioletred\:95\:dark { color: hsl(322, 81%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mediumvioletred\:100\:dark, html.var.auto .sf-c-txt-mediumvioletred\:100\:dark { color: hsl(322, 81%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/midnightblue.css b/src/colors/20/midnightblue.css index e450e66..216b26a 100644 --- a/src/colors/20/midnightblue.css +++ b/src/colors/20/midnightblue.css @@ -1,4 +1,4 @@ -:root { +[class*='midnightblue'] { --sf-c-midnightblue: 240 64% 27%; --sf-c-midnightblue-0: 240 64% 0%; --sf-c-midnightblue-5: 240 64% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-midnightblue\:100\:dark, html.dark .sf-c-t html.var[data-theme='auto'] .sf-c-midnightblue\:95\:dark, html.var.auto .sf-c-midnightblue\:95\:dark { color: hsl(240, 64%, 95%); background: hsl(240, 64%, 5%) } html.var[data-theme='auto'] .sf-c-midnightblue\:100\:dark, html.var.auto .sf-c-midnightblue\:100\:dark { color: hsl(240, 64%, 95%); background: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue, html.auto .sf-c-txt-midnightblue { color: hsl(240, 64%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0, html.auto .sf-c-txt-midnightblue\:0 { color: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:5, html.auto .sf-c-txt-midnightblue\:5 { color: hsl(240, 64%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10, html.auto .sf-c-txt-midnightblue\:10 { color: hsl(240, 64%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:15, html.auto .sf-c-txt-midnightblue\:15 { color: hsl(240, 64%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20, html.auto .sf-c-txt-midnightblue\:20 { color: hsl(240, 64%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:25, html.auto .sf-c-txt-midnightblue\:25 { color: hsl(240, 64%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30, html.auto .sf-c-txt-midnightblue\:30 { color: hsl(240, 64%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:35, html.auto .sf-c-txt-midnightblue\:35 { color: hsl(240, 64%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40, html.auto .sf-c-txt-midnightblue\:40 { color: hsl(240, 64%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:45, html.auto .sf-c-txt-midnightblue\:45 { color: hsl(240, 64%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50, html.auto .sf-c-txt-midnightblue\:50 { color: hsl(240, 64%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:55, html.auto .sf-c-txt-midnightblue\:55 { color: hsl(240, 64%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60, html.auto .sf-c-txt-midnightblue\:60 { color: hsl(240, 64%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:65, html.auto .sf-c-txt-midnightblue\:65 { color: hsl(240, 64%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70, html.auto .sf-c-txt-midnightblue\:70 { color: hsl(240, 64%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:75, html.auto .sf-c-txt-midnightblue\:75 { color: hsl(240, 64%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80, html.auto .sf-c-txt-midnightblue\:80 { color: hsl(240, 64%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:85, html.auto .sf-c-txt-midnightblue\:85 { color: hsl(240, 64%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90, html.auto .sf-c-txt-midnightblue\:90 { color: hsl(240, 64%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:95, html.auto .sf-c-txt-midnightblue\:95 { color: hsl(240, 64%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100, html.auto .sf-c-txt-midnightblue\:100 { color: hsl(240, 64%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue, html.var.auto .sf-c-txt-midnightblue { color: hsl(240, 64%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0, html.var.auto .sf-c-txt-midnightblue\:0 { color: hsl(240, 64%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:5, html.var.auto .sf-c-txt-midnightblue\:5 { color: hsl(240, 64%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10, html.var.auto .sf-c-txt-midnightblue\:10 { color: hsl(240, 64%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:15, html.var.auto .sf-c-txt-midnightblue\:15 { color: hsl(240, 64%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20, html.var.auto .sf-c-txt-midnightblue\:20 { color: hsl(240, 64%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:25, html.var.auto .sf-c-txt-midnightblue\:25 { color: hsl(240, 64%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30, html.var.auto .sf-c-txt-midnightblue\:30 { color: hsl(240, 64%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:35, html.var.auto .sf-c-txt-midnightblue\:35 { color: hsl(240, 64%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40, html.var.auto .sf-c-txt-midnightblue\:40 { color: hsl(240, 64%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:45, html.var.auto .sf-c-txt-midnightblue\:45 { color: hsl(240, 64%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50, html.var.auto .sf-c-txt-midnightblue\:50 { color: hsl(240, 64%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:55, html.var.auto .sf-c-txt-midnightblue\:55 { color: hsl(240, 64%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60, html.var.auto .sf-c-txt-midnightblue\:60 { color: hsl(240, 64%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:65, html.var.auto .sf-c-txt-midnightblue\:65 { color: hsl(240, 64%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70, html.var.auto .sf-c-txt-midnightblue\:70 { color: hsl(240, 64%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:75, html.var.auto .sf-c-txt-midnightblue\:75 { color: hsl(240, 64%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80, html.var.auto .sf-c-txt-midnightblue\:80 { color: hsl(240, 64%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:85, html.var.auto .sf-c-txt-midnightblue\:85 { color: hsl(240, 64%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90, html.var.auto .sf-c-txt-midnightblue\:90 { color: hsl(240, 64%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:95, html.var.auto .sf-c-txt-midnightblue\:95 { color: hsl(240, 64%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100, html.var.auto .sf-c-txt-midnightblue\:100 { color: hsl(240, 64%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:dark, html.auto .sf-c-txt-midnightblue\:dark { color: hsl(240, 64%, 27%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0\:dark, html.auto .sf-c-txt-midnightblue\:0\:dark { color: hsl(240, 64%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:5\:dark, html.auto .sf-c-txt-midnightblue\:5\:dark { color: hsl(240, 64%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10\:dark, html.auto .sf-c-txt-midnightblue\:10\:dark { color: hsl(240, 64%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:15\:dark, html.auto .sf-c-txt-midnightblue\:15\:dark { color: hsl(240, 64%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20\:dark, html.auto .sf-c-txt-midnightblue\:20\:dark { color: hsl(240, 64%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:25\:dark, html.auto .sf-c-txt-midnightblue\:25\:dark { color: hsl(240, 64%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30\:dark, html.auto .sf-c-txt-midnightblue\:30\:dark { color: hsl(240, 64%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:35\:dark, html.auto .sf-c-txt-midnightblue\:35\:dark { color: hsl(240, 64%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40\:dark, html.auto .sf-c-txt-midnightblue\:40\:dark { color: hsl(240, 64%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:45\:dark, html.auto .sf-c-txt-midnightblue\:45\:dark { color: hsl(240, 64%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50\:dark, html.auto .sf-c-txt-midnightblue\:50\:dark { color: hsl(240, 64%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:55\:dark, html.auto .sf-c-txt-midnightblue\:55\:dark { color: hsl(240, 64%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60\:dark, html.auto .sf-c-txt-midnightblue\:60\:dark { color: hsl(240, 64%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:65\:dark, html.auto .sf-c-txt-midnightblue\:65\:dark { color: hsl(240, 64%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70\:dark, html.auto .sf-c-txt-midnightblue\:70\:dark { color: hsl(240, 64%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:75\:dark, html.auto .sf-c-txt-midnightblue\:75\:dark { color: hsl(240, 64%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80\:dark, html.auto .sf-c-txt-midnightblue\:80\:dark { color: hsl(240, 64%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:85\:dark, html.auto .sf-c-txt-midnightblue\:85\:dark { color: hsl(240, 64%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90\:dark, html.auto .sf-c-txt-midnightblue\:90\:dark { color: hsl(240, 64%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:95\:dark, html.auto .sf-c-txt-midnightblue\:95\:dark { color: hsl(240, 64%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100\:dark, html.auto .sf-c-txt-midnightblue\:100\:dark { color: hsl(240, 64%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:dark, html.var.auto .sf-c-txt-midnightblue\:dark { color: hsl(240, 64%, 27%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:0\:dark, html.var.auto .sf-c-txt-midnightblue\:0\:dark { color: hsl(240, 64%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:5\:dark, html.var.auto .sf-c-txt-midnightblue\:5\:dark { color: hsl(240, 64%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:10\:dark, html.var.auto .sf-c-txt-midnightblue\:10\:dark { color: hsl(240, 64%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:15\:dark, html.var.auto .sf-c-txt-midnightblue\:15\:dark { color: hsl(240, 64%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:20\:dark, html.var.auto .sf-c-txt-midnightblue\:20\:dark { color: hsl(240, 64%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:25\:dark, html.var.auto .sf-c-txt-midnightblue\:25\:dark { color: hsl(240, 64%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:30\:dark, html.var.auto .sf-c-txt-midnightblue\:30\:dark { color: hsl(240, 64%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:35\:dark, html.var.auto .sf-c-txt-midnightblue\:35\:dark { color: hsl(240, 64%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:40\:dark, html.var.auto .sf-c-txt-midnightblue\:40\:dark { color: hsl(240, 64%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:45\:dark, html.var.auto .sf-c-txt-midnightblue\:45\:dark { color: hsl(240, 64%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:50\:dark, html.var.auto .sf-c-txt-midnightblue\:50\:dark { color: hsl(240, 64%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:55\:dark, html.var.auto .sf-c-txt-midnightblue\:55\:dark { color: hsl(240, 64%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:60\:dark, html.var.auto .sf-c-txt-midnightblue\:60\:dark { color: hsl(240, 64%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:65\:dark, html.var.auto .sf-c-txt-midnightblue\:65\:dark { color: hsl(240, 64%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:70\:dark, html.var.auto .sf-c-txt-midnightblue\:70\:dark { color: hsl(240, 64%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:75\:dark, html.var.auto .sf-c-txt-midnightblue\:75\:dark { color: hsl(240, 64%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:80\:dark, html.var.auto .sf-c-txt-midnightblue\:80\:dark { color: hsl(240, 64%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:85\:dark, html.var.auto .sf-c-txt-midnightblue\:85\:dark { color: hsl(240, 64%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:90\:dark, html.var.auto .sf-c-txt-midnightblue\:90\:dark { color: hsl(240, 64%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:95\:dark, html.var.auto .sf-c-txt-midnightblue\:95\:dark { color: hsl(240, 64%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-midnightblue\:100\:dark, html.var.auto .sf-c-txt-midnightblue\:100\:dark { color: hsl(240, 64%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mintcream.css b/src/colors/20/mintcream.css index a80cd82..305c5d3 100644 --- a/src/colors/20/mintcream.css +++ b/src/colors/20/mintcream.css @@ -1,4 +1,4 @@ -:root { +[class*='mintcream'] { --sf-c-mintcream: 150 100% 98%; --sf-c-mintcream-0: 150 100% 0%; --sf-c-mintcream-5: 150 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mintcream\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-mintcream\:95\:dark, html.var.auto .sf-c-mintcream\:95\:dark { color: hsl(150, 100%, 95%); background: hsl(150, 100%, 5%) } html.var[data-theme='auto'] .sf-c-mintcream\:100\:dark, html.var.auto .sf-c-mintcream\:100\:dark { color: hsl(150, 100%, 95%); background: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream, html.auto .sf-c-txt-mintcream { color: hsl(150, 100%, 98%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:0, html.auto .sf-c-txt-mintcream\:0 { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:5, html.auto .sf-c-txt-mintcream\:5 { color: hsl(150, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:10, html.auto .sf-c-txt-mintcream\:10 { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:15, html.auto .sf-c-txt-mintcream\:15 { color: hsl(150, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:20, html.auto .sf-c-txt-mintcream\:20 { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:25, html.auto .sf-c-txt-mintcream\:25 { color: hsl(150, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:30, html.auto .sf-c-txt-mintcream\:30 { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:35, html.auto .sf-c-txt-mintcream\:35 { color: hsl(150, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:40, html.auto .sf-c-txt-mintcream\:40 { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:45, html.auto .sf-c-txt-mintcream\:45 { color: hsl(150, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:50, html.auto .sf-c-txt-mintcream\:50 { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:55, html.auto .sf-c-txt-mintcream\:55 { color: hsl(150, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:60, html.auto .sf-c-txt-mintcream\:60 { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:65, html.auto .sf-c-txt-mintcream\:65 { color: hsl(150, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:70, html.auto .sf-c-txt-mintcream\:70 { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:75, html.auto .sf-c-txt-mintcream\:75 { color: hsl(150, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:80, html.auto .sf-c-txt-mintcream\:80 { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:85, html.auto .sf-c-txt-mintcream\:85 { color: hsl(150, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:90, html.auto .sf-c-txt-mintcream\:90 { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:95, html.auto .sf-c-txt-mintcream\:95 { color: hsl(150, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:100, html.auto .sf-c-txt-mintcream\:100 { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream, html.var.auto .sf-c-txt-mintcream { color: hsl(150, 100%, 98%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:0, html.var.auto .sf-c-txt-mintcream\:0 { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:5, html.var.auto .sf-c-txt-mintcream\:5 { color: hsl(150, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:10, html.var.auto .sf-c-txt-mintcream\:10 { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:15, html.var.auto .sf-c-txt-mintcream\:15 { color: hsl(150, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:20, html.var.auto .sf-c-txt-mintcream\:20 { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:25, html.var.auto .sf-c-txt-mintcream\:25 { color: hsl(150, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:30, html.var.auto .sf-c-txt-mintcream\:30 { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:35, html.var.auto .sf-c-txt-mintcream\:35 { color: hsl(150, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:40, html.var.auto .sf-c-txt-mintcream\:40 { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:45, html.var.auto .sf-c-txt-mintcream\:45 { color: hsl(150, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:50, html.var.auto .sf-c-txt-mintcream\:50 { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:55, html.var.auto .sf-c-txt-mintcream\:55 { color: hsl(150, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:60, html.var.auto .sf-c-txt-mintcream\:60 { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:65, html.var.auto .sf-c-txt-mintcream\:65 { color: hsl(150, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:70, html.var.auto .sf-c-txt-mintcream\:70 { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:75, html.var.auto .sf-c-txt-mintcream\:75 { color: hsl(150, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:80, html.var.auto .sf-c-txt-mintcream\:80 { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:85, html.var.auto .sf-c-txt-mintcream\:85 { color: hsl(150, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:90, html.var.auto .sf-c-txt-mintcream\:90 { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:95, html.var.auto .sf-c-txt-mintcream\:95 { color: hsl(150, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:100, html.var.auto .sf-c-txt-mintcream\:100 { color: hsl(150, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:dark, html.auto .sf-c-txt-mintcream\:dark { color: hsl(150, 100%, 98%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:0\:dark, html.auto .sf-c-txt-mintcream\:0\:dark { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:5\:dark, html.auto .sf-c-txt-mintcream\:5\:dark { color: hsl(150, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:10\:dark, html.auto .sf-c-txt-mintcream\:10\:dark { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:15\:dark, html.auto .sf-c-txt-mintcream\:15\:dark { color: hsl(150, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:20\:dark, html.auto .sf-c-txt-mintcream\:20\:dark { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:25\:dark, html.auto .sf-c-txt-mintcream\:25\:dark { color: hsl(150, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:30\:dark, html.auto .sf-c-txt-mintcream\:30\:dark { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:35\:dark, html.auto .sf-c-txt-mintcream\:35\:dark { color: hsl(150, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:40\:dark, html.auto .sf-c-txt-mintcream\:40\:dark { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:45\:dark, html.auto .sf-c-txt-mintcream\:45\:dark { color: hsl(150, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:50\:dark, html.auto .sf-c-txt-mintcream\:50\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:55\:dark, html.auto .sf-c-txt-mintcream\:55\:dark { color: hsl(150, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:60\:dark, html.auto .sf-c-txt-mintcream\:60\:dark { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:65\:dark, html.auto .sf-c-txt-mintcream\:65\:dark { color: hsl(150, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:70\:dark, html.auto .sf-c-txt-mintcream\:70\:dark { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:75\:dark, html.auto .sf-c-txt-mintcream\:75\:dark { color: hsl(150, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:80\:dark, html.auto .sf-c-txt-mintcream\:80\:dark { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:85\:dark, html.auto .sf-c-txt-mintcream\:85\:dark { color: hsl(150, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:90\:dark, html.auto .sf-c-txt-mintcream\:90\:dark { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:95\:dark, html.auto .sf-c-txt-mintcream\:95\:dark { color: hsl(150, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mintcream\:100\:dark, html.auto .sf-c-txt-mintcream\:100\:dark { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:dark, html.var.auto .sf-c-txt-mintcream\:dark { color: hsl(150, 100%, 98%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:0\:dark, html.var.auto .sf-c-txt-mintcream\:0\:dark { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:5\:dark, html.var.auto .sf-c-txt-mintcream\:5\:dark { color: hsl(150, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:10\:dark, html.var.auto .sf-c-txt-mintcream\:10\:dark { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:15\:dark, html.var.auto .sf-c-txt-mintcream\:15\:dark { color: hsl(150, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:20\:dark, html.var.auto .sf-c-txt-mintcream\:20\:dark { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:25\:dark, html.var.auto .sf-c-txt-mintcream\:25\:dark { color: hsl(150, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:30\:dark, html.var.auto .sf-c-txt-mintcream\:30\:dark { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:35\:dark, html.var.auto .sf-c-txt-mintcream\:35\:dark { color: hsl(150, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:40\:dark, html.var.auto .sf-c-txt-mintcream\:40\:dark { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:45\:dark, html.var.auto .sf-c-txt-mintcream\:45\:dark { color: hsl(150, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:50\:dark, html.var.auto .sf-c-txt-mintcream\:50\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:55\:dark, html.var.auto .sf-c-txt-mintcream\:55\:dark { color: hsl(150, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:60\:dark, html.var.auto .sf-c-txt-mintcream\:60\:dark { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:65\:dark, html.var.auto .sf-c-txt-mintcream\:65\:dark { color: hsl(150, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:70\:dark, html.var.auto .sf-c-txt-mintcream\:70\:dark { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:75\:dark, html.var.auto .sf-c-txt-mintcream\:75\:dark { color: hsl(150, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:80\:dark, html.var.auto .sf-c-txt-mintcream\:80\:dark { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:85\:dark, html.var.auto .sf-c-txt-mintcream\:85\:dark { color: hsl(150, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:90\:dark, html.var.auto .sf-c-txt-mintcream\:90\:dark { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:95\:dark, html.var.auto .sf-c-txt-mintcream\:95\:dark { color: hsl(150, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mintcream\:100\:dark, html.var.auto .sf-c-txt-mintcream\:100\:dark { color: hsl(150, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/mistyrose.css b/src/colors/20/mistyrose.css index 391496a..9defa63 100644 --- a/src/colors/20/mistyrose.css +++ b/src/colors/20/mistyrose.css @@ -1,4 +1,4 @@ -:root { +[class*='mistyrose'] { --sf-c-mistyrose: 6 100% 94%; --sf-c-mistyrose-0: 6 100% 0%; --sf-c-mistyrose-5: 6 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-mistyrose\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-mistyrose\:95\:dark, html.var.auto .sf-c-mistyrose\:95\:dark { color: hsl(6, 100%, 95%); background: hsl(6, 100%, 5%) } html.var[data-theme='auto'] .sf-c-mistyrose\:100\:dark, html.var.auto .sf-c-mistyrose\:100\:dark { color: hsl(6, 100%, 95%); background: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose, html.auto .sf-c-txt-mistyrose { color: hsl(6, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0, html.auto .sf-c-txt-mistyrose\:0 { color: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:5, html.auto .sf-c-txt-mistyrose\:5 { color: hsl(6, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10, html.auto .sf-c-txt-mistyrose\:10 { color: hsl(6, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:15, html.auto .sf-c-txt-mistyrose\:15 { color: hsl(6, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20, html.auto .sf-c-txt-mistyrose\:20 { color: hsl(6, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:25, html.auto .sf-c-txt-mistyrose\:25 { color: hsl(6, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30, html.auto .sf-c-txt-mistyrose\:30 { color: hsl(6, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:35, html.auto .sf-c-txt-mistyrose\:35 { color: hsl(6, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40, html.auto .sf-c-txt-mistyrose\:40 { color: hsl(6, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:45, html.auto .sf-c-txt-mistyrose\:45 { color: hsl(6, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50, html.auto .sf-c-txt-mistyrose\:50 { color: hsl(6, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:55, html.auto .sf-c-txt-mistyrose\:55 { color: hsl(6, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60, html.auto .sf-c-txt-mistyrose\:60 { color: hsl(6, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:65, html.auto .sf-c-txt-mistyrose\:65 { color: hsl(6, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70, html.auto .sf-c-txt-mistyrose\:70 { color: hsl(6, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:75, html.auto .sf-c-txt-mistyrose\:75 { color: hsl(6, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80, html.auto .sf-c-txt-mistyrose\:80 { color: hsl(6, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:85, html.auto .sf-c-txt-mistyrose\:85 { color: hsl(6, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90, html.auto .sf-c-txt-mistyrose\:90 { color: hsl(6, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:95, html.auto .sf-c-txt-mistyrose\:95 { color: hsl(6, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100, html.auto .sf-c-txt-mistyrose\:100 { color: hsl(6, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose, html.var.auto .sf-c-txt-mistyrose { color: hsl(6, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0, html.var.auto .sf-c-txt-mistyrose\:0 { color: hsl(6, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:5, html.var.auto .sf-c-txt-mistyrose\:5 { color: hsl(6, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10, html.var.auto .sf-c-txt-mistyrose\:10 { color: hsl(6, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:15, html.var.auto .sf-c-txt-mistyrose\:15 { color: hsl(6, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20, html.var.auto .sf-c-txt-mistyrose\:20 { color: hsl(6, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:25, html.var.auto .sf-c-txt-mistyrose\:25 { color: hsl(6, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30, html.var.auto .sf-c-txt-mistyrose\:30 { color: hsl(6, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:35, html.var.auto .sf-c-txt-mistyrose\:35 { color: hsl(6, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40, html.var.auto .sf-c-txt-mistyrose\:40 { color: hsl(6, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:45, html.var.auto .sf-c-txt-mistyrose\:45 { color: hsl(6, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50, html.var.auto .sf-c-txt-mistyrose\:50 { color: hsl(6, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:55, html.var.auto .sf-c-txt-mistyrose\:55 { color: hsl(6, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60, html.var.auto .sf-c-txt-mistyrose\:60 { color: hsl(6, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:65, html.var.auto .sf-c-txt-mistyrose\:65 { color: hsl(6, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70, html.var.auto .sf-c-txt-mistyrose\:70 { color: hsl(6, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:75, html.var.auto .sf-c-txt-mistyrose\:75 { color: hsl(6, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80, html.var.auto .sf-c-txt-mistyrose\:80 { color: hsl(6, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:85, html.var.auto .sf-c-txt-mistyrose\:85 { color: hsl(6, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90, html.var.auto .sf-c-txt-mistyrose\:90 { color: hsl(6, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:95, html.var.auto .sf-c-txt-mistyrose\:95 { color: hsl(6, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100, html.var.auto .sf-c-txt-mistyrose\:100 { color: hsl(6, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:dark, html.auto .sf-c-txt-mistyrose\:dark { color: hsl(6, 100%, 94%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0\:dark, html.auto .sf-c-txt-mistyrose\:0\:dark { color: hsl(6, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:5\:dark, html.auto .sf-c-txt-mistyrose\:5\:dark { color: hsl(6, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10\:dark, html.auto .sf-c-txt-mistyrose\:10\:dark { color: hsl(6, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:15\:dark, html.auto .sf-c-txt-mistyrose\:15\:dark { color: hsl(6, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20\:dark, html.auto .sf-c-txt-mistyrose\:20\:dark { color: hsl(6, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:25\:dark, html.auto .sf-c-txt-mistyrose\:25\:dark { color: hsl(6, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30\:dark, html.auto .sf-c-txt-mistyrose\:30\:dark { color: hsl(6, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:35\:dark, html.auto .sf-c-txt-mistyrose\:35\:dark { color: hsl(6, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40\:dark, html.auto .sf-c-txt-mistyrose\:40\:dark { color: hsl(6, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:45\:dark, html.auto .sf-c-txt-mistyrose\:45\:dark { color: hsl(6, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50\:dark, html.auto .sf-c-txt-mistyrose\:50\:dark { color: hsl(6, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:55\:dark, html.auto .sf-c-txt-mistyrose\:55\:dark { color: hsl(6, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60\:dark, html.auto .sf-c-txt-mistyrose\:60\:dark { color: hsl(6, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:65\:dark, html.auto .sf-c-txt-mistyrose\:65\:dark { color: hsl(6, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70\:dark, html.auto .sf-c-txt-mistyrose\:70\:dark { color: hsl(6, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:75\:dark, html.auto .sf-c-txt-mistyrose\:75\:dark { color: hsl(6, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80\:dark, html.auto .sf-c-txt-mistyrose\:80\:dark { color: hsl(6, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:85\:dark, html.auto .sf-c-txt-mistyrose\:85\:dark { color: hsl(6, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90\:dark, html.auto .sf-c-txt-mistyrose\:90\:dark { color: hsl(6, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:95\:dark, html.auto .sf-c-txt-mistyrose\:95\:dark { color: hsl(6, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100\:dark, html.auto .sf-c-txt-mistyrose\:100\:dark { color: hsl(6, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:dark, html.var.auto .sf-c-txt-mistyrose\:dark { color: hsl(6, 100%, 94%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:0\:dark, html.var.auto .sf-c-txt-mistyrose\:0\:dark { color: hsl(6, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:5\:dark, html.var.auto .sf-c-txt-mistyrose\:5\:dark { color: hsl(6, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:10\:dark, html.var.auto .sf-c-txt-mistyrose\:10\:dark { color: hsl(6, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:15\:dark, html.var.auto .sf-c-txt-mistyrose\:15\:dark { color: hsl(6, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:20\:dark, html.var.auto .sf-c-txt-mistyrose\:20\:dark { color: hsl(6, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:25\:dark, html.var.auto .sf-c-txt-mistyrose\:25\:dark { color: hsl(6, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:30\:dark, html.var.auto .sf-c-txt-mistyrose\:30\:dark { color: hsl(6, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:35\:dark, html.var.auto .sf-c-txt-mistyrose\:35\:dark { color: hsl(6, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:40\:dark, html.var.auto .sf-c-txt-mistyrose\:40\:dark { color: hsl(6, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:45\:dark, html.var.auto .sf-c-txt-mistyrose\:45\:dark { color: hsl(6, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:50\:dark, html.var.auto .sf-c-txt-mistyrose\:50\:dark { color: hsl(6, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:55\:dark, html.var.auto .sf-c-txt-mistyrose\:55\:dark { color: hsl(6, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:60\:dark, html.var.auto .sf-c-txt-mistyrose\:60\:dark { color: hsl(6, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:65\:dark, html.var.auto .sf-c-txt-mistyrose\:65\:dark { color: hsl(6, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:70\:dark, html.var.auto .sf-c-txt-mistyrose\:70\:dark { color: hsl(6, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:75\:dark, html.var.auto .sf-c-txt-mistyrose\:75\:dark { color: hsl(6, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:80\:dark, html.var.auto .sf-c-txt-mistyrose\:80\:dark { color: hsl(6, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:85\:dark, html.var.auto .sf-c-txt-mistyrose\:85\:dark { color: hsl(6, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:90\:dark, html.var.auto .sf-c-txt-mistyrose\:90\:dark { color: hsl(6, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:95\:dark, html.var.auto .sf-c-txt-mistyrose\:95\:dark { color: hsl(6, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-mistyrose\:100\:dark, html.var.auto .sf-c-txt-mistyrose\:100\:dark { color: hsl(6, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/moccasin.css b/src/colors/20/moccasin.css index e5ef93f..73e9a23 100644 --- a/src/colors/20/moccasin.css +++ b/src/colors/20/moccasin.css @@ -1,4 +1,4 @@ -:root { +[class*='moccasin'] { --sf-c-moccasin: 38 100% 85%; --sf-c-moccasin-0: 38 100% 0%; --sf-c-moccasin-5: 38 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-moccasin\:100\:dark, html.dark .sf-c-txt-m html.var[data-theme='auto'] .sf-c-moccasin\:95\:dark, html.var.auto .sf-c-moccasin\:95\:dark { color: hsl(38, 100%, 95%); background: hsl(38, 100%, 5%) } html.var[data-theme='auto'] .sf-c-moccasin\:100\:dark, html.var.auto .sf-c-moccasin\:100\:dark { color: hsl(38, 100%, 95%); background: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin, html.auto .sf-c-txt-moccasin { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:0, html.auto .sf-c-txt-moccasin\:0 { color: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:5, html.auto .sf-c-txt-moccasin\:5 { color: hsl(38, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:10, html.auto .sf-c-txt-moccasin\:10 { color: hsl(38, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:15, html.auto .sf-c-txt-moccasin\:15 { color: hsl(38, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:20, html.auto .sf-c-txt-moccasin\:20 { color: hsl(38, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:25, html.auto .sf-c-txt-moccasin\:25 { color: hsl(38, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:30, html.auto .sf-c-txt-moccasin\:30 { color: hsl(38, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:35, html.auto .sf-c-txt-moccasin\:35 { color: hsl(38, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:40, html.auto .sf-c-txt-moccasin\:40 { color: hsl(38, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:45, html.auto .sf-c-txt-moccasin\:45 { color: hsl(38, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:50, html.auto .sf-c-txt-moccasin\:50 { color: hsl(38, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:55, html.auto .sf-c-txt-moccasin\:55 { color: hsl(38, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:60, html.auto .sf-c-txt-moccasin\:60 { color: hsl(38, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:65, html.auto .sf-c-txt-moccasin\:65 { color: hsl(38, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:70, html.auto .sf-c-txt-moccasin\:70 { color: hsl(38, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:75, html.auto .sf-c-txt-moccasin\:75 { color: hsl(38, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:80, html.auto .sf-c-txt-moccasin\:80 { color: hsl(38, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:85, html.auto .sf-c-txt-moccasin\:85 { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:90, html.auto .sf-c-txt-moccasin\:90 { color: hsl(38, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:95, html.auto .sf-c-txt-moccasin\:95 { color: hsl(38, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:100, html.auto .sf-c-txt-moccasin\:100 { color: hsl(38, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin, html.var.auto .sf-c-txt-moccasin { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:0, html.var.auto .sf-c-txt-moccasin\:0 { color: hsl(38, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:5, html.var.auto .sf-c-txt-moccasin\:5 { color: hsl(38, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:10, html.var.auto .sf-c-txt-moccasin\:10 { color: hsl(38, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:15, html.var.auto .sf-c-txt-moccasin\:15 { color: hsl(38, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:20, html.var.auto .sf-c-txt-moccasin\:20 { color: hsl(38, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:25, html.var.auto .sf-c-txt-moccasin\:25 { color: hsl(38, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:30, html.var.auto .sf-c-txt-moccasin\:30 { color: hsl(38, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:35, html.var.auto .sf-c-txt-moccasin\:35 { color: hsl(38, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:40, html.var.auto .sf-c-txt-moccasin\:40 { color: hsl(38, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:45, html.var.auto .sf-c-txt-moccasin\:45 { color: hsl(38, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:50, html.var.auto .sf-c-txt-moccasin\:50 { color: hsl(38, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:55, html.var.auto .sf-c-txt-moccasin\:55 { color: hsl(38, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:60, html.var.auto .sf-c-txt-moccasin\:60 { color: hsl(38, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:65, html.var.auto .sf-c-txt-moccasin\:65 { color: hsl(38, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:70, html.var.auto .sf-c-txt-moccasin\:70 { color: hsl(38, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:75, html.var.auto .sf-c-txt-moccasin\:75 { color: hsl(38, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:80, html.var.auto .sf-c-txt-moccasin\:80 { color: hsl(38, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:85, html.var.auto .sf-c-txt-moccasin\:85 { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:90, html.var.auto .sf-c-txt-moccasin\:90 { color: hsl(38, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:95, html.var.auto .sf-c-txt-moccasin\:95 { color: hsl(38, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:100, html.var.auto .sf-c-txt-moccasin\:100 { color: hsl(38, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:dark, html.auto .sf-c-txt-moccasin\:dark { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:0\:dark, html.auto .sf-c-txt-moccasin\:0\:dark { color: hsl(38, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:5\:dark, html.auto .sf-c-txt-moccasin\:5\:dark { color: hsl(38, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:10\:dark, html.auto .sf-c-txt-moccasin\:10\:dark { color: hsl(38, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:15\:dark, html.auto .sf-c-txt-moccasin\:15\:dark { color: hsl(38, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:20\:dark, html.auto .sf-c-txt-moccasin\:20\:dark { color: hsl(38, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:25\:dark, html.auto .sf-c-txt-moccasin\:25\:dark { color: hsl(38, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:30\:dark, html.auto .sf-c-txt-moccasin\:30\:dark { color: hsl(38, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:35\:dark, html.auto .sf-c-txt-moccasin\:35\:dark { color: hsl(38, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:40\:dark, html.auto .sf-c-txt-moccasin\:40\:dark { color: hsl(38, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:45\:dark, html.auto .sf-c-txt-moccasin\:45\:dark { color: hsl(38, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:50\:dark, html.auto .sf-c-txt-moccasin\:50\:dark { color: hsl(38, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:55\:dark, html.auto .sf-c-txt-moccasin\:55\:dark { color: hsl(38, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:60\:dark, html.auto .sf-c-txt-moccasin\:60\:dark { color: hsl(38, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:65\:dark, html.auto .sf-c-txt-moccasin\:65\:dark { color: hsl(38, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:70\:dark, html.auto .sf-c-txt-moccasin\:70\:dark { color: hsl(38, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:75\:dark, html.auto .sf-c-txt-moccasin\:75\:dark { color: hsl(38, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:80\:dark, html.auto .sf-c-txt-moccasin\:80\:dark { color: hsl(38, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:85\:dark, html.auto .sf-c-txt-moccasin\:85\:dark { color: hsl(38, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:90\:dark, html.auto .sf-c-txt-moccasin\:90\:dark { color: hsl(38, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:95\:dark, html.auto .sf-c-txt-moccasin\:95\:dark { color: hsl(38, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-moccasin\:100\:dark, html.auto .sf-c-txt-moccasin\:100\:dark { color: hsl(38, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:dark, html.var.auto .sf-c-txt-moccasin\:dark { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:0\:dark, html.var.auto .sf-c-txt-moccasin\:0\:dark { color: hsl(38, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:5\:dark, html.var.auto .sf-c-txt-moccasin\:5\:dark { color: hsl(38, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:10\:dark, html.var.auto .sf-c-txt-moccasin\:10\:dark { color: hsl(38, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:15\:dark, html.var.auto .sf-c-txt-moccasin\:15\:dark { color: hsl(38, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:20\:dark, html.var.auto .sf-c-txt-moccasin\:20\:dark { color: hsl(38, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:25\:dark, html.var.auto .sf-c-txt-moccasin\:25\:dark { color: hsl(38, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:30\:dark, html.var.auto .sf-c-txt-moccasin\:30\:dark { color: hsl(38, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:35\:dark, html.var.auto .sf-c-txt-moccasin\:35\:dark { color: hsl(38, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:40\:dark, html.var.auto .sf-c-txt-moccasin\:40\:dark { color: hsl(38, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:45\:dark, html.var.auto .sf-c-txt-moccasin\:45\:dark { color: hsl(38, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:50\:dark, html.var.auto .sf-c-txt-moccasin\:50\:dark { color: hsl(38, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:55\:dark, html.var.auto .sf-c-txt-moccasin\:55\:dark { color: hsl(38, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:60\:dark, html.var.auto .sf-c-txt-moccasin\:60\:dark { color: hsl(38, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:65\:dark, html.var.auto .sf-c-txt-moccasin\:65\:dark { color: hsl(38, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:70\:dark, html.var.auto .sf-c-txt-moccasin\:70\:dark { color: hsl(38, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:75\:dark, html.var.auto .sf-c-txt-moccasin\:75\:dark { color: hsl(38, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:80\:dark, html.var.auto .sf-c-txt-moccasin\:80\:dark { color: hsl(38, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:85\:dark, html.var.auto .sf-c-txt-moccasin\:85\:dark { color: hsl(38, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:90\:dark, html.var.auto .sf-c-txt-moccasin\:90\:dark { color: hsl(38, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:95\:dark, html.var.auto .sf-c-txt-moccasin\:95\:dark { color: hsl(38, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-moccasin\:100\:dark, html.var.auto .sf-c-txt-moccasin\:100\:dark { color: hsl(38, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/navajowhite.css b/src/colors/20/navajowhite.css index 50ec2df..5f964a4 100644 --- a/src/colors/20/navajowhite.css +++ b/src/colors/20/navajowhite.css @@ -1,4 +1,4 @@ -:root { +[class*='navajowhite'] { --sf-c-navajowhite: 36 100% 84%; --sf-c-navajowhite-0: 36 100% 0%; --sf-c-navajowhite-5: 36 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-navajowhite\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-navajowhite\:95\:dark, html.var.auto .sf-c-navajowhite\:95\:dark { color: hsl(36, 100%, 95%); background: hsl(36, 100%, 5%) } html.var[data-theme='auto'] .sf-c-navajowhite\:100\:dark, html.var.auto .sf-c-navajowhite\:100\:dark { color: hsl(36, 100%, 95%); background: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite, html.auto .sf-c-txt-navajowhite { color: hsl(36, 100%, 84%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0, html.auto .sf-c-txt-navajowhite\:0 { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:5, html.auto .sf-c-txt-navajowhite\:5 { color: hsl(36, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10, html.auto .sf-c-txt-navajowhite\:10 { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:15, html.auto .sf-c-txt-navajowhite\:15 { color: hsl(36, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20, html.auto .sf-c-txt-navajowhite\:20 { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:25, html.auto .sf-c-txt-navajowhite\:25 { color: hsl(36, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30, html.auto .sf-c-txt-navajowhite\:30 { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:35, html.auto .sf-c-txt-navajowhite\:35 { color: hsl(36, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40, html.auto .sf-c-txt-navajowhite\:40 { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:45, html.auto .sf-c-txt-navajowhite\:45 { color: hsl(36, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50, html.auto .sf-c-txt-navajowhite\:50 { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:55, html.auto .sf-c-txt-navajowhite\:55 { color: hsl(36, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60, html.auto .sf-c-txt-navajowhite\:60 { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:65, html.auto .sf-c-txt-navajowhite\:65 { color: hsl(36, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70, html.auto .sf-c-txt-navajowhite\:70 { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:75, html.auto .sf-c-txt-navajowhite\:75 { color: hsl(36, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80, html.auto .sf-c-txt-navajowhite\:80 { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:85, html.auto .sf-c-txt-navajowhite\:85 { color: hsl(36, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90, html.auto .sf-c-txt-navajowhite\:90 { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:95, html.auto .sf-c-txt-navajowhite\:95 { color: hsl(36, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100, html.auto .sf-c-txt-navajowhite\:100 { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite, html.var.auto .sf-c-txt-navajowhite { color: hsl(36, 100%, 84%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0, html.var.auto .sf-c-txt-navajowhite\:0 { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:5, html.var.auto .sf-c-txt-navajowhite\:5 { color: hsl(36, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10, html.var.auto .sf-c-txt-navajowhite\:10 { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:15, html.var.auto .sf-c-txt-navajowhite\:15 { color: hsl(36, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20, html.var.auto .sf-c-txt-navajowhite\:20 { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:25, html.var.auto .sf-c-txt-navajowhite\:25 { color: hsl(36, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30, html.var.auto .sf-c-txt-navajowhite\:30 { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:35, html.var.auto .sf-c-txt-navajowhite\:35 { color: hsl(36, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40, html.var.auto .sf-c-txt-navajowhite\:40 { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:45, html.var.auto .sf-c-txt-navajowhite\:45 { color: hsl(36, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50, html.var.auto .sf-c-txt-navajowhite\:50 { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:55, html.var.auto .sf-c-txt-navajowhite\:55 { color: hsl(36, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60, html.var.auto .sf-c-txt-navajowhite\:60 { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:65, html.var.auto .sf-c-txt-navajowhite\:65 { color: hsl(36, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70, html.var.auto .sf-c-txt-navajowhite\:70 { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:75, html.var.auto .sf-c-txt-navajowhite\:75 { color: hsl(36, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80, html.var.auto .sf-c-txt-navajowhite\:80 { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:85, html.var.auto .sf-c-txt-navajowhite\:85 { color: hsl(36, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90, html.var.auto .sf-c-txt-navajowhite\:90 { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:95, html.var.auto .sf-c-txt-navajowhite\:95 { color: hsl(36, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100, html.var.auto .sf-c-txt-navajowhite\:100 { color: hsl(36, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:dark, html.auto .sf-c-txt-navajowhite\:dark { color: hsl(36, 100%, 84%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0\:dark, html.auto .sf-c-txt-navajowhite\:0\:dark { color: hsl(36, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:5\:dark, html.auto .sf-c-txt-navajowhite\:5\:dark { color: hsl(36, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10\:dark, html.auto .sf-c-txt-navajowhite\:10\:dark { color: hsl(36, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:15\:dark, html.auto .sf-c-txt-navajowhite\:15\:dark { color: hsl(36, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20\:dark, html.auto .sf-c-txt-navajowhite\:20\:dark { color: hsl(36, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:25\:dark, html.auto .sf-c-txt-navajowhite\:25\:dark { color: hsl(36, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30\:dark, html.auto .sf-c-txt-navajowhite\:30\:dark { color: hsl(36, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:35\:dark, html.auto .sf-c-txt-navajowhite\:35\:dark { color: hsl(36, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40\:dark, html.auto .sf-c-txt-navajowhite\:40\:dark { color: hsl(36, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:45\:dark, html.auto .sf-c-txt-navajowhite\:45\:dark { color: hsl(36, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50\:dark, html.auto .sf-c-txt-navajowhite\:50\:dark { color: hsl(36, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:55\:dark, html.auto .sf-c-txt-navajowhite\:55\:dark { color: hsl(36, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60\:dark, html.auto .sf-c-txt-navajowhite\:60\:dark { color: hsl(36, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:65\:dark, html.auto .sf-c-txt-navajowhite\:65\:dark { color: hsl(36, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70\:dark, html.auto .sf-c-txt-navajowhite\:70\:dark { color: hsl(36, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:75\:dark, html.auto .sf-c-txt-navajowhite\:75\:dark { color: hsl(36, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80\:dark, html.auto .sf-c-txt-navajowhite\:80\:dark { color: hsl(36, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:85\:dark, html.auto .sf-c-txt-navajowhite\:85\:dark { color: hsl(36, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90\:dark, html.auto .sf-c-txt-navajowhite\:90\:dark { color: hsl(36, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:95\:dark, html.auto .sf-c-txt-navajowhite\:95\:dark { color: hsl(36, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100\:dark, html.auto .sf-c-txt-navajowhite\:100\:dark { color: hsl(36, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:dark, html.var.auto .sf-c-txt-navajowhite\:dark { color: hsl(36, 100%, 84%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:0\:dark, html.var.auto .sf-c-txt-navajowhite\:0\:dark { color: hsl(36, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:5\:dark, html.var.auto .sf-c-txt-navajowhite\:5\:dark { color: hsl(36, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:10\:dark, html.var.auto .sf-c-txt-navajowhite\:10\:dark { color: hsl(36, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:15\:dark, html.var.auto .sf-c-txt-navajowhite\:15\:dark { color: hsl(36, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:20\:dark, html.var.auto .sf-c-txt-navajowhite\:20\:dark { color: hsl(36, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:25\:dark, html.var.auto .sf-c-txt-navajowhite\:25\:dark { color: hsl(36, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:30\:dark, html.var.auto .sf-c-txt-navajowhite\:30\:dark { color: hsl(36, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:35\:dark, html.var.auto .sf-c-txt-navajowhite\:35\:dark { color: hsl(36, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:40\:dark, html.var.auto .sf-c-txt-navajowhite\:40\:dark { color: hsl(36, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:45\:dark, html.var.auto .sf-c-txt-navajowhite\:45\:dark { color: hsl(36, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:50\:dark, html.var.auto .sf-c-txt-navajowhite\:50\:dark { color: hsl(36, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:55\:dark, html.var.auto .sf-c-txt-navajowhite\:55\:dark { color: hsl(36, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:60\:dark, html.var.auto .sf-c-txt-navajowhite\:60\:dark { color: hsl(36, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:65\:dark, html.var.auto .sf-c-txt-navajowhite\:65\:dark { color: hsl(36, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:70\:dark, html.var.auto .sf-c-txt-navajowhite\:70\:dark { color: hsl(36, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:75\:dark, html.var.auto .sf-c-txt-navajowhite\:75\:dark { color: hsl(36, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:80\:dark, html.var.auto .sf-c-txt-navajowhite\:80\:dark { color: hsl(36, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:85\:dark, html.var.auto .sf-c-txt-navajowhite\:85\:dark { color: hsl(36, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:90\:dark, html.var.auto .sf-c-txt-navajowhite\:90\:dark { color: hsl(36, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:95\:dark, html.var.auto .sf-c-txt-navajowhite\:95\:dark { color: hsl(36, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-navajowhite\:100\:dark, html.var.auto .sf-c-txt-navajowhite\:100\:dark { color: hsl(36, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/navy.css b/src/colors/20/navy.css index 93a7159..1bd028b 100644 --- a/src/colors/20/navy.css +++ b/src/colors/20/navy.css @@ -1,4 +1,4 @@ -:root { +[class*='navy'] { --sf-c-navy: 240 100% 25%; --sf-c-navy-0: 240 100% 0%; --sf-c-navy-5: 240 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-navy\:100\:dark, html.dark .sf-c-txt-navy\ html.var[data-theme='auto'] .sf-c-navy\:95\:dark, html.var.auto .sf-c-navy\:95\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 5%) } html.var[data-theme='auto'] .sf-c-navy\:100\:dark, html.var.auto .sf-c-navy\:100\:dark { color: hsl(240, 100%, 95%); background: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy, html.auto .sf-c-txt-navy { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:0, html.auto .sf-c-txt-navy\:0 { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:5, html.auto .sf-c-txt-navy\:5 { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:10, html.auto .sf-c-txt-navy\:10 { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:15, html.auto .sf-c-txt-navy\:15 { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:20, html.auto .sf-c-txt-navy\:20 { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:25, html.auto .sf-c-txt-navy\:25 { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:30, html.auto .sf-c-txt-navy\:30 { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:35, html.auto .sf-c-txt-navy\:35 { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:40, html.auto .sf-c-txt-navy\:40 { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:45, html.auto .sf-c-txt-navy\:45 { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:50, html.auto .sf-c-txt-navy\:50 { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:55, html.auto .sf-c-txt-navy\:55 { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:60, html.auto .sf-c-txt-navy\:60 { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:65, html.auto .sf-c-txt-navy\:65 { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:70, html.auto .sf-c-txt-navy\:70 { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:75, html.auto .sf-c-txt-navy\:75 { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:80, html.auto .sf-c-txt-navy\:80 { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:85, html.auto .sf-c-txt-navy\:85 { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:90, html.auto .sf-c-txt-navy\:90 { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:95, html.auto .sf-c-txt-navy\:95 { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:100, html.auto .sf-c-txt-navy\:100 { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navy, html.var.auto .sf-c-txt-navy { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:0, html.var.auto .sf-c-txt-navy\:0 { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:5, html.var.auto .sf-c-txt-navy\:5 { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:10, html.var.auto .sf-c-txt-navy\:10 { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:15, html.var.auto .sf-c-txt-navy\:15 { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:20, html.var.auto .sf-c-txt-navy\:20 { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:25, html.var.auto .sf-c-txt-navy\:25 { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:30, html.var.auto .sf-c-txt-navy\:30 { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:35, html.var.auto .sf-c-txt-navy\:35 { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:40, html.var.auto .sf-c-txt-navy\:40 { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:45, html.var.auto .sf-c-txt-navy\:45 { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:50, html.var.auto .sf-c-txt-navy\:50 { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:55, html.var.auto .sf-c-txt-navy\:55 { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:60, html.var.auto .sf-c-txt-navy\:60 { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:65, html.var.auto .sf-c-txt-navy\:65 { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:70, html.var.auto .sf-c-txt-navy\:70 { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:75, html.var.auto .sf-c-txt-navy\:75 { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:80, html.var.auto .sf-c-txt-navy\:80 { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:85, html.var.auto .sf-c-txt-navy\:85 { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:90, html.var.auto .sf-c-txt-navy\:90 { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:95, html.var.auto .sf-c-txt-navy\:95 { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:100, html.var.auto .sf-c-txt-navy\:100 { color: hsl(240, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:dark, html.auto .sf-c-txt-navy\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark, html.auto .sf-c-txt-navy\:0\:dark { color: hsl(240, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:5\:dark, html.auto .sf-c-txt-navy\:5\:dark { color: hsl(240, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark, html.auto .sf-c-txt-navy\:10\:dark { color: hsl(240, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:15\:dark, html.auto .sf-c-txt-navy\:15\:dark { color: hsl(240, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark, html.auto .sf-c-txt-navy\:20\:dark { color: hsl(240, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:25\:dark, html.auto .sf-c-txt-navy\:25\:dark { color: hsl(240, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark, html.auto .sf-c-txt-navy\:30\:dark { color: hsl(240, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:35\:dark, html.auto .sf-c-txt-navy\:35\:dark { color: hsl(240, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark, html.auto .sf-c-txt-navy\:40\:dark { color: hsl(240, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:45\:dark, html.auto .sf-c-txt-navy\:45\:dark { color: hsl(240, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark, html.auto .sf-c-txt-navy\:50\:dark { color: hsl(240, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:55\:dark, html.auto .sf-c-txt-navy\:55\:dark { color: hsl(240, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark, html.auto .sf-c-txt-navy\:60\:dark { color: hsl(240, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:65\:dark, html.auto .sf-c-txt-navy\:65\:dark { color: hsl(240, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark, html.auto .sf-c-txt-navy\:70\:dark { color: hsl(240, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:75\:dark, html.auto .sf-c-txt-navy\:75\:dark { color: hsl(240, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark, html.auto .sf-c-txt-navy\:80\:dark { color: hsl(240, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:85\:dark, html.auto .sf-c-txt-navy\:85\:dark { color: hsl(240, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark, html.auto .sf-c-txt-navy\:90\:dark { color: hsl(240, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:95\:dark, html.auto .sf-c-txt-navy\:95\:dark { color: hsl(240, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark, html.auto .sf-c-txt-navy\:100\:dark { color: hsl(240, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:dark, html.var.auto .sf-c-txt-navy\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark, html.var.auto .sf-c-txt-navy\:0\:dark { color: hsl(240, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:5\:dark, html.var.auto .sf-c-txt-navy\:5\:dark { color: hsl(240, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark, html.var.auto .sf-c-txt-navy\:10\:dark { color: hsl(240, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:15\:dark, html.var.auto .sf-c-txt-navy\:15\:dark { color: hsl(240, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark, html.var.auto .sf-c-txt-navy\:20\:dark { color: hsl(240, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:25\:dark, html.var.auto .sf-c-txt-navy\:25\:dark { color: hsl(240, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark, html.var.auto .sf-c-txt-navy\:30\:dark { color: hsl(240, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:35\:dark, html.var.auto .sf-c-txt-navy\:35\:dark { color: hsl(240, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark, html.var.auto .sf-c-txt-navy\:40\:dark { color: hsl(240, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:45\:dark, html.var.auto .sf-c-txt-navy\:45\:dark { color: hsl(240, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark, html.var.auto .sf-c-txt-navy\:50\:dark { color: hsl(240, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:55\:dark, html.var.auto .sf-c-txt-navy\:55\:dark { color: hsl(240, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark, html.var.auto .sf-c-txt-navy\:60\:dark { color: hsl(240, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:65\:dark, html.var.auto .sf-c-txt-navy\:65\:dark { color: hsl(240, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark, html.var.auto .sf-c-txt-navy\:70\:dark { color: hsl(240, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:75\:dark, html.var.auto .sf-c-txt-navy\:75\:dark { color: hsl(240, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark, html.var.auto .sf-c-txt-navy\:80\:dark { color: hsl(240, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:85\:dark, html.var.auto .sf-c-txt-navy\:85\:dark { color: hsl(240, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark, html.var.auto .sf-c-txt-navy\:90\:dark { color: hsl(240, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:95\:dark, html.var.auto .sf-c-txt-navy\:95\:dark { color: hsl(240, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark, html.var.auto .sf-c-txt-navy\:100\:dark { color: hsl(240, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/oldlace.css b/src/colors/20/oldlace.css index d48e68b..925a9f9 100644 --- a/src/colors/20/oldlace.css +++ b/src/colors/20/oldlace.css @@ -1,4 +1,4 @@ -:root { +[class*='oldlace'] { --sf-c-oldlace: 39 85% 95%; --sf-c-oldlace-0: 39 85% 0%; --sf-c-oldlace-5: 39 85% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-oldlace\:100\:dark, html.dark .sf-c-txt-ol html.var[data-theme='auto'] .sf-c-oldlace\:95\:dark, html.var.auto .sf-c-oldlace\:95\:dark { color: hsl(39, 85%, 95%); background: hsl(39, 85%, 5%) } html.var[data-theme='auto'] .sf-c-oldlace\:100\:dark, html.var.auto .sf-c-oldlace\:100\:dark { color: hsl(39, 85%, 95%); background: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace, html.auto .sf-c-txt-oldlace { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:0, html.auto .sf-c-txt-oldlace\:0 { color: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:5, html.auto .sf-c-txt-oldlace\:5 { color: hsl(39, 85%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:10, html.auto .sf-c-txt-oldlace\:10 { color: hsl(39, 85%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:15, html.auto .sf-c-txt-oldlace\:15 { color: hsl(39, 85%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:20, html.auto .sf-c-txt-oldlace\:20 { color: hsl(39, 85%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:25, html.auto .sf-c-txt-oldlace\:25 { color: hsl(39, 85%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:30, html.auto .sf-c-txt-oldlace\:30 { color: hsl(39, 85%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:35, html.auto .sf-c-txt-oldlace\:35 { color: hsl(39, 85%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:40, html.auto .sf-c-txt-oldlace\:40 { color: hsl(39, 85%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:45, html.auto .sf-c-txt-oldlace\:45 { color: hsl(39, 85%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:50, html.auto .sf-c-txt-oldlace\:50 { color: hsl(39, 85%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:55, html.auto .sf-c-txt-oldlace\:55 { color: hsl(39, 85%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:60, html.auto .sf-c-txt-oldlace\:60 { color: hsl(39, 85%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:65, html.auto .sf-c-txt-oldlace\:65 { color: hsl(39, 85%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:70, html.auto .sf-c-txt-oldlace\:70 { color: hsl(39, 85%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:75, html.auto .sf-c-txt-oldlace\:75 { color: hsl(39, 85%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:80, html.auto .sf-c-txt-oldlace\:80 { color: hsl(39, 85%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:85, html.auto .sf-c-txt-oldlace\:85 { color: hsl(39, 85%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:90, html.auto .sf-c-txt-oldlace\:90 { color: hsl(39, 85%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:95, html.auto .sf-c-txt-oldlace\:95 { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:100, html.auto .sf-c-txt-oldlace\:100 { color: hsl(39, 85%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace, html.var.auto .sf-c-txt-oldlace { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:0, html.var.auto .sf-c-txt-oldlace\:0 { color: hsl(39, 85%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:5, html.var.auto .sf-c-txt-oldlace\:5 { color: hsl(39, 85%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:10, html.var.auto .sf-c-txt-oldlace\:10 { color: hsl(39, 85%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:15, html.var.auto .sf-c-txt-oldlace\:15 { color: hsl(39, 85%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:20, html.var.auto .sf-c-txt-oldlace\:20 { color: hsl(39, 85%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:25, html.var.auto .sf-c-txt-oldlace\:25 { color: hsl(39, 85%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:30, html.var.auto .sf-c-txt-oldlace\:30 { color: hsl(39, 85%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:35, html.var.auto .sf-c-txt-oldlace\:35 { color: hsl(39, 85%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:40, html.var.auto .sf-c-txt-oldlace\:40 { color: hsl(39, 85%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:45, html.var.auto .sf-c-txt-oldlace\:45 { color: hsl(39, 85%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:50, html.var.auto .sf-c-txt-oldlace\:50 { color: hsl(39, 85%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:55, html.var.auto .sf-c-txt-oldlace\:55 { color: hsl(39, 85%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:60, html.var.auto .sf-c-txt-oldlace\:60 { color: hsl(39, 85%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:65, html.var.auto .sf-c-txt-oldlace\:65 { color: hsl(39, 85%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:70, html.var.auto .sf-c-txt-oldlace\:70 { color: hsl(39, 85%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:75, html.var.auto .sf-c-txt-oldlace\:75 { color: hsl(39, 85%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:80, html.var.auto .sf-c-txt-oldlace\:80 { color: hsl(39, 85%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:85, html.var.auto .sf-c-txt-oldlace\:85 { color: hsl(39, 85%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:90, html.var.auto .sf-c-txt-oldlace\:90 { color: hsl(39, 85%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:95, html.var.auto .sf-c-txt-oldlace\:95 { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:100, html.var.auto .sf-c-txt-oldlace\:100 { color: hsl(39, 85%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:dark, html.auto .sf-c-txt-oldlace\:dark { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:0\:dark, html.auto .sf-c-txt-oldlace\:0\:dark { color: hsl(39, 85%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:5\:dark, html.auto .sf-c-txt-oldlace\:5\:dark { color: hsl(39, 85%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:10\:dark, html.auto .sf-c-txt-oldlace\:10\:dark { color: hsl(39, 85%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:15\:dark, html.auto .sf-c-txt-oldlace\:15\:dark { color: hsl(39, 85%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:20\:dark, html.auto .sf-c-txt-oldlace\:20\:dark { color: hsl(39, 85%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:25\:dark, html.auto .sf-c-txt-oldlace\:25\:dark { color: hsl(39, 85%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:30\:dark, html.auto .sf-c-txt-oldlace\:30\:dark { color: hsl(39, 85%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:35\:dark, html.auto .sf-c-txt-oldlace\:35\:dark { color: hsl(39, 85%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:40\:dark, html.auto .sf-c-txt-oldlace\:40\:dark { color: hsl(39, 85%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:45\:dark, html.auto .sf-c-txt-oldlace\:45\:dark { color: hsl(39, 85%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:50\:dark, html.auto .sf-c-txt-oldlace\:50\:dark { color: hsl(39, 85%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:55\:dark, html.auto .sf-c-txt-oldlace\:55\:dark { color: hsl(39, 85%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:60\:dark, html.auto .sf-c-txt-oldlace\:60\:dark { color: hsl(39, 85%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:65\:dark, html.auto .sf-c-txt-oldlace\:65\:dark { color: hsl(39, 85%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:70\:dark, html.auto .sf-c-txt-oldlace\:70\:dark { color: hsl(39, 85%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:75\:dark, html.auto .sf-c-txt-oldlace\:75\:dark { color: hsl(39, 85%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:80\:dark, html.auto .sf-c-txt-oldlace\:80\:dark { color: hsl(39, 85%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:85\:dark, html.auto .sf-c-txt-oldlace\:85\:dark { color: hsl(39, 85%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:90\:dark, html.auto .sf-c-txt-oldlace\:90\:dark { color: hsl(39, 85%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:95\:dark, html.auto .sf-c-txt-oldlace\:95\:dark { color: hsl(39, 85%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-oldlace\:100\:dark, html.auto .sf-c-txt-oldlace\:100\:dark { color: hsl(39, 85%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:dark, html.var.auto .sf-c-txt-oldlace\:dark { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:0\:dark, html.var.auto .sf-c-txt-oldlace\:0\:dark { color: hsl(39, 85%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:5\:dark, html.var.auto .sf-c-txt-oldlace\:5\:dark { color: hsl(39, 85%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:10\:dark, html.var.auto .sf-c-txt-oldlace\:10\:dark { color: hsl(39, 85%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:15\:dark, html.var.auto .sf-c-txt-oldlace\:15\:dark { color: hsl(39, 85%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:20\:dark, html.var.auto .sf-c-txt-oldlace\:20\:dark { color: hsl(39, 85%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:25\:dark, html.var.auto .sf-c-txt-oldlace\:25\:dark { color: hsl(39, 85%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:30\:dark, html.var.auto .sf-c-txt-oldlace\:30\:dark { color: hsl(39, 85%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:35\:dark, html.var.auto .sf-c-txt-oldlace\:35\:dark { color: hsl(39, 85%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:40\:dark, html.var.auto .sf-c-txt-oldlace\:40\:dark { color: hsl(39, 85%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:45\:dark, html.var.auto .sf-c-txt-oldlace\:45\:dark { color: hsl(39, 85%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:50\:dark, html.var.auto .sf-c-txt-oldlace\:50\:dark { color: hsl(39, 85%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:55\:dark, html.var.auto .sf-c-txt-oldlace\:55\:dark { color: hsl(39, 85%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:60\:dark, html.var.auto .sf-c-txt-oldlace\:60\:dark { color: hsl(39, 85%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:65\:dark, html.var.auto .sf-c-txt-oldlace\:65\:dark { color: hsl(39, 85%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:70\:dark, html.var.auto .sf-c-txt-oldlace\:70\:dark { color: hsl(39, 85%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:75\:dark, html.var.auto .sf-c-txt-oldlace\:75\:dark { color: hsl(39, 85%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:80\:dark, html.var.auto .sf-c-txt-oldlace\:80\:dark { color: hsl(39, 85%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:85\:dark, html.var.auto .sf-c-txt-oldlace\:85\:dark { color: hsl(39, 85%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:90\:dark, html.var.auto .sf-c-txt-oldlace\:90\:dark { color: hsl(39, 85%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:95\:dark, html.var.auto .sf-c-txt-oldlace\:95\:dark { color: hsl(39, 85%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-oldlace\:100\:dark, html.var.auto .sf-c-txt-oldlace\:100\:dark { color: hsl(39, 85%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/olive.css b/src/colors/20/olive.css index 499ea14..2b73c25 100644 --- a/src/colors/20/olive.css +++ b/src/colors/20/olive.css @@ -1,4 +1,4 @@ -:root { +[class*='olive'] { --sf-c-olive: 60 100% 25%; --sf-c-olive-0: 60 100% 0%; --sf-c-olive-5: 60 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-olive\:100\:dark, html.dark .sf-c-txt-oliv html.var[data-theme='auto'] .sf-c-olive\:95\:dark, html.var.auto .sf-c-olive\:95\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 5%) } html.var[data-theme='auto'] .sf-c-olive\:100\:dark, html.var.auto .sf-c-olive\:100\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive, html.auto .sf-c-txt-olive { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:0, html.auto .sf-c-txt-olive\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:5, html.auto .sf-c-txt-olive\:5 { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:10, html.auto .sf-c-txt-olive\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:15, html.auto .sf-c-txt-olive\:15 { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:20, html.auto .sf-c-txt-olive\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:25, html.auto .sf-c-txt-olive\:25 { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:30, html.auto .sf-c-txt-olive\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:35, html.auto .sf-c-txt-olive\:35 { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:40, html.auto .sf-c-txt-olive\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:45, html.auto .sf-c-txt-olive\:45 { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:50, html.auto .sf-c-txt-olive\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:55, html.auto .sf-c-txt-olive\:55 { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:60, html.auto .sf-c-txt-olive\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:65, html.auto .sf-c-txt-olive\:65 { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:70, html.auto .sf-c-txt-olive\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:75, html.auto .sf-c-txt-olive\:75 { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:80, html.auto .sf-c-txt-olive\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:85, html.auto .sf-c-txt-olive\:85 { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:90, html.auto .sf-c-txt-olive\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:95, html.auto .sf-c-txt-olive\:95 { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:100, html.auto .sf-c-txt-olive\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olive, html.var.auto .sf-c-txt-olive { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:0, html.var.auto .sf-c-txt-olive\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:5, html.var.auto .sf-c-txt-olive\:5 { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:10, html.var.auto .sf-c-txt-olive\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:15, html.var.auto .sf-c-txt-olive\:15 { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:20, html.var.auto .sf-c-txt-olive\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:25, html.var.auto .sf-c-txt-olive\:25 { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:30, html.var.auto .sf-c-txt-olive\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:35, html.var.auto .sf-c-txt-olive\:35 { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:40, html.var.auto .sf-c-txt-olive\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:45, html.var.auto .sf-c-txt-olive\:45 { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:50, html.var.auto .sf-c-txt-olive\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:55, html.var.auto .sf-c-txt-olive\:55 { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:60, html.var.auto .sf-c-txt-olive\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:65, html.var.auto .sf-c-txt-olive\:65 { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:70, html.var.auto .sf-c-txt-olive\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:75, html.var.auto .sf-c-txt-olive\:75 { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:80, html.var.auto .sf-c-txt-olive\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:85, html.var.auto .sf-c-txt-olive\:85 { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:90, html.var.auto .sf-c-txt-olive\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:95, html.var.auto .sf-c-txt-olive\:95 { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:100, html.var.auto .sf-c-txt-olive\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:dark, html.auto .sf-c-txt-olive\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark, html.auto .sf-c-txt-olive\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:5\:dark, html.auto .sf-c-txt-olive\:5\:dark { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark, html.auto .sf-c-txt-olive\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:15\:dark, html.auto .sf-c-txt-olive\:15\:dark { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark, html.auto .sf-c-txt-olive\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:25\:dark, html.auto .sf-c-txt-olive\:25\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark, html.auto .sf-c-txt-olive\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:35\:dark, html.auto .sf-c-txt-olive\:35\:dark { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark, html.auto .sf-c-txt-olive\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:45\:dark, html.auto .sf-c-txt-olive\:45\:dark { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark, html.auto .sf-c-txt-olive\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:55\:dark, html.auto .sf-c-txt-olive\:55\:dark { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark, html.auto .sf-c-txt-olive\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:65\:dark, html.auto .sf-c-txt-olive\:65\:dark { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark, html.auto .sf-c-txt-olive\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:75\:dark, html.auto .sf-c-txt-olive\:75\:dark { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark, html.auto .sf-c-txt-olive\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:85\:dark, html.auto .sf-c-txt-olive\:85\:dark { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark, html.auto .sf-c-txt-olive\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:95\:dark, html.auto .sf-c-txt-olive\:95\:dark { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark, html.auto .sf-c-txt-olive\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:dark, html.var.auto .sf-c-txt-olive\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark, html.var.auto .sf-c-txt-olive\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:5\:dark, html.var.auto .sf-c-txt-olive\:5\:dark { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark, html.var.auto .sf-c-txt-olive\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:15\:dark, html.var.auto .sf-c-txt-olive\:15\:dark { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark, html.var.auto .sf-c-txt-olive\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:25\:dark, html.var.auto .sf-c-txt-olive\:25\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark, html.var.auto .sf-c-txt-olive\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:35\:dark, html.var.auto .sf-c-txt-olive\:35\:dark { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark, html.var.auto .sf-c-txt-olive\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:45\:dark, html.var.auto .sf-c-txt-olive\:45\:dark { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark, html.var.auto .sf-c-txt-olive\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:55\:dark, html.var.auto .sf-c-txt-olive\:55\:dark { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark, html.var.auto .sf-c-txt-olive\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:65\:dark, html.var.auto .sf-c-txt-olive\:65\:dark { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark, html.var.auto .sf-c-txt-olive\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:75\:dark, html.var.auto .sf-c-txt-olive\:75\:dark { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark, html.var.auto .sf-c-txt-olive\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:85\:dark, html.var.auto .sf-c-txt-olive\:85\:dark { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark, html.var.auto .sf-c-txt-olive\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:95\:dark, html.var.auto .sf-c-txt-olive\:95\:dark { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark, html.var.auto .sf-c-txt-olive\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/olivedrab.css b/src/colors/20/olivedrab.css index e2b7423..fe60b90 100644 --- a/src/colors/20/olivedrab.css +++ b/src/colors/20/olivedrab.css @@ -1,4 +1,4 @@ -:root { +[class*='olivedrab'] { --sf-c-olivedrab: 80 60% 35%; --sf-c-olivedrab-0: 80 60% 0%; --sf-c-olivedrab-5: 80 60% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-olivedrab\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-olivedrab\:95\:dark, html.var.auto .sf-c-olivedrab\:95\:dark { color: hsl(80, 60%, 95%); background: hsl(80, 60%, 5%) } html.var[data-theme='auto'] .sf-c-olivedrab\:100\:dark, html.var.auto .sf-c-olivedrab\:100\:dark { color: hsl(80, 60%, 95%); background: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab, html.auto .sf-c-txt-olivedrab { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0, html.auto .sf-c-txt-olivedrab\:0 { color: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:5, html.auto .sf-c-txt-olivedrab\:5 { color: hsl(80, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10, html.auto .sf-c-txt-olivedrab\:10 { color: hsl(80, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:15, html.auto .sf-c-txt-olivedrab\:15 { color: hsl(80, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20, html.auto .sf-c-txt-olivedrab\:20 { color: hsl(80, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:25, html.auto .sf-c-txt-olivedrab\:25 { color: hsl(80, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30, html.auto .sf-c-txt-olivedrab\:30 { color: hsl(80, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:35, html.auto .sf-c-txt-olivedrab\:35 { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40, html.auto .sf-c-txt-olivedrab\:40 { color: hsl(80, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:45, html.auto .sf-c-txt-olivedrab\:45 { color: hsl(80, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50, html.auto .sf-c-txt-olivedrab\:50 { color: hsl(80, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:55, html.auto .sf-c-txt-olivedrab\:55 { color: hsl(80, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60, html.auto .sf-c-txt-olivedrab\:60 { color: hsl(80, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:65, html.auto .sf-c-txt-olivedrab\:65 { color: hsl(80, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70, html.auto .sf-c-txt-olivedrab\:70 { color: hsl(80, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:75, html.auto .sf-c-txt-olivedrab\:75 { color: hsl(80, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80, html.auto .sf-c-txt-olivedrab\:80 { color: hsl(80, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:85, html.auto .sf-c-txt-olivedrab\:85 { color: hsl(80, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90, html.auto .sf-c-txt-olivedrab\:90 { color: hsl(80, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:95, html.auto .sf-c-txt-olivedrab\:95 { color: hsl(80, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100, html.auto .sf-c-txt-olivedrab\:100 { color: hsl(80, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab, html.var.auto .sf-c-txt-olivedrab { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0, html.var.auto .sf-c-txt-olivedrab\:0 { color: hsl(80, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:5, html.var.auto .sf-c-txt-olivedrab\:5 { color: hsl(80, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10, html.var.auto .sf-c-txt-olivedrab\:10 { color: hsl(80, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:15, html.var.auto .sf-c-txt-olivedrab\:15 { color: hsl(80, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20, html.var.auto .sf-c-txt-olivedrab\:20 { color: hsl(80, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:25, html.var.auto .sf-c-txt-olivedrab\:25 { color: hsl(80, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30, html.var.auto .sf-c-txt-olivedrab\:30 { color: hsl(80, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:35, html.var.auto .sf-c-txt-olivedrab\:35 { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40, html.var.auto .sf-c-txt-olivedrab\:40 { color: hsl(80, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:45, html.var.auto .sf-c-txt-olivedrab\:45 { color: hsl(80, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50, html.var.auto .sf-c-txt-olivedrab\:50 { color: hsl(80, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:55, html.var.auto .sf-c-txt-olivedrab\:55 { color: hsl(80, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60, html.var.auto .sf-c-txt-olivedrab\:60 { color: hsl(80, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:65, html.var.auto .sf-c-txt-olivedrab\:65 { color: hsl(80, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70, html.var.auto .sf-c-txt-olivedrab\:70 { color: hsl(80, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:75, html.var.auto .sf-c-txt-olivedrab\:75 { color: hsl(80, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80, html.var.auto .sf-c-txt-olivedrab\:80 { color: hsl(80, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:85, html.var.auto .sf-c-txt-olivedrab\:85 { color: hsl(80, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90, html.var.auto .sf-c-txt-olivedrab\:90 { color: hsl(80, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:95, html.var.auto .sf-c-txt-olivedrab\:95 { color: hsl(80, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100, html.var.auto .sf-c-txt-olivedrab\:100 { color: hsl(80, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:dark, html.auto .sf-c-txt-olivedrab\:dark { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0\:dark, html.auto .sf-c-txt-olivedrab\:0\:dark { color: hsl(80, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:5\:dark, html.auto .sf-c-txt-olivedrab\:5\:dark { color: hsl(80, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10\:dark, html.auto .sf-c-txt-olivedrab\:10\:dark { color: hsl(80, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:15\:dark, html.auto .sf-c-txt-olivedrab\:15\:dark { color: hsl(80, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20\:dark, html.auto .sf-c-txt-olivedrab\:20\:dark { color: hsl(80, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:25\:dark, html.auto .sf-c-txt-olivedrab\:25\:dark { color: hsl(80, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30\:dark, html.auto .sf-c-txt-olivedrab\:30\:dark { color: hsl(80, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:35\:dark, html.auto .sf-c-txt-olivedrab\:35\:dark { color: hsl(80, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40\:dark, html.auto .sf-c-txt-olivedrab\:40\:dark { color: hsl(80, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:45\:dark, html.auto .sf-c-txt-olivedrab\:45\:dark { color: hsl(80, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50\:dark, html.auto .sf-c-txt-olivedrab\:50\:dark { color: hsl(80, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:55\:dark, html.auto .sf-c-txt-olivedrab\:55\:dark { color: hsl(80, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60\:dark, html.auto .sf-c-txt-olivedrab\:60\:dark { color: hsl(80, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:65\:dark, html.auto .sf-c-txt-olivedrab\:65\:dark { color: hsl(80, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70\:dark, html.auto .sf-c-txt-olivedrab\:70\:dark { color: hsl(80, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:75\:dark, html.auto .sf-c-txt-olivedrab\:75\:dark { color: hsl(80, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80\:dark, html.auto .sf-c-txt-olivedrab\:80\:dark { color: hsl(80, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:85\:dark, html.auto .sf-c-txt-olivedrab\:85\:dark { color: hsl(80, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90\:dark, html.auto .sf-c-txt-olivedrab\:90\:dark { color: hsl(80, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:95\:dark, html.auto .sf-c-txt-olivedrab\:95\:dark { color: hsl(80, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100\:dark, html.auto .sf-c-txt-olivedrab\:100\:dark { color: hsl(80, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:dark, html.var.auto .sf-c-txt-olivedrab\:dark { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:0\:dark, html.var.auto .sf-c-txt-olivedrab\:0\:dark { color: hsl(80, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:5\:dark, html.var.auto .sf-c-txt-olivedrab\:5\:dark { color: hsl(80, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:10\:dark, html.var.auto .sf-c-txt-olivedrab\:10\:dark { color: hsl(80, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:15\:dark, html.var.auto .sf-c-txt-olivedrab\:15\:dark { color: hsl(80, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:20\:dark, html.var.auto .sf-c-txt-olivedrab\:20\:dark { color: hsl(80, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:25\:dark, html.var.auto .sf-c-txt-olivedrab\:25\:dark { color: hsl(80, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:30\:dark, html.var.auto .sf-c-txt-olivedrab\:30\:dark { color: hsl(80, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:35\:dark, html.var.auto .sf-c-txt-olivedrab\:35\:dark { color: hsl(80, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:40\:dark, html.var.auto .sf-c-txt-olivedrab\:40\:dark { color: hsl(80, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:45\:dark, html.var.auto .sf-c-txt-olivedrab\:45\:dark { color: hsl(80, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:50\:dark, html.var.auto .sf-c-txt-olivedrab\:50\:dark { color: hsl(80, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:55\:dark, html.var.auto .sf-c-txt-olivedrab\:55\:dark { color: hsl(80, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:60\:dark, html.var.auto .sf-c-txt-olivedrab\:60\:dark { color: hsl(80, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:65\:dark, html.var.auto .sf-c-txt-olivedrab\:65\:dark { color: hsl(80, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:70\:dark, html.var.auto .sf-c-txt-olivedrab\:70\:dark { color: hsl(80, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:75\:dark, html.var.auto .sf-c-txt-olivedrab\:75\:dark { color: hsl(80, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:80\:dark, html.var.auto .sf-c-txt-olivedrab\:80\:dark { color: hsl(80, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:85\:dark, html.var.auto .sf-c-txt-olivedrab\:85\:dark { color: hsl(80, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:90\:dark, html.var.auto .sf-c-txt-olivedrab\:90\:dark { color: hsl(80, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:95\:dark, html.var.auto .sf-c-txt-olivedrab\:95\:dark { color: hsl(80, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-olivedrab\:100\:dark, html.var.auto .sf-c-txt-olivedrab\:100\:dark { color: hsl(80, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/orange.css b/src/colors/20/orange.css index 0d16d49..a786b77 100644 --- a/src/colors/20/orange.css +++ b/src/colors/20/orange.css @@ -1,4 +1,4 @@ -:root { +[class*='orange'] { --sf-c-orange: 39 100% 50%; --sf-c-orange-0: 39 100% 0%; --sf-c-orange-5: 39 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-orange\:100\:dark, html.dark .sf-c-txt-ora html.var[data-theme='auto'] .sf-c-orange\:95\:dark, html.var.auto .sf-c-orange\:95\:dark { color: hsl(39, 100%, 95%); background: hsl(39, 100%, 5%) } html.var[data-theme='auto'] .sf-c-orange\:100\:dark, html.var.auto .sf-c-orange\:100\:dark { color: hsl(39, 100%, 95%); background: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange, html.auto .sf-c-txt-orange { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:0, html.auto .sf-c-txt-orange\:0 { color: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:5, html.auto .sf-c-txt-orange\:5 { color: hsl(39, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:10, html.auto .sf-c-txt-orange\:10 { color: hsl(39, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:15, html.auto .sf-c-txt-orange\:15 { color: hsl(39, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:20, html.auto .sf-c-txt-orange\:20 { color: hsl(39, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:25, html.auto .sf-c-txt-orange\:25 { color: hsl(39, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:30, html.auto .sf-c-txt-orange\:30 { color: hsl(39, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:35, html.auto .sf-c-txt-orange\:35 { color: hsl(39, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:40, html.auto .sf-c-txt-orange\:40 { color: hsl(39, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:45, html.auto .sf-c-txt-orange\:45 { color: hsl(39, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:50, html.auto .sf-c-txt-orange\:50 { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:55, html.auto .sf-c-txt-orange\:55 { color: hsl(39, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:60, html.auto .sf-c-txt-orange\:60 { color: hsl(39, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:65, html.auto .sf-c-txt-orange\:65 { color: hsl(39, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:70, html.auto .sf-c-txt-orange\:70 { color: hsl(39, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:75, html.auto .sf-c-txt-orange\:75 { color: hsl(39, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:80, html.auto .sf-c-txt-orange\:80 { color: hsl(39, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:85, html.auto .sf-c-txt-orange\:85 { color: hsl(39, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:90, html.auto .sf-c-txt-orange\:90 { color: hsl(39, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:95, html.auto .sf-c-txt-orange\:95 { color: hsl(39, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:100, html.auto .sf-c-txt-orange\:100 { color: hsl(39, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orange, html.var.auto .sf-c-txt-orange { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:0, html.var.auto .sf-c-txt-orange\:0 { color: hsl(39, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:5, html.var.auto .sf-c-txt-orange\:5 { color: hsl(39, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:10, html.var.auto .sf-c-txt-orange\:10 { color: hsl(39, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:15, html.var.auto .sf-c-txt-orange\:15 { color: hsl(39, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:20, html.var.auto .sf-c-txt-orange\:20 { color: hsl(39, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:25, html.var.auto .sf-c-txt-orange\:25 { color: hsl(39, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:30, html.var.auto .sf-c-txt-orange\:30 { color: hsl(39, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:35, html.var.auto .sf-c-txt-orange\:35 { color: hsl(39, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:40, html.var.auto .sf-c-txt-orange\:40 { color: hsl(39, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:45, html.var.auto .sf-c-txt-orange\:45 { color: hsl(39, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:50, html.var.auto .sf-c-txt-orange\:50 { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:55, html.var.auto .sf-c-txt-orange\:55 { color: hsl(39, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:60, html.var.auto .sf-c-txt-orange\:60 { color: hsl(39, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:65, html.var.auto .sf-c-txt-orange\:65 { color: hsl(39, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:70, html.var.auto .sf-c-txt-orange\:70 { color: hsl(39, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:75, html.var.auto .sf-c-txt-orange\:75 { color: hsl(39, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:80, html.var.auto .sf-c-txt-orange\:80 { color: hsl(39, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:85, html.var.auto .sf-c-txt-orange\:85 { color: hsl(39, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:90, html.var.auto .sf-c-txt-orange\:90 { color: hsl(39, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:95, html.var.auto .sf-c-txt-orange\:95 { color: hsl(39, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:100, html.var.auto .sf-c-txt-orange\:100 { color: hsl(39, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:dark, html.auto .sf-c-txt-orange\:dark { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark, html.auto .sf-c-txt-orange\:0\:dark { color: hsl(39, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:5\:dark, html.auto .sf-c-txt-orange\:5\:dark { color: hsl(39, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark, html.auto .sf-c-txt-orange\:10\:dark { color: hsl(39, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:15\:dark, html.auto .sf-c-txt-orange\:15\:dark { color: hsl(39, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark, html.auto .sf-c-txt-orange\:20\:dark { color: hsl(39, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:25\:dark, html.auto .sf-c-txt-orange\:25\:dark { color: hsl(39, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark, html.auto .sf-c-txt-orange\:30\:dark { color: hsl(39, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:35\:dark, html.auto .sf-c-txt-orange\:35\:dark { color: hsl(39, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark, html.auto .sf-c-txt-orange\:40\:dark { color: hsl(39, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:45\:dark, html.auto .sf-c-txt-orange\:45\:dark { color: hsl(39, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark, html.auto .sf-c-txt-orange\:50\:dark { color: hsl(39, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:55\:dark, html.auto .sf-c-txt-orange\:55\:dark { color: hsl(39, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark, html.auto .sf-c-txt-orange\:60\:dark { color: hsl(39, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:65\:dark, html.auto .sf-c-txt-orange\:65\:dark { color: hsl(39, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark, html.auto .sf-c-txt-orange\:70\:dark { color: hsl(39, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:75\:dark, html.auto .sf-c-txt-orange\:75\:dark { color: hsl(39, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark, html.auto .sf-c-txt-orange\:80\:dark { color: hsl(39, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:85\:dark, html.auto .sf-c-txt-orange\:85\:dark { color: hsl(39, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark, html.auto .sf-c-txt-orange\:90\:dark { color: hsl(39, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:95\:dark, html.auto .sf-c-txt-orange\:95\:dark { color: hsl(39, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark, html.auto .sf-c-txt-orange\:100\:dark { color: hsl(39, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:dark, html.var.auto .sf-c-txt-orange\:dark { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:0\:dark, html.var.auto .sf-c-txt-orange\:0\:dark { color: hsl(39, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:5\:dark, html.var.auto .sf-c-txt-orange\:5\:dark { color: hsl(39, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:10\:dark, html.var.auto .sf-c-txt-orange\:10\:dark { color: hsl(39, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:15\:dark, html.var.auto .sf-c-txt-orange\:15\:dark { color: hsl(39, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:20\:dark, html.var.auto .sf-c-txt-orange\:20\:dark { color: hsl(39, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:25\:dark, html.var.auto .sf-c-txt-orange\:25\:dark { color: hsl(39, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:30\:dark, html.var.auto .sf-c-txt-orange\:30\:dark { color: hsl(39, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:35\:dark, html.var.auto .sf-c-txt-orange\:35\:dark { color: hsl(39, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:40\:dark, html.var.auto .sf-c-txt-orange\:40\:dark { color: hsl(39, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:45\:dark, html.var.auto .sf-c-txt-orange\:45\:dark { color: hsl(39, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:50\:dark, html.var.auto .sf-c-txt-orange\:50\:dark { color: hsl(39, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:55\:dark, html.var.auto .sf-c-txt-orange\:55\:dark { color: hsl(39, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:60\:dark, html.var.auto .sf-c-txt-orange\:60\:dark { color: hsl(39, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:65\:dark, html.var.auto .sf-c-txt-orange\:65\:dark { color: hsl(39, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:70\:dark, html.var.auto .sf-c-txt-orange\:70\:dark { color: hsl(39, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:75\:dark, html.var.auto .sf-c-txt-orange\:75\:dark { color: hsl(39, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:80\:dark, html.var.auto .sf-c-txt-orange\:80\:dark { color: hsl(39, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:85\:dark, html.var.auto .sf-c-txt-orange\:85\:dark { color: hsl(39, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:90\:dark, html.var.auto .sf-c-txt-orange\:90\:dark { color: hsl(39, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:95\:dark, html.var.auto .sf-c-txt-orange\:95\:dark { color: hsl(39, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orange\:100\:dark, html.var.auto .sf-c-txt-orange\:100\:dark { color: hsl(39, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/orangered.css b/src/colors/20/orangered.css index 73b3f44..13d1303 100644 --- a/src/colors/20/orangered.css +++ b/src/colors/20/orangered.css @@ -1,4 +1,4 @@ -:root { +[class*='orangered'] { --sf-c-orangered: 16 100% 50%; --sf-c-orangered-0: 16 100% 0%; --sf-c-orangered-5: 16 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-orangered\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-orangered\:95\:dark, html.var.auto .sf-c-orangered\:95\:dark { color: hsl(16, 100%, 95%); background: hsl(16, 100%, 5%) } html.var[data-theme='auto'] .sf-c-orangered\:100\:dark, html.var.auto .sf-c-orangered\:100\:dark { color: hsl(16, 100%, 95%); background: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered, html.auto .sf-c-txt-orangered { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:0, html.auto .sf-c-txt-orangered\:0 { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:5, html.auto .sf-c-txt-orangered\:5 { color: hsl(16, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:10, html.auto .sf-c-txt-orangered\:10 { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:15, html.auto .sf-c-txt-orangered\:15 { color: hsl(16, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:20, html.auto .sf-c-txt-orangered\:20 { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:25, html.auto .sf-c-txt-orangered\:25 { color: hsl(16, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:30, html.auto .sf-c-txt-orangered\:30 { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:35, html.auto .sf-c-txt-orangered\:35 { color: hsl(16, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:40, html.auto .sf-c-txt-orangered\:40 { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:45, html.auto .sf-c-txt-orangered\:45 { color: hsl(16, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:50, html.auto .sf-c-txt-orangered\:50 { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:55, html.auto .sf-c-txt-orangered\:55 { color: hsl(16, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:60, html.auto .sf-c-txt-orangered\:60 { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:65, html.auto .sf-c-txt-orangered\:65 { color: hsl(16, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:70, html.auto .sf-c-txt-orangered\:70 { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:75, html.auto .sf-c-txt-orangered\:75 { color: hsl(16, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:80, html.auto .sf-c-txt-orangered\:80 { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:85, html.auto .sf-c-txt-orangered\:85 { color: hsl(16, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:90, html.auto .sf-c-txt-orangered\:90 { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:95, html.auto .sf-c-txt-orangered\:95 { color: hsl(16, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:100, html.auto .sf-c-txt-orangered\:100 { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orangered, html.var.auto .sf-c-txt-orangered { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:0, html.var.auto .sf-c-txt-orangered\:0 { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:5, html.var.auto .sf-c-txt-orangered\:5 { color: hsl(16, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:10, html.var.auto .sf-c-txt-orangered\:10 { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:15, html.var.auto .sf-c-txt-orangered\:15 { color: hsl(16, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:20, html.var.auto .sf-c-txt-orangered\:20 { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:25, html.var.auto .sf-c-txt-orangered\:25 { color: hsl(16, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:30, html.var.auto .sf-c-txt-orangered\:30 { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:35, html.var.auto .sf-c-txt-orangered\:35 { color: hsl(16, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:40, html.var.auto .sf-c-txt-orangered\:40 { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:45, html.var.auto .sf-c-txt-orangered\:45 { color: hsl(16, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:50, html.var.auto .sf-c-txt-orangered\:50 { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:55, html.var.auto .sf-c-txt-orangered\:55 { color: hsl(16, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:60, html.var.auto .sf-c-txt-orangered\:60 { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:65, html.var.auto .sf-c-txt-orangered\:65 { color: hsl(16, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:70, html.var.auto .sf-c-txt-orangered\:70 { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:75, html.var.auto .sf-c-txt-orangered\:75 { color: hsl(16, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:80, html.var.auto .sf-c-txt-orangered\:80 { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:85, html.var.auto .sf-c-txt-orangered\:85 { color: hsl(16, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:90, html.var.auto .sf-c-txt-orangered\:90 { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:95, html.var.auto .sf-c-txt-orangered\:95 { color: hsl(16, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:100, html.var.auto .sf-c-txt-orangered\:100 { color: hsl(16, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:dark, html.auto .sf-c-txt-orangered\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:0\:dark, html.auto .sf-c-txt-orangered\:0\:dark { color: hsl(16, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:5\:dark, html.auto .sf-c-txt-orangered\:5\:dark { color: hsl(16, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:10\:dark, html.auto .sf-c-txt-orangered\:10\:dark { color: hsl(16, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:15\:dark, html.auto .sf-c-txt-orangered\:15\:dark { color: hsl(16, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:20\:dark, html.auto .sf-c-txt-orangered\:20\:dark { color: hsl(16, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:25\:dark, html.auto .sf-c-txt-orangered\:25\:dark { color: hsl(16, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:30\:dark, html.auto .sf-c-txt-orangered\:30\:dark { color: hsl(16, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:35\:dark, html.auto .sf-c-txt-orangered\:35\:dark { color: hsl(16, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:40\:dark, html.auto .sf-c-txt-orangered\:40\:dark { color: hsl(16, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:45\:dark, html.auto .sf-c-txt-orangered\:45\:dark { color: hsl(16, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:50\:dark, html.auto .sf-c-txt-orangered\:50\:dark { color: hsl(16, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:55\:dark, html.auto .sf-c-txt-orangered\:55\:dark { color: hsl(16, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:60\:dark, html.auto .sf-c-txt-orangered\:60\:dark { color: hsl(16, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:65\:dark, html.auto .sf-c-txt-orangered\:65\:dark { color: hsl(16, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:70\:dark, html.auto .sf-c-txt-orangered\:70\:dark { color: hsl(16, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:75\:dark, html.auto .sf-c-txt-orangered\:75\:dark { color: hsl(16, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:80\:dark, html.auto .sf-c-txt-orangered\:80\:dark { color: hsl(16, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:85\:dark, html.auto .sf-c-txt-orangered\:85\:dark { color: hsl(16, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:90\:dark, html.auto .sf-c-txt-orangered\:90\:dark { color: hsl(16, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:95\:dark, html.auto .sf-c-txt-orangered\:95\:dark { color: hsl(16, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orangered\:100\:dark, html.auto .sf-c-txt-orangered\:100\:dark { color: hsl(16, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:dark, html.var.auto .sf-c-txt-orangered\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:0\:dark, html.var.auto .sf-c-txt-orangered\:0\:dark { color: hsl(16, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:5\:dark, html.var.auto .sf-c-txt-orangered\:5\:dark { color: hsl(16, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:10\:dark, html.var.auto .sf-c-txt-orangered\:10\:dark { color: hsl(16, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:15\:dark, html.var.auto .sf-c-txt-orangered\:15\:dark { color: hsl(16, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:20\:dark, html.var.auto .sf-c-txt-orangered\:20\:dark { color: hsl(16, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:25\:dark, html.var.auto .sf-c-txt-orangered\:25\:dark { color: hsl(16, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:30\:dark, html.var.auto .sf-c-txt-orangered\:30\:dark { color: hsl(16, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:35\:dark, html.var.auto .sf-c-txt-orangered\:35\:dark { color: hsl(16, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:40\:dark, html.var.auto .sf-c-txt-orangered\:40\:dark { color: hsl(16, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:45\:dark, html.var.auto .sf-c-txt-orangered\:45\:dark { color: hsl(16, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:50\:dark, html.var.auto .sf-c-txt-orangered\:50\:dark { color: hsl(16, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:55\:dark, html.var.auto .sf-c-txt-orangered\:55\:dark { color: hsl(16, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:60\:dark, html.var.auto .sf-c-txt-orangered\:60\:dark { color: hsl(16, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:65\:dark, html.var.auto .sf-c-txt-orangered\:65\:dark { color: hsl(16, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:70\:dark, html.var.auto .sf-c-txt-orangered\:70\:dark { color: hsl(16, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:75\:dark, html.var.auto .sf-c-txt-orangered\:75\:dark { color: hsl(16, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:80\:dark, html.var.auto .sf-c-txt-orangered\:80\:dark { color: hsl(16, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:85\:dark, html.var.auto .sf-c-txt-orangered\:85\:dark { color: hsl(16, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:90\:dark, html.var.auto .sf-c-txt-orangered\:90\:dark { color: hsl(16, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:95\:dark, html.var.auto .sf-c-txt-orangered\:95\:dark { color: hsl(16, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orangered\:100\:dark, html.var.auto .sf-c-txt-orangered\:100\:dark { color: hsl(16, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/orchid.css b/src/colors/20/orchid.css index bf23e34..f1708c3 100644 --- a/src/colors/20/orchid.css +++ b/src/colors/20/orchid.css @@ -1,4 +1,4 @@ -:root { +[class*='orchid'] { --sf-c-orchid: 302 59% 65%; --sf-c-orchid-0: 302 59% 0%; --sf-c-orchid-5: 302 59% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-orchid\:100\:dark, html.dark .sf-c-txt-orc html.var[data-theme='auto'] .sf-c-orchid\:95\:dark, html.var.auto .sf-c-orchid\:95\:dark { color: hsl(302, 59%, 95%); background: hsl(302, 59%, 5%) } html.var[data-theme='auto'] .sf-c-orchid\:100\:dark, html.var.auto .sf-c-orchid\:100\:dark { color: hsl(302, 59%, 95%); background: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid, html.auto .sf-c-txt-orchid { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:0, html.auto .sf-c-txt-orchid\:0 { color: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:5, html.auto .sf-c-txt-orchid\:5 { color: hsl(302, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:10, html.auto .sf-c-txt-orchid\:10 { color: hsl(302, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:15, html.auto .sf-c-txt-orchid\:15 { color: hsl(302, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:20, html.auto .sf-c-txt-orchid\:20 { color: hsl(302, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:25, html.auto .sf-c-txt-orchid\:25 { color: hsl(302, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:30, html.auto .sf-c-txt-orchid\:30 { color: hsl(302, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:35, html.auto .sf-c-txt-orchid\:35 { color: hsl(302, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:40, html.auto .sf-c-txt-orchid\:40 { color: hsl(302, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:45, html.auto .sf-c-txt-orchid\:45 { color: hsl(302, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:50, html.auto .sf-c-txt-orchid\:50 { color: hsl(302, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:55, html.auto .sf-c-txt-orchid\:55 { color: hsl(302, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:60, html.auto .sf-c-txt-orchid\:60 { color: hsl(302, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:65, html.auto .sf-c-txt-orchid\:65 { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:70, html.auto .sf-c-txt-orchid\:70 { color: hsl(302, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:75, html.auto .sf-c-txt-orchid\:75 { color: hsl(302, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:80, html.auto .sf-c-txt-orchid\:80 { color: hsl(302, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:85, html.auto .sf-c-txt-orchid\:85 { color: hsl(302, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:90, html.auto .sf-c-txt-orchid\:90 { color: hsl(302, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:95, html.auto .sf-c-txt-orchid\:95 { color: hsl(302, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:100, html.auto .sf-c-txt-orchid\:100 { color: hsl(302, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orchid, html.var.auto .sf-c-txt-orchid { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:0, html.var.auto .sf-c-txt-orchid\:0 { color: hsl(302, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:5, html.var.auto .sf-c-txt-orchid\:5 { color: hsl(302, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:10, html.var.auto .sf-c-txt-orchid\:10 { color: hsl(302, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:15, html.var.auto .sf-c-txt-orchid\:15 { color: hsl(302, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:20, html.var.auto .sf-c-txt-orchid\:20 { color: hsl(302, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:25, html.var.auto .sf-c-txt-orchid\:25 { color: hsl(302, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:30, html.var.auto .sf-c-txt-orchid\:30 { color: hsl(302, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:35, html.var.auto .sf-c-txt-orchid\:35 { color: hsl(302, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:40, html.var.auto .sf-c-txt-orchid\:40 { color: hsl(302, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:45, html.var.auto .sf-c-txt-orchid\:45 { color: hsl(302, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:50, html.var.auto .sf-c-txt-orchid\:50 { color: hsl(302, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:55, html.var.auto .sf-c-txt-orchid\:55 { color: hsl(302, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:60, html.var.auto .sf-c-txt-orchid\:60 { color: hsl(302, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:65, html.var.auto .sf-c-txt-orchid\:65 { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:70, html.var.auto .sf-c-txt-orchid\:70 { color: hsl(302, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:75, html.var.auto .sf-c-txt-orchid\:75 { color: hsl(302, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:80, html.var.auto .sf-c-txt-orchid\:80 { color: hsl(302, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:85, html.var.auto .sf-c-txt-orchid\:85 { color: hsl(302, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:90, html.var.auto .sf-c-txt-orchid\:90 { color: hsl(302, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:95, html.var.auto .sf-c-txt-orchid\:95 { color: hsl(302, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:100, html.var.auto .sf-c-txt-orchid\:100 { color: hsl(302, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:dark, html.auto .sf-c-txt-orchid\:dark { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:0\:dark, html.auto .sf-c-txt-orchid\:0\:dark { color: hsl(302, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:5\:dark, html.auto .sf-c-txt-orchid\:5\:dark { color: hsl(302, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:10\:dark, html.auto .sf-c-txt-orchid\:10\:dark { color: hsl(302, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:15\:dark, html.auto .sf-c-txt-orchid\:15\:dark { color: hsl(302, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:20\:dark, html.auto .sf-c-txt-orchid\:20\:dark { color: hsl(302, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:25\:dark, html.auto .sf-c-txt-orchid\:25\:dark { color: hsl(302, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:30\:dark, html.auto .sf-c-txt-orchid\:30\:dark { color: hsl(302, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:35\:dark, html.auto .sf-c-txt-orchid\:35\:dark { color: hsl(302, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:40\:dark, html.auto .sf-c-txt-orchid\:40\:dark { color: hsl(302, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:45\:dark, html.auto .sf-c-txt-orchid\:45\:dark { color: hsl(302, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:50\:dark, html.auto .sf-c-txt-orchid\:50\:dark { color: hsl(302, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:55\:dark, html.auto .sf-c-txt-orchid\:55\:dark { color: hsl(302, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:60\:dark, html.auto .sf-c-txt-orchid\:60\:dark { color: hsl(302, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:65\:dark, html.auto .sf-c-txt-orchid\:65\:dark { color: hsl(302, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:70\:dark, html.auto .sf-c-txt-orchid\:70\:dark { color: hsl(302, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:75\:dark, html.auto .sf-c-txt-orchid\:75\:dark { color: hsl(302, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:80\:dark, html.auto .sf-c-txt-orchid\:80\:dark { color: hsl(302, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:85\:dark, html.auto .sf-c-txt-orchid\:85\:dark { color: hsl(302, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:90\:dark, html.auto .sf-c-txt-orchid\:90\:dark { color: hsl(302, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:95\:dark, html.auto .sf-c-txt-orchid\:95\:dark { color: hsl(302, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-orchid\:100\:dark, html.auto .sf-c-txt-orchid\:100\:dark { color: hsl(302, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:dark, html.var.auto .sf-c-txt-orchid\:dark { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:0\:dark, html.var.auto .sf-c-txt-orchid\:0\:dark { color: hsl(302, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:5\:dark, html.var.auto .sf-c-txt-orchid\:5\:dark { color: hsl(302, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:10\:dark, html.var.auto .sf-c-txt-orchid\:10\:dark { color: hsl(302, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:15\:dark, html.var.auto .sf-c-txt-orchid\:15\:dark { color: hsl(302, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:20\:dark, html.var.auto .sf-c-txt-orchid\:20\:dark { color: hsl(302, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:25\:dark, html.var.auto .sf-c-txt-orchid\:25\:dark { color: hsl(302, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:30\:dark, html.var.auto .sf-c-txt-orchid\:30\:dark { color: hsl(302, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:35\:dark, html.var.auto .sf-c-txt-orchid\:35\:dark { color: hsl(302, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:40\:dark, html.var.auto .sf-c-txt-orchid\:40\:dark { color: hsl(302, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:45\:dark, html.var.auto .sf-c-txt-orchid\:45\:dark { color: hsl(302, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:50\:dark, html.var.auto .sf-c-txt-orchid\:50\:dark { color: hsl(302, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:55\:dark, html.var.auto .sf-c-txt-orchid\:55\:dark { color: hsl(302, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:60\:dark, html.var.auto .sf-c-txt-orchid\:60\:dark { color: hsl(302, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:65\:dark, html.var.auto .sf-c-txt-orchid\:65\:dark { color: hsl(302, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:70\:dark, html.var.auto .sf-c-txt-orchid\:70\:dark { color: hsl(302, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:75\:dark, html.var.auto .sf-c-txt-orchid\:75\:dark { color: hsl(302, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:80\:dark, html.var.auto .sf-c-txt-orchid\:80\:dark { color: hsl(302, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:85\:dark, html.var.auto .sf-c-txt-orchid\:85\:dark { color: hsl(302, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:90\:dark, html.var.auto .sf-c-txt-orchid\:90\:dark { color: hsl(302, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:95\:dark, html.var.auto .sf-c-txt-orchid\:95\:dark { color: hsl(302, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-orchid\:100\:dark, html.var.auto .sf-c-txt-orchid\:100\:dark { color: hsl(302, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/palegoldenrod.css b/src/colors/20/palegoldenrod.css index 5ab3509..b32aa23 100644 --- a/src/colors/20/palegoldenrod.css +++ b/src/colors/20/palegoldenrod.css @@ -1,4 +1,4 @@ -:root { +[class*='palegoldenrod'] { --sf-c-palegoldenrod: 55 67% 80%; --sf-c-palegoldenrod-0: 55 67% 0%; --sf-c-palegoldenrod-5: 55 67% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-palegoldenrod\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-palegoldenrod\:95\:dark, html.var.auto .sf-c-palegoldenrod\:95\:dark { color: hsl(55, 67%, 95%); background: hsl(55, 67%, 5%) } html.var[data-theme='auto'] .sf-c-palegoldenrod\:100\:dark, html.var.auto .sf-c-palegoldenrod\:100\:dark { color: hsl(55, 67%, 95%); background: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod, html.auto .sf-c-txt-palegoldenrod { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0, html.auto .sf-c-txt-palegoldenrod\:0 { color: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:5, html.auto .sf-c-txt-palegoldenrod\:5 { color: hsl(55, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10, html.auto .sf-c-txt-palegoldenrod\:10 { color: hsl(55, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:15, html.auto .sf-c-txt-palegoldenrod\:15 { color: hsl(55, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20, html.auto .sf-c-txt-palegoldenrod\:20 { color: hsl(55, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:25, html.auto .sf-c-txt-palegoldenrod\:25 { color: hsl(55, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30, html.auto .sf-c-txt-palegoldenrod\:30 { color: hsl(55, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:35, html.auto .sf-c-txt-palegoldenrod\:35 { color: hsl(55, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40, html.auto .sf-c-txt-palegoldenrod\:40 { color: hsl(55, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:45, html.auto .sf-c-txt-palegoldenrod\:45 { color: hsl(55, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50, html.auto .sf-c-txt-palegoldenrod\:50 { color: hsl(55, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:55, html.auto .sf-c-txt-palegoldenrod\:55 { color: hsl(55, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60, html.auto .sf-c-txt-palegoldenrod\:60 { color: hsl(55, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:65, html.auto .sf-c-txt-palegoldenrod\:65 { color: hsl(55, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70, html.auto .sf-c-txt-palegoldenrod\:70 { color: hsl(55, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:75, html.auto .sf-c-txt-palegoldenrod\:75 { color: hsl(55, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80, html.auto .sf-c-txt-palegoldenrod\:80 { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:85, html.auto .sf-c-txt-palegoldenrod\:85 { color: hsl(55, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90, html.auto .sf-c-txt-palegoldenrod\:90 { color: hsl(55, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:95, html.auto .sf-c-txt-palegoldenrod\:95 { color: hsl(55, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100, html.auto .sf-c-txt-palegoldenrod\:100 { color: hsl(55, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod, html.var.auto .sf-c-txt-palegoldenrod { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0, html.var.auto .sf-c-txt-palegoldenrod\:0 { color: hsl(55, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:5, html.var.auto .sf-c-txt-palegoldenrod\:5 { color: hsl(55, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10, html.var.auto .sf-c-txt-palegoldenrod\:10 { color: hsl(55, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:15, html.var.auto .sf-c-txt-palegoldenrod\:15 { color: hsl(55, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20, html.var.auto .sf-c-txt-palegoldenrod\:20 { color: hsl(55, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:25, html.var.auto .sf-c-txt-palegoldenrod\:25 { color: hsl(55, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30, html.var.auto .sf-c-txt-palegoldenrod\:30 { color: hsl(55, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:35, html.var.auto .sf-c-txt-palegoldenrod\:35 { color: hsl(55, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40, html.var.auto .sf-c-txt-palegoldenrod\:40 { color: hsl(55, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:45, html.var.auto .sf-c-txt-palegoldenrod\:45 { color: hsl(55, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50, html.var.auto .sf-c-txt-palegoldenrod\:50 { color: hsl(55, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:55, html.var.auto .sf-c-txt-palegoldenrod\:55 { color: hsl(55, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60, html.var.auto .sf-c-txt-palegoldenrod\:60 { color: hsl(55, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:65, html.var.auto .sf-c-txt-palegoldenrod\:65 { color: hsl(55, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70, html.var.auto .sf-c-txt-palegoldenrod\:70 { color: hsl(55, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:75, html.var.auto .sf-c-txt-palegoldenrod\:75 { color: hsl(55, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80, html.var.auto .sf-c-txt-palegoldenrod\:80 { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:85, html.var.auto .sf-c-txt-palegoldenrod\:85 { color: hsl(55, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90, html.var.auto .sf-c-txt-palegoldenrod\:90 { color: hsl(55, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:95, html.var.auto .sf-c-txt-palegoldenrod\:95 { color: hsl(55, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100, html.var.auto .sf-c-txt-palegoldenrod\:100 { color: hsl(55, 67%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:dark, html.auto .sf-c-txt-palegoldenrod\:dark { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0\:dark, html.auto .sf-c-txt-palegoldenrod\:0\:dark { color: hsl(55, 67%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:5\:dark, html.auto .sf-c-txt-palegoldenrod\:5\:dark { color: hsl(55, 67%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10\:dark, html.auto .sf-c-txt-palegoldenrod\:10\:dark { color: hsl(55, 67%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:15\:dark, html.auto .sf-c-txt-palegoldenrod\:15\:dark { color: hsl(55, 67%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20\:dark, html.auto .sf-c-txt-palegoldenrod\:20\:dark { color: hsl(55, 67%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:25\:dark, html.auto .sf-c-txt-palegoldenrod\:25\:dark { color: hsl(55, 67%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30\:dark, html.auto .sf-c-txt-palegoldenrod\:30\:dark { color: hsl(55, 67%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:35\:dark, html.auto .sf-c-txt-palegoldenrod\:35\:dark { color: hsl(55, 67%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40\:dark, html.auto .sf-c-txt-palegoldenrod\:40\:dark { color: hsl(55, 67%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:45\:dark, html.auto .sf-c-txt-palegoldenrod\:45\:dark { color: hsl(55, 67%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50\:dark, html.auto .sf-c-txt-palegoldenrod\:50\:dark { color: hsl(55, 67%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:55\:dark, html.auto .sf-c-txt-palegoldenrod\:55\:dark { color: hsl(55, 67%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60\:dark, html.auto .sf-c-txt-palegoldenrod\:60\:dark { color: hsl(55, 67%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:65\:dark, html.auto .sf-c-txt-palegoldenrod\:65\:dark { color: hsl(55, 67%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70\:dark, html.auto .sf-c-txt-palegoldenrod\:70\:dark { color: hsl(55, 67%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:75\:dark, html.auto .sf-c-txt-palegoldenrod\:75\:dark { color: hsl(55, 67%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80\:dark, html.auto .sf-c-txt-palegoldenrod\:80\:dark { color: hsl(55, 67%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:85\:dark, html.auto .sf-c-txt-palegoldenrod\:85\:dark { color: hsl(55, 67%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90\:dark, html.auto .sf-c-txt-palegoldenrod\:90\:dark { color: hsl(55, 67%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:95\:dark, html.auto .sf-c-txt-palegoldenrod\:95\:dark { color: hsl(55, 67%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100\:dark, html.auto .sf-c-txt-palegoldenrod\:100\:dark { color: hsl(55, 67%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:dark, html.var.auto .sf-c-txt-palegoldenrod\:dark { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:0\:dark, html.var.auto .sf-c-txt-palegoldenrod\:0\:dark { color: hsl(55, 67%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:5\:dark, html.var.auto .sf-c-txt-palegoldenrod\:5\:dark { color: hsl(55, 67%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:10\:dark, html.var.auto .sf-c-txt-palegoldenrod\:10\:dark { color: hsl(55, 67%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:15\:dark, html.var.auto .sf-c-txt-palegoldenrod\:15\:dark { color: hsl(55, 67%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:20\:dark, html.var.auto .sf-c-txt-palegoldenrod\:20\:dark { color: hsl(55, 67%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:25\:dark, html.var.auto .sf-c-txt-palegoldenrod\:25\:dark { color: hsl(55, 67%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:30\:dark, html.var.auto .sf-c-txt-palegoldenrod\:30\:dark { color: hsl(55, 67%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:35\:dark, html.var.auto .sf-c-txt-palegoldenrod\:35\:dark { color: hsl(55, 67%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:40\:dark, html.var.auto .sf-c-txt-palegoldenrod\:40\:dark { color: hsl(55, 67%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:45\:dark, html.var.auto .sf-c-txt-palegoldenrod\:45\:dark { color: hsl(55, 67%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:50\:dark, html.var.auto .sf-c-txt-palegoldenrod\:50\:dark { color: hsl(55, 67%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:55\:dark, html.var.auto .sf-c-txt-palegoldenrod\:55\:dark { color: hsl(55, 67%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:60\:dark, html.var.auto .sf-c-txt-palegoldenrod\:60\:dark { color: hsl(55, 67%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:65\:dark, html.var.auto .sf-c-txt-palegoldenrod\:65\:dark { color: hsl(55, 67%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:70\:dark, html.var.auto .sf-c-txt-palegoldenrod\:70\:dark { color: hsl(55, 67%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:75\:dark, html.var.auto .sf-c-txt-palegoldenrod\:75\:dark { color: hsl(55, 67%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:80\:dark, html.var.auto .sf-c-txt-palegoldenrod\:80\:dark { color: hsl(55, 67%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:85\:dark, html.var.auto .sf-c-txt-palegoldenrod\:85\:dark { color: hsl(55, 67%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:90\:dark, html.var.auto .sf-c-txt-palegoldenrod\:90\:dark { color: hsl(55, 67%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:95\:dark, html.var.auto .sf-c-txt-palegoldenrod\:95\:dark { color: hsl(55, 67%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palegoldenrod\:100\:dark, html.var.auto .sf-c-txt-palegoldenrod\:100\:dark { color: hsl(55, 67%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/palegreen.css b/src/colors/20/palegreen.css index ea01726..c6d4027 100644 --- a/src/colors/20/palegreen.css +++ b/src/colors/20/palegreen.css @@ -1,4 +1,4 @@ -:root { +[class*='palegreen'] { --sf-c-palegreen: 120 93% 79%; --sf-c-palegreen-0: 120 93% 0%; --sf-c-palegreen-5: 120 93% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-palegreen\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-palegreen\:95\:dark, html.var.auto .sf-c-palegreen\:95\:dark { color: hsl(120, 93%, 95%); background: hsl(120, 93%, 5%) } html.var[data-theme='auto'] .sf-c-palegreen\:100\:dark, html.var.auto .sf-c-palegreen\:100\:dark { color: hsl(120, 93%, 95%); background: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen, html.auto .sf-c-txt-palegreen { color: hsl(120, 93%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:0, html.auto .sf-c-txt-palegreen\:0 { color: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:5, html.auto .sf-c-txt-palegreen\:5 { color: hsl(120, 93%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:10, html.auto .sf-c-txt-palegreen\:10 { color: hsl(120, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:15, html.auto .sf-c-txt-palegreen\:15 { color: hsl(120, 93%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:20, html.auto .sf-c-txt-palegreen\:20 { color: hsl(120, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:25, html.auto .sf-c-txt-palegreen\:25 { color: hsl(120, 93%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:30, html.auto .sf-c-txt-palegreen\:30 { color: hsl(120, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:35, html.auto .sf-c-txt-palegreen\:35 { color: hsl(120, 93%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:40, html.auto .sf-c-txt-palegreen\:40 { color: hsl(120, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:45, html.auto .sf-c-txt-palegreen\:45 { color: hsl(120, 93%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:50, html.auto .sf-c-txt-palegreen\:50 { color: hsl(120, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:55, html.auto .sf-c-txt-palegreen\:55 { color: hsl(120, 93%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:60, html.auto .sf-c-txt-palegreen\:60 { color: hsl(120, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:65, html.auto .sf-c-txt-palegreen\:65 { color: hsl(120, 93%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:70, html.auto .sf-c-txt-palegreen\:70 { color: hsl(120, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:75, html.auto .sf-c-txt-palegreen\:75 { color: hsl(120, 93%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:80, html.auto .sf-c-txt-palegreen\:80 { color: hsl(120, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:85, html.auto .sf-c-txt-palegreen\:85 { color: hsl(120, 93%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:90, html.auto .sf-c-txt-palegreen\:90 { color: hsl(120, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:95, html.auto .sf-c-txt-palegreen\:95 { color: hsl(120, 93%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:100, html.auto .sf-c-txt-palegreen\:100 { color: hsl(120, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen, html.var.auto .sf-c-txt-palegreen { color: hsl(120, 93%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:0, html.var.auto .sf-c-txt-palegreen\:0 { color: hsl(120, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:5, html.var.auto .sf-c-txt-palegreen\:5 { color: hsl(120, 93%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:10, html.var.auto .sf-c-txt-palegreen\:10 { color: hsl(120, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:15, html.var.auto .sf-c-txt-palegreen\:15 { color: hsl(120, 93%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:20, html.var.auto .sf-c-txt-palegreen\:20 { color: hsl(120, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:25, html.var.auto .sf-c-txt-palegreen\:25 { color: hsl(120, 93%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:30, html.var.auto .sf-c-txt-palegreen\:30 { color: hsl(120, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:35, html.var.auto .sf-c-txt-palegreen\:35 { color: hsl(120, 93%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:40, html.var.auto .sf-c-txt-palegreen\:40 { color: hsl(120, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:45, html.var.auto .sf-c-txt-palegreen\:45 { color: hsl(120, 93%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:50, html.var.auto .sf-c-txt-palegreen\:50 { color: hsl(120, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:55, html.var.auto .sf-c-txt-palegreen\:55 { color: hsl(120, 93%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:60, html.var.auto .sf-c-txt-palegreen\:60 { color: hsl(120, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:65, html.var.auto .sf-c-txt-palegreen\:65 { color: hsl(120, 93%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:70, html.var.auto .sf-c-txt-palegreen\:70 { color: hsl(120, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:75, html.var.auto .sf-c-txt-palegreen\:75 { color: hsl(120, 93%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:80, html.var.auto .sf-c-txt-palegreen\:80 { color: hsl(120, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:85, html.var.auto .sf-c-txt-palegreen\:85 { color: hsl(120, 93%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:90, html.var.auto .sf-c-txt-palegreen\:90 { color: hsl(120, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:95, html.var.auto .sf-c-txt-palegreen\:95 { color: hsl(120, 93%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:100, html.var.auto .sf-c-txt-palegreen\:100 { color: hsl(120, 93%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:dark, html.auto .sf-c-txt-palegreen\:dark { color: hsl(120, 93%, 79%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:0\:dark, html.auto .sf-c-txt-palegreen\:0\:dark { color: hsl(120, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:5\:dark, html.auto .sf-c-txt-palegreen\:5\:dark { color: hsl(120, 93%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:10\:dark, html.auto .sf-c-txt-palegreen\:10\:dark { color: hsl(120, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:15\:dark, html.auto .sf-c-txt-palegreen\:15\:dark { color: hsl(120, 93%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:20\:dark, html.auto .sf-c-txt-palegreen\:20\:dark { color: hsl(120, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:25\:dark, html.auto .sf-c-txt-palegreen\:25\:dark { color: hsl(120, 93%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:30\:dark, html.auto .sf-c-txt-palegreen\:30\:dark { color: hsl(120, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:35\:dark, html.auto .sf-c-txt-palegreen\:35\:dark { color: hsl(120, 93%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:40\:dark, html.auto .sf-c-txt-palegreen\:40\:dark { color: hsl(120, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:45\:dark, html.auto .sf-c-txt-palegreen\:45\:dark { color: hsl(120, 93%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:50\:dark, html.auto .sf-c-txt-palegreen\:50\:dark { color: hsl(120, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:55\:dark, html.auto .sf-c-txt-palegreen\:55\:dark { color: hsl(120, 93%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:60\:dark, html.auto .sf-c-txt-palegreen\:60\:dark { color: hsl(120, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:65\:dark, html.auto .sf-c-txt-palegreen\:65\:dark { color: hsl(120, 93%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:70\:dark, html.auto .sf-c-txt-palegreen\:70\:dark { color: hsl(120, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:75\:dark, html.auto .sf-c-txt-palegreen\:75\:dark { color: hsl(120, 93%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:80\:dark, html.auto .sf-c-txt-palegreen\:80\:dark { color: hsl(120, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:85\:dark, html.auto .sf-c-txt-palegreen\:85\:dark { color: hsl(120, 93%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:90\:dark, html.auto .sf-c-txt-palegreen\:90\:dark { color: hsl(120, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:95\:dark, html.auto .sf-c-txt-palegreen\:95\:dark { color: hsl(120, 93%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palegreen\:100\:dark, html.auto .sf-c-txt-palegreen\:100\:dark { color: hsl(120, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:dark, html.var.auto .sf-c-txt-palegreen\:dark { color: hsl(120, 93%, 79%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:0\:dark, html.var.auto .sf-c-txt-palegreen\:0\:dark { color: hsl(120, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:5\:dark, html.var.auto .sf-c-txt-palegreen\:5\:dark { color: hsl(120, 93%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:10\:dark, html.var.auto .sf-c-txt-palegreen\:10\:dark { color: hsl(120, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:15\:dark, html.var.auto .sf-c-txt-palegreen\:15\:dark { color: hsl(120, 93%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:20\:dark, html.var.auto .sf-c-txt-palegreen\:20\:dark { color: hsl(120, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:25\:dark, html.var.auto .sf-c-txt-palegreen\:25\:dark { color: hsl(120, 93%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:30\:dark, html.var.auto .sf-c-txt-palegreen\:30\:dark { color: hsl(120, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:35\:dark, html.var.auto .sf-c-txt-palegreen\:35\:dark { color: hsl(120, 93%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:40\:dark, html.var.auto .sf-c-txt-palegreen\:40\:dark { color: hsl(120, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:45\:dark, html.var.auto .sf-c-txt-palegreen\:45\:dark { color: hsl(120, 93%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:50\:dark, html.var.auto .sf-c-txt-palegreen\:50\:dark { color: hsl(120, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:55\:dark, html.var.auto .sf-c-txt-palegreen\:55\:dark { color: hsl(120, 93%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:60\:dark, html.var.auto .sf-c-txt-palegreen\:60\:dark { color: hsl(120, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:65\:dark, html.var.auto .sf-c-txt-palegreen\:65\:dark { color: hsl(120, 93%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:70\:dark, html.var.auto .sf-c-txt-palegreen\:70\:dark { color: hsl(120, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:75\:dark, html.var.auto .sf-c-txt-palegreen\:75\:dark { color: hsl(120, 93%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:80\:dark, html.var.auto .sf-c-txt-palegreen\:80\:dark { color: hsl(120, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:85\:dark, html.var.auto .sf-c-txt-palegreen\:85\:dark { color: hsl(120, 93%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:90\:dark, html.var.auto .sf-c-txt-palegreen\:90\:dark { color: hsl(120, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:95\:dark, html.var.auto .sf-c-txt-palegreen\:95\:dark { color: hsl(120, 93%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palegreen\:100\:dark, html.var.auto .sf-c-txt-palegreen\:100\:dark { color: hsl(120, 93%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/paleturquoise.css b/src/colors/20/paleturquoise.css index 9c1de1c..2fd6bb2 100644 --- a/src/colors/20/paleturquoise.css +++ b/src/colors/20/paleturquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='paleturquoise'] { --sf-c-paleturquoise: 180 65% 81%; --sf-c-paleturquoise-0: 180 65% 0%; --sf-c-paleturquoise-5: 180 65% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-paleturquoise\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-paleturquoise\:95\:dark, html.var.auto .sf-c-paleturquoise\:95\:dark { color: hsl(180, 65%, 95%); background: hsl(180, 65%, 5%) } html.var[data-theme='auto'] .sf-c-paleturquoise\:100\:dark, html.var.auto .sf-c-paleturquoise\:100\:dark { color: hsl(180, 65%, 95%); background: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise, html.auto .sf-c-txt-paleturquoise { color: hsl(180, 65%, 81%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0, html.auto .sf-c-txt-paleturquoise\:0 { color: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:5, html.auto .sf-c-txt-paleturquoise\:5 { color: hsl(180, 65%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10, html.auto .sf-c-txt-paleturquoise\:10 { color: hsl(180, 65%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:15, html.auto .sf-c-txt-paleturquoise\:15 { color: hsl(180, 65%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20, html.auto .sf-c-txt-paleturquoise\:20 { color: hsl(180, 65%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:25, html.auto .sf-c-txt-paleturquoise\:25 { color: hsl(180, 65%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30, html.auto .sf-c-txt-paleturquoise\:30 { color: hsl(180, 65%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:35, html.auto .sf-c-txt-paleturquoise\:35 { color: hsl(180, 65%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40, html.auto .sf-c-txt-paleturquoise\:40 { color: hsl(180, 65%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:45, html.auto .sf-c-txt-paleturquoise\:45 { color: hsl(180, 65%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50, html.auto .sf-c-txt-paleturquoise\:50 { color: hsl(180, 65%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:55, html.auto .sf-c-txt-paleturquoise\:55 { color: hsl(180, 65%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60, html.auto .sf-c-txt-paleturquoise\:60 { color: hsl(180, 65%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:65, html.auto .sf-c-txt-paleturquoise\:65 { color: hsl(180, 65%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70, html.auto .sf-c-txt-paleturquoise\:70 { color: hsl(180, 65%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:75, html.auto .sf-c-txt-paleturquoise\:75 { color: hsl(180, 65%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80, html.auto .sf-c-txt-paleturquoise\:80 { color: hsl(180, 65%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:85, html.auto .sf-c-txt-paleturquoise\:85 { color: hsl(180, 65%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90, html.auto .sf-c-txt-paleturquoise\:90 { color: hsl(180, 65%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:95, html.auto .sf-c-txt-paleturquoise\:95 { color: hsl(180, 65%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100, html.auto .sf-c-txt-paleturquoise\:100 { color: hsl(180, 65%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise, html.var.auto .sf-c-txt-paleturquoise { color: hsl(180, 65%, 81%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0, html.var.auto .sf-c-txt-paleturquoise\:0 { color: hsl(180, 65%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:5, html.var.auto .sf-c-txt-paleturquoise\:5 { color: hsl(180, 65%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10, html.var.auto .sf-c-txt-paleturquoise\:10 { color: hsl(180, 65%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:15, html.var.auto .sf-c-txt-paleturquoise\:15 { color: hsl(180, 65%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20, html.var.auto .sf-c-txt-paleturquoise\:20 { color: hsl(180, 65%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:25, html.var.auto .sf-c-txt-paleturquoise\:25 { color: hsl(180, 65%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30, html.var.auto .sf-c-txt-paleturquoise\:30 { color: hsl(180, 65%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:35, html.var.auto .sf-c-txt-paleturquoise\:35 { color: hsl(180, 65%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40, html.var.auto .sf-c-txt-paleturquoise\:40 { color: hsl(180, 65%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:45, html.var.auto .sf-c-txt-paleturquoise\:45 { color: hsl(180, 65%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50, html.var.auto .sf-c-txt-paleturquoise\:50 { color: hsl(180, 65%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:55, html.var.auto .sf-c-txt-paleturquoise\:55 { color: hsl(180, 65%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60, html.var.auto .sf-c-txt-paleturquoise\:60 { color: hsl(180, 65%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:65, html.var.auto .sf-c-txt-paleturquoise\:65 { color: hsl(180, 65%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70, html.var.auto .sf-c-txt-paleturquoise\:70 { color: hsl(180, 65%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:75, html.var.auto .sf-c-txt-paleturquoise\:75 { color: hsl(180, 65%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80, html.var.auto .sf-c-txt-paleturquoise\:80 { color: hsl(180, 65%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:85, html.var.auto .sf-c-txt-paleturquoise\:85 { color: hsl(180, 65%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90, html.var.auto .sf-c-txt-paleturquoise\:90 { color: hsl(180, 65%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:95, html.var.auto .sf-c-txt-paleturquoise\:95 { color: hsl(180, 65%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100, html.var.auto .sf-c-txt-paleturquoise\:100 { color: hsl(180, 65%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:dark, html.auto .sf-c-txt-paleturquoise\:dark { color: hsl(180, 65%, 81%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0\:dark, html.auto .sf-c-txt-paleturquoise\:0\:dark { color: hsl(180, 65%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:5\:dark, html.auto .sf-c-txt-paleturquoise\:5\:dark { color: hsl(180, 65%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10\:dark, html.auto .sf-c-txt-paleturquoise\:10\:dark { color: hsl(180, 65%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:15\:dark, html.auto .sf-c-txt-paleturquoise\:15\:dark { color: hsl(180, 65%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20\:dark, html.auto .sf-c-txt-paleturquoise\:20\:dark { color: hsl(180, 65%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:25\:dark, html.auto .sf-c-txt-paleturquoise\:25\:dark { color: hsl(180, 65%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30\:dark, html.auto .sf-c-txt-paleturquoise\:30\:dark { color: hsl(180, 65%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:35\:dark, html.auto .sf-c-txt-paleturquoise\:35\:dark { color: hsl(180, 65%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40\:dark, html.auto .sf-c-txt-paleturquoise\:40\:dark { color: hsl(180, 65%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:45\:dark, html.auto .sf-c-txt-paleturquoise\:45\:dark { color: hsl(180, 65%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50\:dark, html.auto .sf-c-txt-paleturquoise\:50\:dark { color: hsl(180, 65%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:55\:dark, html.auto .sf-c-txt-paleturquoise\:55\:dark { color: hsl(180, 65%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60\:dark, html.auto .sf-c-txt-paleturquoise\:60\:dark { color: hsl(180, 65%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:65\:dark, html.auto .sf-c-txt-paleturquoise\:65\:dark { color: hsl(180, 65%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70\:dark, html.auto .sf-c-txt-paleturquoise\:70\:dark { color: hsl(180, 65%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:75\:dark, html.auto .sf-c-txt-paleturquoise\:75\:dark { color: hsl(180, 65%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80\:dark, html.auto .sf-c-txt-paleturquoise\:80\:dark { color: hsl(180, 65%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:85\:dark, html.auto .sf-c-txt-paleturquoise\:85\:dark { color: hsl(180, 65%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90\:dark, html.auto .sf-c-txt-paleturquoise\:90\:dark { color: hsl(180, 65%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:95\:dark, html.auto .sf-c-txt-paleturquoise\:95\:dark { color: hsl(180, 65%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100\:dark, html.auto .sf-c-txt-paleturquoise\:100\:dark { color: hsl(180, 65%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:dark, html.var.auto .sf-c-txt-paleturquoise\:dark { color: hsl(180, 65%, 81%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:0\:dark, html.var.auto .sf-c-txt-paleturquoise\:0\:dark { color: hsl(180, 65%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:5\:dark, html.var.auto .sf-c-txt-paleturquoise\:5\:dark { color: hsl(180, 65%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:10\:dark, html.var.auto .sf-c-txt-paleturquoise\:10\:dark { color: hsl(180, 65%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:15\:dark, html.var.auto .sf-c-txt-paleturquoise\:15\:dark { color: hsl(180, 65%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:20\:dark, html.var.auto .sf-c-txt-paleturquoise\:20\:dark { color: hsl(180, 65%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:25\:dark, html.var.auto .sf-c-txt-paleturquoise\:25\:dark { color: hsl(180, 65%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:30\:dark, html.var.auto .sf-c-txt-paleturquoise\:30\:dark { color: hsl(180, 65%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:35\:dark, html.var.auto .sf-c-txt-paleturquoise\:35\:dark { color: hsl(180, 65%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:40\:dark, html.var.auto .sf-c-txt-paleturquoise\:40\:dark { color: hsl(180, 65%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:45\:dark, html.var.auto .sf-c-txt-paleturquoise\:45\:dark { color: hsl(180, 65%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:50\:dark, html.var.auto .sf-c-txt-paleturquoise\:50\:dark { color: hsl(180, 65%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:55\:dark, html.var.auto .sf-c-txt-paleturquoise\:55\:dark { color: hsl(180, 65%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:60\:dark, html.var.auto .sf-c-txt-paleturquoise\:60\:dark { color: hsl(180, 65%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:65\:dark, html.var.auto .sf-c-txt-paleturquoise\:65\:dark { color: hsl(180, 65%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:70\:dark, html.var.auto .sf-c-txt-paleturquoise\:70\:dark { color: hsl(180, 65%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:75\:dark, html.var.auto .sf-c-txt-paleturquoise\:75\:dark { color: hsl(180, 65%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:80\:dark, html.var.auto .sf-c-txt-paleturquoise\:80\:dark { color: hsl(180, 65%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:85\:dark, html.var.auto .sf-c-txt-paleturquoise\:85\:dark { color: hsl(180, 65%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:90\:dark, html.var.auto .sf-c-txt-paleturquoise\:90\:dark { color: hsl(180, 65%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:95\:dark, html.var.auto .sf-c-txt-paleturquoise\:95\:dark { color: hsl(180, 65%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-paleturquoise\:100\:dark, html.var.auto .sf-c-txt-paleturquoise\:100\:dark { color: hsl(180, 65%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/palevioletred.css b/src/colors/20/palevioletred.css index 299c7d0..4d2c6e4 100644 --- a/src/colors/20/palevioletred.css +++ b/src/colors/20/palevioletred.css @@ -1,4 +1,4 @@ -:root { +[class*='palevioletred'] { --sf-c-palevioletred: 340 60% 65%; --sf-c-palevioletred-0: 340 60% 0%; --sf-c-palevioletred-5: 340 60% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-palevioletred\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-palevioletred\:95\:dark, html.var.auto .sf-c-palevioletred\:95\:dark { color: hsl(340, 60%, 95%); background: hsl(340, 60%, 5%) } html.var[data-theme='auto'] .sf-c-palevioletred\:100\:dark, html.var.auto .sf-c-palevioletred\:100\:dark { color: hsl(340, 60%, 95%); background: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred, html.auto .sf-c-txt-palevioletred { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0, html.auto .sf-c-txt-palevioletred\:0 { color: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:5, html.auto .sf-c-txt-palevioletred\:5 { color: hsl(340, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10, html.auto .sf-c-txt-palevioletred\:10 { color: hsl(340, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:15, html.auto .sf-c-txt-palevioletred\:15 { color: hsl(340, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20, html.auto .sf-c-txt-palevioletred\:20 { color: hsl(340, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:25, html.auto .sf-c-txt-palevioletred\:25 { color: hsl(340, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30, html.auto .sf-c-txt-palevioletred\:30 { color: hsl(340, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:35, html.auto .sf-c-txt-palevioletred\:35 { color: hsl(340, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40, html.auto .sf-c-txt-palevioletred\:40 { color: hsl(340, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:45, html.auto .sf-c-txt-palevioletred\:45 { color: hsl(340, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50, html.auto .sf-c-txt-palevioletred\:50 { color: hsl(340, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:55, html.auto .sf-c-txt-palevioletred\:55 { color: hsl(340, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60, html.auto .sf-c-txt-palevioletred\:60 { color: hsl(340, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:65, html.auto .sf-c-txt-palevioletred\:65 { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70, html.auto .sf-c-txt-palevioletred\:70 { color: hsl(340, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:75, html.auto .sf-c-txt-palevioletred\:75 { color: hsl(340, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80, html.auto .sf-c-txt-palevioletred\:80 { color: hsl(340, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:85, html.auto .sf-c-txt-palevioletred\:85 { color: hsl(340, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90, html.auto .sf-c-txt-palevioletred\:90 { color: hsl(340, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:95, html.auto .sf-c-txt-palevioletred\:95 { color: hsl(340, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100, html.auto .sf-c-txt-palevioletred\:100 { color: hsl(340, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred, html.var.auto .sf-c-txt-palevioletred { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0, html.var.auto .sf-c-txt-palevioletred\:0 { color: hsl(340, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:5, html.var.auto .sf-c-txt-palevioletred\:5 { color: hsl(340, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10, html.var.auto .sf-c-txt-palevioletred\:10 { color: hsl(340, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:15, html.var.auto .sf-c-txt-palevioletred\:15 { color: hsl(340, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20, html.var.auto .sf-c-txt-palevioletred\:20 { color: hsl(340, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:25, html.var.auto .sf-c-txt-palevioletred\:25 { color: hsl(340, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30, html.var.auto .sf-c-txt-palevioletred\:30 { color: hsl(340, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:35, html.var.auto .sf-c-txt-palevioletred\:35 { color: hsl(340, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40, html.var.auto .sf-c-txt-palevioletred\:40 { color: hsl(340, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:45, html.var.auto .sf-c-txt-palevioletred\:45 { color: hsl(340, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50, html.var.auto .sf-c-txt-palevioletred\:50 { color: hsl(340, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:55, html.var.auto .sf-c-txt-palevioletred\:55 { color: hsl(340, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60, html.var.auto .sf-c-txt-palevioletred\:60 { color: hsl(340, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:65, html.var.auto .sf-c-txt-palevioletred\:65 { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70, html.var.auto .sf-c-txt-palevioletred\:70 { color: hsl(340, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:75, html.var.auto .sf-c-txt-palevioletred\:75 { color: hsl(340, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80, html.var.auto .sf-c-txt-palevioletred\:80 { color: hsl(340, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:85, html.var.auto .sf-c-txt-palevioletred\:85 { color: hsl(340, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90, html.var.auto .sf-c-txt-palevioletred\:90 { color: hsl(340, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:95, html.var.auto .sf-c-txt-palevioletred\:95 { color: hsl(340, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100, html.var.auto .sf-c-txt-palevioletred\:100 { color: hsl(340, 60%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:dark, html.auto .sf-c-txt-palevioletred\:dark { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0\:dark, html.auto .sf-c-txt-palevioletred\:0\:dark { color: hsl(340, 60%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:5\:dark, html.auto .sf-c-txt-palevioletred\:5\:dark { color: hsl(340, 60%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10\:dark, html.auto .sf-c-txt-palevioletred\:10\:dark { color: hsl(340, 60%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:15\:dark, html.auto .sf-c-txt-palevioletred\:15\:dark { color: hsl(340, 60%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20\:dark, html.auto .sf-c-txt-palevioletred\:20\:dark { color: hsl(340, 60%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:25\:dark, html.auto .sf-c-txt-palevioletred\:25\:dark { color: hsl(340, 60%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30\:dark, html.auto .sf-c-txt-palevioletred\:30\:dark { color: hsl(340, 60%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:35\:dark, html.auto .sf-c-txt-palevioletred\:35\:dark { color: hsl(340, 60%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40\:dark, html.auto .sf-c-txt-palevioletred\:40\:dark { color: hsl(340, 60%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:45\:dark, html.auto .sf-c-txt-palevioletred\:45\:dark { color: hsl(340, 60%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50\:dark, html.auto .sf-c-txt-palevioletred\:50\:dark { color: hsl(340, 60%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:55\:dark, html.auto .sf-c-txt-palevioletred\:55\:dark { color: hsl(340, 60%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60\:dark, html.auto .sf-c-txt-palevioletred\:60\:dark { color: hsl(340, 60%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:65\:dark, html.auto .sf-c-txt-palevioletred\:65\:dark { color: hsl(340, 60%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70\:dark, html.auto .sf-c-txt-palevioletred\:70\:dark { color: hsl(340, 60%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:75\:dark, html.auto .sf-c-txt-palevioletred\:75\:dark { color: hsl(340, 60%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80\:dark, html.auto .sf-c-txt-palevioletred\:80\:dark { color: hsl(340, 60%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:85\:dark, html.auto .sf-c-txt-palevioletred\:85\:dark { color: hsl(340, 60%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90\:dark, html.auto .sf-c-txt-palevioletred\:90\:dark { color: hsl(340, 60%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:95\:dark, html.auto .sf-c-txt-palevioletred\:95\:dark { color: hsl(340, 60%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100\:dark, html.auto .sf-c-txt-palevioletred\:100\:dark { color: hsl(340, 60%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:dark, html.var.auto .sf-c-txt-palevioletred\:dark { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:0\:dark, html.var.auto .sf-c-txt-palevioletred\:0\:dark { color: hsl(340, 60%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:5\:dark, html.var.auto .sf-c-txt-palevioletred\:5\:dark { color: hsl(340, 60%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:10\:dark, html.var.auto .sf-c-txt-palevioletred\:10\:dark { color: hsl(340, 60%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:15\:dark, html.var.auto .sf-c-txt-palevioletred\:15\:dark { color: hsl(340, 60%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:20\:dark, html.var.auto .sf-c-txt-palevioletred\:20\:dark { color: hsl(340, 60%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:25\:dark, html.var.auto .sf-c-txt-palevioletred\:25\:dark { color: hsl(340, 60%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:30\:dark, html.var.auto .sf-c-txt-palevioletred\:30\:dark { color: hsl(340, 60%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:35\:dark, html.var.auto .sf-c-txt-palevioletred\:35\:dark { color: hsl(340, 60%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:40\:dark, html.var.auto .sf-c-txt-palevioletred\:40\:dark { color: hsl(340, 60%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:45\:dark, html.var.auto .sf-c-txt-palevioletred\:45\:dark { color: hsl(340, 60%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:50\:dark, html.var.auto .sf-c-txt-palevioletred\:50\:dark { color: hsl(340, 60%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:55\:dark, html.var.auto .sf-c-txt-palevioletred\:55\:dark { color: hsl(340, 60%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:60\:dark, html.var.auto .sf-c-txt-palevioletred\:60\:dark { color: hsl(340, 60%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:65\:dark, html.var.auto .sf-c-txt-palevioletred\:65\:dark { color: hsl(340, 60%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:70\:dark, html.var.auto .sf-c-txt-palevioletred\:70\:dark { color: hsl(340, 60%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:75\:dark, html.var.auto .sf-c-txt-palevioletred\:75\:dark { color: hsl(340, 60%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:80\:dark, html.var.auto .sf-c-txt-palevioletred\:80\:dark { color: hsl(340, 60%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:85\:dark, html.var.auto .sf-c-txt-palevioletred\:85\:dark { color: hsl(340, 60%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:90\:dark, html.var.auto .sf-c-txt-palevioletred\:90\:dark { color: hsl(340, 60%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:95\:dark, html.var.auto .sf-c-txt-palevioletred\:95\:dark { color: hsl(340, 60%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-palevioletred\:100\:dark, html.var.auto .sf-c-txt-palevioletred\:100\:dark { color: hsl(340, 60%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/papayawhip.css b/src/colors/20/papayawhip.css index 10a73f9..dfd0b14 100644 --- a/src/colors/20/papayawhip.css +++ b/src/colors/20/papayawhip.css @@ -1,4 +1,4 @@ -:root { +[class*='papayawhip'] { --sf-c-papayawhip: 37 100% 92%; --sf-c-papayawhip-0: 37 100% 0%; --sf-c-papayawhip-5: 37 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-papayawhip\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-papayawhip\:95\:dark, html.var.auto .sf-c-papayawhip\:95\:dark { color: hsl(37, 100%, 95%); background: hsl(37, 100%, 5%) } html.var[data-theme='auto'] .sf-c-papayawhip\:100\:dark, html.var.auto .sf-c-papayawhip\:100\:dark { color: hsl(37, 100%, 95%); background: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip, html.auto .sf-c-txt-papayawhip { color: hsl(37, 100%, 92%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0, html.auto .sf-c-txt-papayawhip\:0 { color: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:5, html.auto .sf-c-txt-papayawhip\:5 { color: hsl(37, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10, html.auto .sf-c-txt-papayawhip\:10 { color: hsl(37, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:15, html.auto .sf-c-txt-papayawhip\:15 { color: hsl(37, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20, html.auto .sf-c-txt-papayawhip\:20 { color: hsl(37, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:25, html.auto .sf-c-txt-papayawhip\:25 { color: hsl(37, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30, html.auto .sf-c-txt-papayawhip\:30 { color: hsl(37, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:35, html.auto .sf-c-txt-papayawhip\:35 { color: hsl(37, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40, html.auto .sf-c-txt-papayawhip\:40 { color: hsl(37, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:45, html.auto .sf-c-txt-papayawhip\:45 { color: hsl(37, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50, html.auto .sf-c-txt-papayawhip\:50 { color: hsl(37, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:55, html.auto .sf-c-txt-papayawhip\:55 { color: hsl(37, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60, html.auto .sf-c-txt-papayawhip\:60 { color: hsl(37, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:65, html.auto .sf-c-txt-papayawhip\:65 { color: hsl(37, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70, html.auto .sf-c-txt-papayawhip\:70 { color: hsl(37, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:75, html.auto .sf-c-txt-papayawhip\:75 { color: hsl(37, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80, html.auto .sf-c-txt-papayawhip\:80 { color: hsl(37, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:85, html.auto .sf-c-txt-papayawhip\:85 { color: hsl(37, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90, html.auto .sf-c-txt-papayawhip\:90 { color: hsl(37, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:95, html.auto .sf-c-txt-papayawhip\:95 { color: hsl(37, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100, html.auto .sf-c-txt-papayawhip\:100 { color: hsl(37, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip, html.var.auto .sf-c-txt-papayawhip { color: hsl(37, 100%, 92%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0, html.var.auto .sf-c-txt-papayawhip\:0 { color: hsl(37, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:5, html.var.auto .sf-c-txt-papayawhip\:5 { color: hsl(37, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10, html.var.auto .sf-c-txt-papayawhip\:10 { color: hsl(37, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:15, html.var.auto .sf-c-txt-papayawhip\:15 { color: hsl(37, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20, html.var.auto .sf-c-txt-papayawhip\:20 { color: hsl(37, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:25, html.var.auto .sf-c-txt-papayawhip\:25 { color: hsl(37, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30, html.var.auto .sf-c-txt-papayawhip\:30 { color: hsl(37, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:35, html.var.auto .sf-c-txt-papayawhip\:35 { color: hsl(37, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40, html.var.auto .sf-c-txt-papayawhip\:40 { color: hsl(37, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:45, html.var.auto .sf-c-txt-papayawhip\:45 { color: hsl(37, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50, html.var.auto .sf-c-txt-papayawhip\:50 { color: hsl(37, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:55, html.var.auto .sf-c-txt-papayawhip\:55 { color: hsl(37, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60, html.var.auto .sf-c-txt-papayawhip\:60 { color: hsl(37, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:65, html.var.auto .sf-c-txt-papayawhip\:65 { color: hsl(37, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70, html.var.auto .sf-c-txt-papayawhip\:70 { color: hsl(37, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:75, html.var.auto .sf-c-txt-papayawhip\:75 { color: hsl(37, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80, html.var.auto .sf-c-txt-papayawhip\:80 { color: hsl(37, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:85, html.var.auto .sf-c-txt-papayawhip\:85 { color: hsl(37, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90, html.var.auto .sf-c-txt-papayawhip\:90 { color: hsl(37, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:95, html.var.auto .sf-c-txt-papayawhip\:95 { color: hsl(37, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100, html.var.auto .sf-c-txt-papayawhip\:100 { color: hsl(37, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:dark, html.auto .sf-c-txt-papayawhip\:dark { color: hsl(37, 100%, 92%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0\:dark, html.auto .sf-c-txt-papayawhip\:0\:dark { color: hsl(37, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:5\:dark, html.auto .sf-c-txt-papayawhip\:5\:dark { color: hsl(37, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10\:dark, html.auto .sf-c-txt-papayawhip\:10\:dark { color: hsl(37, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:15\:dark, html.auto .sf-c-txt-papayawhip\:15\:dark { color: hsl(37, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20\:dark, html.auto .sf-c-txt-papayawhip\:20\:dark { color: hsl(37, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:25\:dark, html.auto .sf-c-txt-papayawhip\:25\:dark { color: hsl(37, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30\:dark, html.auto .sf-c-txt-papayawhip\:30\:dark { color: hsl(37, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:35\:dark, html.auto .sf-c-txt-papayawhip\:35\:dark { color: hsl(37, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40\:dark, html.auto .sf-c-txt-papayawhip\:40\:dark { color: hsl(37, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:45\:dark, html.auto .sf-c-txt-papayawhip\:45\:dark { color: hsl(37, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50\:dark, html.auto .sf-c-txt-papayawhip\:50\:dark { color: hsl(37, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:55\:dark, html.auto .sf-c-txt-papayawhip\:55\:dark { color: hsl(37, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60\:dark, html.auto .sf-c-txt-papayawhip\:60\:dark { color: hsl(37, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:65\:dark, html.auto .sf-c-txt-papayawhip\:65\:dark { color: hsl(37, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70\:dark, html.auto .sf-c-txt-papayawhip\:70\:dark { color: hsl(37, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:75\:dark, html.auto .sf-c-txt-papayawhip\:75\:dark { color: hsl(37, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80\:dark, html.auto .sf-c-txt-papayawhip\:80\:dark { color: hsl(37, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:85\:dark, html.auto .sf-c-txt-papayawhip\:85\:dark { color: hsl(37, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90\:dark, html.auto .sf-c-txt-papayawhip\:90\:dark { color: hsl(37, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:95\:dark, html.auto .sf-c-txt-papayawhip\:95\:dark { color: hsl(37, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100\:dark, html.auto .sf-c-txt-papayawhip\:100\:dark { color: hsl(37, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:dark, html.var.auto .sf-c-txt-papayawhip\:dark { color: hsl(37, 100%, 92%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:0\:dark, html.var.auto .sf-c-txt-papayawhip\:0\:dark { color: hsl(37, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:5\:dark, html.var.auto .sf-c-txt-papayawhip\:5\:dark { color: hsl(37, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:10\:dark, html.var.auto .sf-c-txt-papayawhip\:10\:dark { color: hsl(37, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:15\:dark, html.var.auto .sf-c-txt-papayawhip\:15\:dark { color: hsl(37, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:20\:dark, html.var.auto .sf-c-txt-papayawhip\:20\:dark { color: hsl(37, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:25\:dark, html.var.auto .sf-c-txt-papayawhip\:25\:dark { color: hsl(37, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:30\:dark, html.var.auto .sf-c-txt-papayawhip\:30\:dark { color: hsl(37, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:35\:dark, html.var.auto .sf-c-txt-papayawhip\:35\:dark { color: hsl(37, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:40\:dark, html.var.auto .sf-c-txt-papayawhip\:40\:dark { color: hsl(37, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:45\:dark, html.var.auto .sf-c-txt-papayawhip\:45\:dark { color: hsl(37, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:50\:dark, html.var.auto .sf-c-txt-papayawhip\:50\:dark { color: hsl(37, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:55\:dark, html.var.auto .sf-c-txt-papayawhip\:55\:dark { color: hsl(37, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:60\:dark, html.var.auto .sf-c-txt-papayawhip\:60\:dark { color: hsl(37, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:65\:dark, html.var.auto .sf-c-txt-papayawhip\:65\:dark { color: hsl(37, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:70\:dark, html.var.auto .sf-c-txt-papayawhip\:70\:dark { color: hsl(37, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:75\:dark, html.var.auto .sf-c-txt-papayawhip\:75\:dark { color: hsl(37, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:80\:dark, html.var.auto .sf-c-txt-papayawhip\:80\:dark { color: hsl(37, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:85\:dark, html.var.auto .sf-c-txt-papayawhip\:85\:dark { color: hsl(37, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:90\:dark, html.var.auto .sf-c-txt-papayawhip\:90\:dark { color: hsl(37, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:95\:dark, html.var.auto .sf-c-txt-papayawhip\:95\:dark { color: hsl(37, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-papayawhip\:100\:dark, html.var.auto .sf-c-txt-papayawhip\:100\:dark { color: hsl(37, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/peachpuff.css b/src/colors/20/peachpuff.css index 0154e12..43aa38a 100644 --- a/src/colors/20/peachpuff.css +++ b/src/colors/20/peachpuff.css @@ -1,4 +1,4 @@ -:root { +[class*='peachpuff'] { --sf-c-peachpuff: 28 100% 86%; --sf-c-peachpuff-0: 28 100% 0%; --sf-c-peachpuff-5: 28 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-peachpuff\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-peachpuff\:95\:dark, html.var.auto .sf-c-peachpuff\:95\:dark { color: hsl(28, 100%, 95%); background: hsl(28, 100%, 5%) } html.var[data-theme='auto'] .sf-c-peachpuff\:100\:dark, html.var.auto .sf-c-peachpuff\:100\:dark { color: hsl(28, 100%, 95%); background: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff, html.auto .sf-c-txt-peachpuff { color: hsl(28, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0, html.auto .sf-c-txt-peachpuff\:0 { color: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:5, html.auto .sf-c-txt-peachpuff\:5 { color: hsl(28, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10, html.auto .sf-c-txt-peachpuff\:10 { color: hsl(28, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:15, html.auto .sf-c-txt-peachpuff\:15 { color: hsl(28, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20, html.auto .sf-c-txt-peachpuff\:20 { color: hsl(28, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:25, html.auto .sf-c-txt-peachpuff\:25 { color: hsl(28, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30, html.auto .sf-c-txt-peachpuff\:30 { color: hsl(28, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:35, html.auto .sf-c-txt-peachpuff\:35 { color: hsl(28, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40, html.auto .sf-c-txt-peachpuff\:40 { color: hsl(28, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:45, html.auto .sf-c-txt-peachpuff\:45 { color: hsl(28, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50, html.auto .sf-c-txt-peachpuff\:50 { color: hsl(28, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:55, html.auto .sf-c-txt-peachpuff\:55 { color: hsl(28, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60, html.auto .sf-c-txt-peachpuff\:60 { color: hsl(28, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:65, html.auto .sf-c-txt-peachpuff\:65 { color: hsl(28, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70, html.auto .sf-c-txt-peachpuff\:70 { color: hsl(28, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:75, html.auto .sf-c-txt-peachpuff\:75 { color: hsl(28, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80, html.auto .sf-c-txt-peachpuff\:80 { color: hsl(28, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:85, html.auto .sf-c-txt-peachpuff\:85 { color: hsl(28, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90, html.auto .sf-c-txt-peachpuff\:90 { color: hsl(28, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:95, html.auto .sf-c-txt-peachpuff\:95 { color: hsl(28, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100, html.auto .sf-c-txt-peachpuff\:100 { color: hsl(28, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff, html.var.auto .sf-c-txt-peachpuff { color: hsl(28, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0, html.var.auto .sf-c-txt-peachpuff\:0 { color: hsl(28, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:5, html.var.auto .sf-c-txt-peachpuff\:5 { color: hsl(28, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10, html.var.auto .sf-c-txt-peachpuff\:10 { color: hsl(28, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:15, html.var.auto .sf-c-txt-peachpuff\:15 { color: hsl(28, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20, html.var.auto .sf-c-txt-peachpuff\:20 { color: hsl(28, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:25, html.var.auto .sf-c-txt-peachpuff\:25 { color: hsl(28, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30, html.var.auto .sf-c-txt-peachpuff\:30 { color: hsl(28, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:35, html.var.auto .sf-c-txt-peachpuff\:35 { color: hsl(28, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40, html.var.auto .sf-c-txt-peachpuff\:40 { color: hsl(28, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:45, html.var.auto .sf-c-txt-peachpuff\:45 { color: hsl(28, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50, html.var.auto .sf-c-txt-peachpuff\:50 { color: hsl(28, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:55, html.var.auto .sf-c-txt-peachpuff\:55 { color: hsl(28, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60, html.var.auto .sf-c-txt-peachpuff\:60 { color: hsl(28, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:65, html.var.auto .sf-c-txt-peachpuff\:65 { color: hsl(28, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70, html.var.auto .sf-c-txt-peachpuff\:70 { color: hsl(28, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:75, html.var.auto .sf-c-txt-peachpuff\:75 { color: hsl(28, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80, html.var.auto .sf-c-txt-peachpuff\:80 { color: hsl(28, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:85, html.var.auto .sf-c-txt-peachpuff\:85 { color: hsl(28, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90, html.var.auto .sf-c-txt-peachpuff\:90 { color: hsl(28, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:95, html.var.auto .sf-c-txt-peachpuff\:95 { color: hsl(28, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100, html.var.auto .sf-c-txt-peachpuff\:100 { color: hsl(28, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:dark, html.auto .sf-c-txt-peachpuff\:dark { color: hsl(28, 100%, 86%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0\:dark, html.auto .sf-c-txt-peachpuff\:0\:dark { color: hsl(28, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:5\:dark, html.auto .sf-c-txt-peachpuff\:5\:dark { color: hsl(28, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10\:dark, html.auto .sf-c-txt-peachpuff\:10\:dark { color: hsl(28, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:15\:dark, html.auto .sf-c-txt-peachpuff\:15\:dark { color: hsl(28, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20\:dark, html.auto .sf-c-txt-peachpuff\:20\:dark { color: hsl(28, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:25\:dark, html.auto .sf-c-txt-peachpuff\:25\:dark { color: hsl(28, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30\:dark, html.auto .sf-c-txt-peachpuff\:30\:dark { color: hsl(28, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:35\:dark, html.auto .sf-c-txt-peachpuff\:35\:dark { color: hsl(28, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40\:dark, html.auto .sf-c-txt-peachpuff\:40\:dark { color: hsl(28, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:45\:dark, html.auto .sf-c-txt-peachpuff\:45\:dark { color: hsl(28, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50\:dark, html.auto .sf-c-txt-peachpuff\:50\:dark { color: hsl(28, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:55\:dark, html.auto .sf-c-txt-peachpuff\:55\:dark { color: hsl(28, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60\:dark, html.auto .sf-c-txt-peachpuff\:60\:dark { color: hsl(28, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:65\:dark, html.auto .sf-c-txt-peachpuff\:65\:dark { color: hsl(28, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70\:dark, html.auto .sf-c-txt-peachpuff\:70\:dark { color: hsl(28, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:75\:dark, html.auto .sf-c-txt-peachpuff\:75\:dark { color: hsl(28, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80\:dark, html.auto .sf-c-txt-peachpuff\:80\:dark { color: hsl(28, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:85\:dark, html.auto .sf-c-txt-peachpuff\:85\:dark { color: hsl(28, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90\:dark, html.auto .sf-c-txt-peachpuff\:90\:dark { color: hsl(28, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:95\:dark, html.auto .sf-c-txt-peachpuff\:95\:dark { color: hsl(28, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100\:dark, html.auto .sf-c-txt-peachpuff\:100\:dark { color: hsl(28, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:dark, html.var.auto .sf-c-txt-peachpuff\:dark { color: hsl(28, 100%, 86%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:0\:dark, html.var.auto .sf-c-txt-peachpuff\:0\:dark { color: hsl(28, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:5\:dark, html.var.auto .sf-c-txt-peachpuff\:5\:dark { color: hsl(28, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:10\:dark, html.var.auto .sf-c-txt-peachpuff\:10\:dark { color: hsl(28, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:15\:dark, html.var.auto .sf-c-txt-peachpuff\:15\:dark { color: hsl(28, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:20\:dark, html.var.auto .sf-c-txt-peachpuff\:20\:dark { color: hsl(28, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:25\:dark, html.var.auto .sf-c-txt-peachpuff\:25\:dark { color: hsl(28, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:30\:dark, html.var.auto .sf-c-txt-peachpuff\:30\:dark { color: hsl(28, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:35\:dark, html.var.auto .sf-c-txt-peachpuff\:35\:dark { color: hsl(28, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:40\:dark, html.var.auto .sf-c-txt-peachpuff\:40\:dark { color: hsl(28, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:45\:dark, html.var.auto .sf-c-txt-peachpuff\:45\:dark { color: hsl(28, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:50\:dark, html.var.auto .sf-c-txt-peachpuff\:50\:dark { color: hsl(28, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:55\:dark, html.var.auto .sf-c-txt-peachpuff\:55\:dark { color: hsl(28, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:60\:dark, html.var.auto .sf-c-txt-peachpuff\:60\:dark { color: hsl(28, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:65\:dark, html.var.auto .sf-c-txt-peachpuff\:65\:dark { color: hsl(28, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:70\:dark, html.var.auto .sf-c-txt-peachpuff\:70\:dark { color: hsl(28, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:75\:dark, html.var.auto .sf-c-txt-peachpuff\:75\:dark { color: hsl(28, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:80\:dark, html.var.auto .sf-c-txt-peachpuff\:80\:dark { color: hsl(28, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:85\:dark, html.var.auto .sf-c-txt-peachpuff\:85\:dark { color: hsl(28, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:90\:dark, html.var.auto .sf-c-txt-peachpuff\:90\:dark { color: hsl(28, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:95\:dark, html.var.auto .sf-c-txt-peachpuff\:95\:dark { color: hsl(28, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-peachpuff\:100\:dark, html.var.auto .sf-c-txt-peachpuff\:100\:dark { color: hsl(28, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/peru.css b/src/colors/20/peru.css index 4358ce1..e30f19a 100644 --- a/src/colors/20/peru.css +++ b/src/colors/20/peru.css @@ -1,4 +1,4 @@ -:root { +[class*='peru'] { --sf-c-peru: 30 59% 53%; --sf-c-peru-0: 30 59% 0%; --sf-c-peru-5: 30 59% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-peru\:100\:dark, html.dark .sf-c-txt-peru\ html.var[data-theme='auto'] .sf-c-peru\:95\:dark, html.var.auto .sf-c-peru\:95\:dark { color: hsl(30, 59%, 95%); background: hsl(30, 59%, 5%) } html.var[data-theme='auto'] .sf-c-peru\:100\:dark, html.var.auto .sf-c-peru\:100\:dark { color: hsl(30, 59%, 95%); background: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru, html.auto .sf-c-txt-peru { color: hsl(30, 59%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:0, html.auto .sf-c-txt-peru\:0 { color: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:5, html.auto .sf-c-txt-peru\:5 { color: hsl(30, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:10, html.auto .sf-c-txt-peru\:10 { color: hsl(30, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:15, html.auto .sf-c-txt-peru\:15 { color: hsl(30, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:20, html.auto .sf-c-txt-peru\:20 { color: hsl(30, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:25, html.auto .sf-c-txt-peru\:25 { color: hsl(30, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:30, html.auto .sf-c-txt-peru\:30 { color: hsl(30, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:35, html.auto .sf-c-txt-peru\:35 { color: hsl(30, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:40, html.auto .sf-c-txt-peru\:40 { color: hsl(30, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:45, html.auto .sf-c-txt-peru\:45 { color: hsl(30, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:50, html.auto .sf-c-txt-peru\:50 { color: hsl(30, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:55, html.auto .sf-c-txt-peru\:55 { color: hsl(30, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:60, html.auto .sf-c-txt-peru\:60 { color: hsl(30, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:65, html.auto .sf-c-txt-peru\:65 { color: hsl(30, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:70, html.auto .sf-c-txt-peru\:70 { color: hsl(30, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:75, html.auto .sf-c-txt-peru\:75 { color: hsl(30, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:80, html.auto .sf-c-txt-peru\:80 { color: hsl(30, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:85, html.auto .sf-c-txt-peru\:85 { color: hsl(30, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:90, html.auto .sf-c-txt-peru\:90 { color: hsl(30, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:95, html.auto .sf-c-txt-peru\:95 { color: hsl(30, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:100, html.auto .sf-c-txt-peru\:100 { color: hsl(30, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peru, html.var.auto .sf-c-txt-peru { color: hsl(30, 59%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:0, html.var.auto .sf-c-txt-peru\:0 { color: hsl(30, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:5, html.var.auto .sf-c-txt-peru\:5 { color: hsl(30, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:10, html.var.auto .sf-c-txt-peru\:10 { color: hsl(30, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:15, html.var.auto .sf-c-txt-peru\:15 { color: hsl(30, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:20, html.var.auto .sf-c-txt-peru\:20 { color: hsl(30, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:25, html.var.auto .sf-c-txt-peru\:25 { color: hsl(30, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:30, html.var.auto .sf-c-txt-peru\:30 { color: hsl(30, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:35, html.var.auto .sf-c-txt-peru\:35 { color: hsl(30, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:40, html.var.auto .sf-c-txt-peru\:40 { color: hsl(30, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:45, html.var.auto .sf-c-txt-peru\:45 { color: hsl(30, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:50, html.var.auto .sf-c-txt-peru\:50 { color: hsl(30, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:55, html.var.auto .sf-c-txt-peru\:55 { color: hsl(30, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:60, html.var.auto .sf-c-txt-peru\:60 { color: hsl(30, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:65, html.var.auto .sf-c-txt-peru\:65 { color: hsl(30, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:70, html.var.auto .sf-c-txt-peru\:70 { color: hsl(30, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:75, html.var.auto .sf-c-txt-peru\:75 { color: hsl(30, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:80, html.var.auto .sf-c-txt-peru\:80 { color: hsl(30, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:85, html.var.auto .sf-c-txt-peru\:85 { color: hsl(30, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:90, html.var.auto .sf-c-txt-peru\:90 { color: hsl(30, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:95, html.var.auto .sf-c-txt-peru\:95 { color: hsl(30, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:100, html.var.auto .sf-c-txt-peru\:100 { color: hsl(30, 59%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:dark, html.auto .sf-c-txt-peru\:dark { color: hsl(30, 59%, 53%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:0\:dark, html.auto .sf-c-txt-peru\:0\:dark { color: hsl(30, 59%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:5\:dark, html.auto .sf-c-txt-peru\:5\:dark { color: hsl(30, 59%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:10\:dark, html.auto .sf-c-txt-peru\:10\:dark { color: hsl(30, 59%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:15\:dark, html.auto .sf-c-txt-peru\:15\:dark { color: hsl(30, 59%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:20\:dark, html.auto .sf-c-txt-peru\:20\:dark { color: hsl(30, 59%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:25\:dark, html.auto .sf-c-txt-peru\:25\:dark { color: hsl(30, 59%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:30\:dark, html.auto .sf-c-txt-peru\:30\:dark { color: hsl(30, 59%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:35\:dark, html.auto .sf-c-txt-peru\:35\:dark { color: hsl(30, 59%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:40\:dark, html.auto .sf-c-txt-peru\:40\:dark { color: hsl(30, 59%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:45\:dark, html.auto .sf-c-txt-peru\:45\:dark { color: hsl(30, 59%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:50\:dark, html.auto .sf-c-txt-peru\:50\:dark { color: hsl(30, 59%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:55\:dark, html.auto .sf-c-txt-peru\:55\:dark { color: hsl(30, 59%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:60\:dark, html.auto .sf-c-txt-peru\:60\:dark { color: hsl(30, 59%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:65\:dark, html.auto .sf-c-txt-peru\:65\:dark { color: hsl(30, 59%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:70\:dark, html.auto .sf-c-txt-peru\:70\:dark { color: hsl(30, 59%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:75\:dark, html.auto .sf-c-txt-peru\:75\:dark { color: hsl(30, 59%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:80\:dark, html.auto .sf-c-txt-peru\:80\:dark { color: hsl(30, 59%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:85\:dark, html.auto .sf-c-txt-peru\:85\:dark { color: hsl(30, 59%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:90\:dark, html.auto .sf-c-txt-peru\:90\:dark { color: hsl(30, 59%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:95\:dark, html.auto .sf-c-txt-peru\:95\:dark { color: hsl(30, 59%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-peru\:100\:dark, html.auto .sf-c-txt-peru\:100\:dark { color: hsl(30, 59%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:dark, html.var.auto .sf-c-txt-peru\:dark { color: hsl(30, 59%, 53%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:0\:dark, html.var.auto .sf-c-txt-peru\:0\:dark { color: hsl(30, 59%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:5\:dark, html.var.auto .sf-c-txt-peru\:5\:dark { color: hsl(30, 59%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:10\:dark, html.var.auto .sf-c-txt-peru\:10\:dark { color: hsl(30, 59%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:15\:dark, html.var.auto .sf-c-txt-peru\:15\:dark { color: hsl(30, 59%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:20\:dark, html.var.auto .sf-c-txt-peru\:20\:dark { color: hsl(30, 59%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:25\:dark, html.var.auto .sf-c-txt-peru\:25\:dark { color: hsl(30, 59%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:30\:dark, html.var.auto .sf-c-txt-peru\:30\:dark { color: hsl(30, 59%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:35\:dark, html.var.auto .sf-c-txt-peru\:35\:dark { color: hsl(30, 59%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:40\:dark, html.var.auto .sf-c-txt-peru\:40\:dark { color: hsl(30, 59%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:45\:dark, html.var.auto .sf-c-txt-peru\:45\:dark { color: hsl(30, 59%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:50\:dark, html.var.auto .sf-c-txt-peru\:50\:dark { color: hsl(30, 59%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:55\:dark, html.var.auto .sf-c-txt-peru\:55\:dark { color: hsl(30, 59%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:60\:dark, html.var.auto .sf-c-txt-peru\:60\:dark { color: hsl(30, 59%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:65\:dark, html.var.auto .sf-c-txt-peru\:65\:dark { color: hsl(30, 59%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:70\:dark, html.var.auto .sf-c-txt-peru\:70\:dark { color: hsl(30, 59%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:75\:dark, html.var.auto .sf-c-txt-peru\:75\:dark { color: hsl(30, 59%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:80\:dark, html.var.auto .sf-c-txt-peru\:80\:dark { color: hsl(30, 59%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:85\:dark, html.var.auto .sf-c-txt-peru\:85\:dark { color: hsl(30, 59%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:90\:dark, html.var.auto .sf-c-txt-peru\:90\:dark { color: hsl(30, 59%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:95\:dark, html.var.auto .sf-c-txt-peru\:95\:dark { color: hsl(30, 59%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-peru\:100\:dark, html.var.auto .sf-c-txt-peru\:100\:dark { color: hsl(30, 59%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/pink.css b/src/colors/20/pink.css index 8a9aa76..e9e0f2d 100644 --- a/src/colors/20/pink.css +++ b/src/colors/20/pink.css @@ -1,4 +1,4 @@ -:root { +[class*='pink'] { --sf-c-pink: 350 100% 88%; --sf-c-pink-0: 350 100% 0%; --sf-c-pink-5: 350 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-pink\:100\:dark, html.dark .sf-c-txt-pink\ html.var[data-theme='auto'] .sf-c-pink\:95\:dark, html.var.auto .sf-c-pink\:95\:dark { color: hsl(350, 100%, 95%); background: hsl(350, 100%, 5%) } html.var[data-theme='auto'] .sf-c-pink\:100\:dark, html.var.auto .sf-c-pink\:100\:dark { color: hsl(350, 100%, 95%); background: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink, html.auto .sf-c-txt-pink { color: hsl(350, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:0, html.auto .sf-c-txt-pink\:0 { color: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:5, html.auto .sf-c-txt-pink\:5 { color: hsl(350, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:10, html.auto .sf-c-txt-pink\:10 { color: hsl(350, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:15, html.auto .sf-c-txt-pink\:15 { color: hsl(350, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:20, html.auto .sf-c-txt-pink\:20 { color: hsl(350, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:25, html.auto .sf-c-txt-pink\:25 { color: hsl(350, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:30, html.auto .sf-c-txt-pink\:30 { color: hsl(350, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:35, html.auto .sf-c-txt-pink\:35 { color: hsl(350, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:40, html.auto .sf-c-txt-pink\:40 { color: hsl(350, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:45, html.auto .sf-c-txt-pink\:45 { color: hsl(350, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:50, html.auto .sf-c-txt-pink\:50 { color: hsl(350, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:55, html.auto .sf-c-txt-pink\:55 { color: hsl(350, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:60, html.auto .sf-c-txt-pink\:60 { color: hsl(350, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:65, html.auto .sf-c-txt-pink\:65 { color: hsl(350, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:70, html.auto .sf-c-txt-pink\:70 { color: hsl(350, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:75, html.auto .sf-c-txt-pink\:75 { color: hsl(350, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:80, html.auto .sf-c-txt-pink\:80 { color: hsl(350, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:85, html.auto .sf-c-txt-pink\:85 { color: hsl(350, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:90, html.auto .sf-c-txt-pink\:90 { color: hsl(350, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:95, html.auto .sf-c-txt-pink\:95 { color: hsl(350, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:100, html.auto .sf-c-txt-pink\:100 { color: hsl(350, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-pink, html.var.auto .sf-c-txt-pink { color: hsl(350, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:0, html.var.auto .sf-c-txt-pink\:0 { color: hsl(350, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:5, html.var.auto .sf-c-txt-pink\:5 { color: hsl(350, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:10, html.var.auto .sf-c-txt-pink\:10 { color: hsl(350, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:15, html.var.auto .sf-c-txt-pink\:15 { color: hsl(350, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:20, html.var.auto .sf-c-txt-pink\:20 { color: hsl(350, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:25, html.var.auto .sf-c-txt-pink\:25 { color: hsl(350, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:30, html.var.auto .sf-c-txt-pink\:30 { color: hsl(350, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:35, html.var.auto .sf-c-txt-pink\:35 { color: hsl(350, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:40, html.var.auto .sf-c-txt-pink\:40 { color: hsl(350, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:45, html.var.auto .sf-c-txt-pink\:45 { color: hsl(350, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:50, html.var.auto .sf-c-txt-pink\:50 { color: hsl(350, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:55, html.var.auto .sf-c-txt-pink\:55 { color: hsl(350, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:60, html.var.auto .sf-c-txt-pink\:60 { color: hsl(350, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:65, html.var.auto .sf-c-txt-pink\:65 { color: hsl(350, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:70, html.var.auto .sf-c-txt-pink\:70 { color: hsl(350, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:75, html.var.auto .sf-c-txt-pink\:75 { color: hsl(350, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:80, html.var.auto .sf-c-txt-pink\:80 { color: hsl(350, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:85, html.var.auto .sf-c-txt-pink\:85 { color: hsl(350, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:90, html.var.auto .sf-c-txt-pink\:90 { color: hsl(350, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:95, html.var.auto .sf-c-txt-pink\:95 { color: hsl(350, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:100, html.var.auto .sf-c-txt-pink\:100 { color: hsl(350, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:dark, html.auto .sf-c-txt-pink\:dark { color: hsl(350, 100%, 88%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:0\:dark, html.auto .sf-c-txt-pink\:0\:dark { color: hsl(350, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:5\:dark, html.auto .sf-c-txt-pink\:5\:dark { color: hsl(350, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:10\:dark, html.auto .sf-c-txt-pink\:10\:dark { color: hsl(350, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:15\:dark, html.auto .sf-c-txt-pink\:15\:dark { color: hsl(350, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:20\:dark, html.auto .sf-c-txt-pink\:20\:dark { color: hsl(350, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:25\:dark, html.auto .sf-c-txt-pink\:25\:dark { color: hsl(350, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:30\:dark, html.auto .sf-c-txt-pink\:30\:dark { color: hsl(350, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:35\:dark, html.auto .sf-c-txt-pink\:35\:dark { color: hsl(350, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:40\:dark, html.auto .sf-c-txt-pink\:40\:dark { color: hsl(350, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:45\:dark, html.auto .sf-c-txt-pink\:45\:dark { color: hsl(350, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:50\:dark, html.auto .sf-c-txt-pink\:50\:dark { color: hsl(350, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:55\:dark, html.auto .sf-c-txt-pink\:55\:dark { color: hsl(350, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:60\:dark, html.auto .sf-c-txt-pink\:60\:dark { color: hsl(350, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:65\:dark, html.auto .sf-c-txt-pink\:65\:dark { color: hsl(350, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:70\:dark, html.auto .sf-c-txt-pink\:70\:dark { color: hsl(350, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:75\:dark, html.auto .sf-c-txt-pink\:75\:dark { color: hsl(350, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:80\:dark, html.auto .sf-c-txt-pink\:80\:dark { color: hsl(350, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:85\:dark, html.auto .sf-c-txt-pink\:85\:dark { color: hsl(350, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:90\:dark, html.auto .sf-c-txt-pink\:90\:dark { color: hsl(350, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:95\:dark, html.auto .sf-c-txt-pink\:95\:dark { color: hsl(350, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-pink\:100\:dark, html.auto .sf-c-txt-pink\:100\:dark { color: hsl(350, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:dark, html.var.auto .sf-c-txt-pink\:dark { color: hsl(350, 100%, 88%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:0\:dark, html.var.auto .sf-c-txt-pink\:0\:dark { color: hsl(350, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:5\:dark, html.var.auto .sf-c-txt-pink\:5\:dark { color: hsl(350, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:10\:dark, html.var.auto .sf-c-txt-pink\:10\:dark { color: hsl(350, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:15\:dark, html.var.auto .sf-c-txt-pink\:15\:dark { color: hsl(350, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:20\:dark, html.var.auto .sf-c-txt-pink\:20\:dark { color: hsl(350, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:25\:dark, html.var.auto .sf-c-txt-pink\:25\:dark { color: hsl(350, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:30\:dark, html.var.auto .sf-c-txt-pink\:30\:dark { color: hsl(350, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:35\:dark, html.var.auto .sf-c-txt-pink\:35\:dark { color: hsl(350, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:40\:dark, html.var.auto .sf-c-txt-pink\:40\:dark { color: hsl(350, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:45\:dark, html.var.auto .sf-c-txt-pink\:45\:dark { color: hsl(350, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:50\:dark, html.var.auto .sf-c-txt-pink\:50\:dark { color: hsl(350, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:55\:dark, html.var.auto .sf-c-txt-pink\:55\:dark { color: hsl(350, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:60\:dark, html.var.auto .sf-c-txt-pink\:60\:dark { color: hsl(350, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:65\:dark, html.var.auto .sf-c-txt-pink\:65\:dark { color: hsl(350, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:70\:dark, html.var.auto .sf-c-txt-pink\:70\:dark { color: hsl(350, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:75\:dark, html.var.auto .sf-c-txt-pink\:75\:dark { color: hsl(350, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:80\:dark, html.var.auto .sf-c-txt-pink\:80\:dark { color: hsl(350, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:85\:dark, html.var.auto .sf-c-txt-pink\:85\:dark { color: hsl(350, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:90\:dark, html.var.auto .sf-c-txt-pink\:90\:dark { color: hsl(350, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:95\:dark, html.var.auto .sf-c-txt-pink\:95\:dark { color: hsl(350, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-pink\:100\:dark, html.var.auto .sf-c-txt-pink\:100\:dark { color: hsl(350, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/plum.css b/src/colors/20/plum.css index da2f9d0..680f2dc 100644 --- a/src/colors/20/plum.css +++ b/src/colors/20/plum.css @@ -1,4 +1,4 @@ -:root { +[class*='plum'] { --sf-c-plum: 300 47% 75%; --sf-c-plum-0: 300 47% 0%; --sf-c-plum-5: 300 47% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-plum\:100\:dark, html.dark .sf-c-txt-plum\ html.var[data-theme='auto'] .sf-c-plum\:95\:dark, html.var.auto .sf-c-plum\:95\:dark { color: hsl(300, 47%, 95%); background: hsl(300, 47%, 5%) } html.var[data-theme='auto'] .sf-c-plum\:100\:dark, html.var.auto .sf-c-plum\:100\:dark { color: hsl(300, 47%, 95%); background: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum, html.auto .sf-c-txt-plum { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:0, html.auto .sf-c-txt-plum\:0 { color: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:5, html.auto .sf-c-txt-plum\:5 { color: hsl(300, 47%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:10, html.auto .sf-c-txt-plum\:10 { color: hsl(300, 47%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:15, html.auto .sf-c-txt-plum\:15 { color: hsl(300, 47%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:20, html.auto .sf-c-txt-plum\:20 { color: hsl(300, 47%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:25, html.auto .sf-c-txt-plum\:25 { color: hsl(300, 47%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:30, html.auto .sf-c-txt-plum\:30 { color: hsl(300, 47%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:35, html.auto .sf-c-txt-plum\:35 { color: hsl(300, 47%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:40, html.auto .sf-c-txt-plum\:40 { color: hsl(300, 47%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:45, html.auto .sf-c-txt-plum\:45 { color: hsl(300, 47%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:50, html.auto .sf-c-txt-plum\:50 { color: hsl(300, 47%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:55, html.auto .sf-c-txt-plum\:55 { color: hsl(300, 47%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:60, html.auto .sf-c-txt-plum\:60 { color: hsl(300, 47%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:65, html.auto .sf-c-txt-plum\:65 { color: hsl(300, 47%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:70, html.auto .sf-c-txt-plum\:70 { color: hsl(300, 47%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:75, html.auto .sf-c-txt-plum\:75 { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:80, html.auto .sf-c-txt-plum\:80 { color: hsl(300, 47%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:85, html.auto .sf-c-txt-plum\:85 { color: hsl(300, 47%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:90, html.auto .sf-c-txt-plum\:90 { color: hsl(300, 47%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:95, html.auto .sf-c-txt-plum\:95 { color: hsl(300, 47%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:100, html.auto .sf-c-txt-plum\:100 { color: hsl(300, 47%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-plum, html.var.auto .sf-c-txt-plum { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:0, html.var.auto .sf-c-txt-plum\:0 { color: hsl(300, 47%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:5, html.var.auto .sf-c-txt-plum\:5 { color: hsl(300, 47%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:10, html.var.auto .sf-c-txt-plum\:10 { color: hsl(300, 47%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:15, html.var.auto .sf-c-txt-plum\:15 { color: hsl(300, 47%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:20, html.var.auto .sf-c-txt-plum\:20 { color: hsl(300, 47%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:25, html.var.auto .sf-c-txt-plum\:25 { color: hsl(300, 47%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:30, html.var.auto .sf-c-txt-plum\:30 { color: hsl(300, 47%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:35, html.var.auto .sf-c-txt-plum\:35 { color: hsl(300, 47%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:40, html.var.auto .sf-c-txt-plum\:40 { color: hsl(300, 47%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:45, html.var.auto .sf-c-txt-plum\:45 { color: hsl(300, 47%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:50, html.var.auto .sf-c-txt-plum\:50 { color: hsl(300, 47%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:55, html.var.auto .sf-c-txt-plum\:55 { color: hsl(300, 47%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:60, html.var.auto .sf-c-txt-plum\:60 { color: hsl(300, 47%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:65, html.var.auto .sf-c-txt-plum\:65 { color: hsl(300, 47%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:70, html.var.auto .sf-c-txt-plum\:70 { color: hsl(300, 47%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:75, html.var.auto .sf-c-txt-plum\:75 { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:80, html.var.auto .sf-c-txt-plum\:80 { color: hsl(300, 47%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:85, html.var.auto .sf-c-txt-plum\:85 { color: hsl(300, 47%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:90, html.var.auto .sf-c-txt-plum\:90 { color: hsl(300, 47%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:95, html.var.auto .sf-c-txt-plum\:95 { color: hsl(300, 47%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:100, html.var.auto .sf-c-txt-plum\:100 { color: hsl(300, 47%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:dark, html.auto .sf-c-txt-plum\:dark { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:0\:dark, html.auto .sf-c-txt-plum\:0\:dark { color: hsl(300, 47%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:5\:dark, html.auto .sf-c-txt-plum\:5\:dark { color: hsl(300, 47%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:10\:dark, html.auto .sf-c-txt-plum\:10\:dark { color: hsl(300, 47%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:15\:dark, html.auto .sf-c-txt-plum\:15\:dark { color: hsl(300, 47%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:20\:dark, html.auto .sf-c-txt-plum\:20\:dark { color: hsl(300, 47%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:25\:dark, html.auto .sf-c-txt-plum\:25\:dark { color: hsl(300, 47%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:30\:dark, html.auto .sf-c-txt-plum\:30\:dark { color: hsl(300, 47%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:35\:dark, html.auto .sf-c-txt-plum\:35\:dark { color: hsl(300, 47%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:40\:dark, html.auto .sf-c-txt-plum\:40\:dark { color: hsl(300, 47%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:45\:dark, html.auto .sf-c-txt-plum\:45\:dark { color: hsl(300, 47%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:50\:dark, html.auto .sf-c-txt-plum\:50\:dark { color: hsl(300, 47%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:55\:dark, html.auto .sf-c-txt-plum\:55\:dark { color: hsl(300, 47%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:60\:dark, html.auto .sf-c-txt-plum\:60\:dark { color: hsl(300, 47%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:65\:dark, html.auto .sf-c-txt-plum\:65\:dark { color: hsl(300, 47%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:70\:dark, html.auto .sf-c-txt-plum\:70\:dark { color: hsl(300, 47%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:75\:dark, html.auto .sf-c-txt-plum\:75\:dark { color: hsl(300, 47%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:80\:dark, html.auto .sf-c-txt-plum\:80\:dark { color: hsl(300, 47%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:85\:dark, html.auto .sf-c-txt-plum\:85\:dark { color: hsl(300, 47%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:90\:dark, html.auto .sf-c-txt-plum\:90\:dark { color: hsl(300, 47%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:95\:dark, html.auto .sf-c-txt-plum\:95\:dark { color: hsl(300, 47%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-plum\:100\:dark, html.auto .sf-c-txt-plum\:100\:dark { color: hsl(300, 47%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:dark, html.var.auto .sf-c-txt-plum\:dark { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:0\:dark, html.var.auto .sf-c-txt-plum\:0\:dark { color: hsl(300, 47%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:5\:dark, html.var.auto .sf-c-txt-plum\:5\:dark { color: hsl(300, 47%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:10\:dark, html.var.auto .sf-c-txt-plum\:10\:dark { color: hsl(300, 47%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:15\:dark, html.var.auto .sf-c-txt-plum\:15\:dark { color: hsl(300, 47%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:20\:dark, html.var.auto .sf-c-txt-plum\:20\:dark { color: hsl(300, 47%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:25\:dark, html.var.auto .sf-c-txt-plum\:25\:dark { color: hsl(300, 47%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:30\:dark, html.var.auto .sf-c-txt-plum\:30\:dark { color: hsl(300, 47%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:35\:dark, html.var.auto .sf-c-txt-plum\:35\:dark { color: hsl(300, 47%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:40\:dark, html.var.auto .sf-c-txt-plum\:40\:dark { color: hsl(300, 47%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:45\:dark, html.var.auto .sf-c-txt-plum\:45\:dark { color: hsl(300, 47%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:50\:dark, html.var.auto .sf-c-txt-plum\:50\:dark { color: hsl(300, 47%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:55\:dark, html.var.auto .sf-c-txt-plum\:55\:dark { color: hsl(300, 47%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:60\:dark, html.var.auto .sf-c-txt-plum\:60\:dark { color: hsl(300, 47%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:65\:dark, html.var.auto .sf-c-txt-plum\:65\:dark { color: hsl(300, 47%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:70\:dark, html.var.auto .sf-c-txt-plum\:70\:dark { color: hsl(300, 47%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:75\:dark, html.var.auto .sf-c-txt-plum\:75\:dark { color: hsl(300, 47%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:80\:dark, html.var.auto .sf-c-txt-plum\:80\:dark { color: hsl(300, 47%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:85\:dark, html.var.auto .sf-c-txt-plum\:85\:dark { color: hsl(300, 47%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:90\:dark, html.var.auto .sf-c-txt-plum\:90\:dark { color: hsl(300, 47%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:95\:dark, html.var.auto .sf-c-txt-plum\:95\:dark { color: hsl(300, 47%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-plum\:100\:dark, html.var.auto .sf-c-txt-plum\:100\:dark { color: hsl(300, 47%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/powderblue.css b/src/colors/20/powderblue.css index e3b725a..6adf2ff 100644 --- a/src/colors/20/powderblue.css +++ b/src/colors/20/powderblue.css @@ -1,4 +1,4 @@ -:root { +[class*='powderblue'] { --sf-c-powderblue: 187 52% 80%; --sf-c-powderblue-0: 187 52% 0%; --sf-c-powderblue-5: 187 52% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-powderblue\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-powderblue\:95\:dark, html.var.auto .sf-c-powderblue\:95\:dark { color: hsl(187, 52%, 95%); background: hsl(187, 52%, 5%) } html.var[data-theme='auto'] .sf-c-powderblue\:100\:dark, html.var.auto .sf-c-powderblue\:100\:dark { color: hsl(187, 52%, 95%); background: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue, html.auto .sf-c-txt-powderblue { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:0, html.auto .sf-c-txt-powderblue\:0 { color: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:5, html.auto .sf-c-txt-powderblue\:5 { color: hsl(187, 52%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:10, html.auto .sf-c-txt-powderblue\:10 { color: hsl(187, 52%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:15, html.auto .sf-c-txt-powderblue\:15 { color: hsl(187, 52%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:20, html.auto .sf-c-txt-powderblue\:20 { color: hsl(187, 52%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:25, html.auto .sf-c-txt-powderblue\:25 { color: hsl(187, 52%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:30, html.auto .sf-c-txt-powderblue\:30 { color: hsl(187, 52%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:35, html.auto .sf-c-txt-powderblue\:35 { color: hsl(187, 52%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:40, html.auto .sf-c-txt-powderblue\:40 { color: hsl(187, 52%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:45, html.auto .sf-c-txt-powderblue\:45 { color: hsl(187, 52%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:50, html.auto .sf-c-txt-powderblue\:50 { color: hsl(187, 52%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:55, html.auto .sf-c-txt-powderblue\:55 { color: hsl(187, 52%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:60, html.auto .sf-c-txt-powderblue\:60 { color: hsl(187, 52%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:65, html.auto .sf-c-txt-powderblue\:65 { color: hsl(187, 52%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:70, html.auto .sf-c-txt-powderblue\:70 { color: hsl(187, 52%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:75, html.auto .sf-c-txt-powderblue\:75 { color: hsl(187, 52%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:80, html.auto .sf-c-txt-powderblue\:80 { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:85, html.auto .sf-c-txt-powderblue\:85 { color: hsl(187, 52%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:90, html.auto .sf-c-txt-powderblue\:90 { color: hsl(187, 52%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:95, html.auto .sf-c-txt-powderblue\:95 { color: hsl(187, 52%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:100, html.auto .sf-c-txt-powderblue\:100 { color: hsl(187, 52%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue, html.var.auto .sf-c-txt-powderblue { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:0, html.var.auto .sf-c-txt-powderblue\:0 { color: hsl(187, 52%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:5, html.var.auto .sf-c-txt-powderblue\:5 { color: hsl(187, 52%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:10, html.var.auto .sf-c-txt-powderblue\:10 { color: hsl(187, 52%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:15, html.var.auto .sf-c-txt-powderblue\:15 { color: hsl(187, 52%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:20, html.var.auto .sf-c-txt-powderblue\:20 { color: hsl(187, 52%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:25, html.var.auto .sf-c-txt-powderblue\:25 { color: hsl(187, 52%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:30, html.var.auto .sf-c-txt-powderblue\:30 { color: hsl(187, 52%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:35, html.var.auto .sf-c-txt-powderblue\:35 { color: hsl(187, 52%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:40, html.var.auto .sf-c-txt-powderblue\:40 { color: hsl(187, 52%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:45, html.var.auto .sf-c-txt-powderblue\:45 { color: hsl(187, 52%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:50, html.var.auto .sf-c-txt-powderblue\:50 { color: hsl(187, 52%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:55, html.var.auto .sf-c-txt-powderblue\:55 { color: hsl(187, 52%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:60, html.var.auto .sf-c-txt-powderblue\:60 { color: hsl(187, 52%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:65, html.var.auto .sf-c-txt-powderblue\:65 { color: hsl(187, 52%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:70, html.var.auto .sf-c-txt-powderblue\:70 { color: hsl(187, 52%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:75, html.var.auto .sf-c-txt-powderblue\:75 { color: hsl(187, 52%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:80, html.var.auto .sf-c-txt-powderblue\:80 { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:85, html.var.auto .sf-c-txt-powderblue\:85 { color: hsl(187, 52%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:90, html.var.auto .sf-c-txt-powderblue\:90 { color: hsl(187, 52%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:95, html.var.auto .sf-c-txt-powderblue\:95 { color: hsl(187, 52%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:100, html.var.auto .sf-c-txt-powderblue\:100 { color: hsl(187, 52%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:dark, html.auto .sf-c-txt-powderblue\:dark { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:0\:dark, html.auto .sf-c-txt-powderblue\:0\:dark { color: hsl(187, 52%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:5\:dark, html.auto .sf-c-txt-powderblue\:5\:dark { color: hsl(187, 52%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:10\:dark, html.auto .sf-c-txt-powderblue\:10\:dark { color: hsl(187, 52%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:15\:dark, html.auto .sf-c-txt-powderblue\:15\:dark { color: hsl(187, 52%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:20\:dark, html.auto .sf-c-txt-powderblue\:20\:dark { color: hsl(187, 52%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:25\:dark, html.auto .sf-c-txt-powderblue\:25\:dark { color: hsl(187, 52%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:30\:dark, html.auto .sf-c-txt-powderblue\:30\:dark { color: hsl(187, 52%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:35\:dark, html.auto .sf-c-txt-powderblue\:35\:dark { color: hsl(187, 52%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:40\:dark, html.auto .sf-c-txt-powderblue\:40\:dark { color: hsl(187, 52%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:45\:dark, html.auto .sf-c-txt-powderblue\:45\:dark { color: hsl(187, 52%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:50\:dark, html.auto .sf-c-txt-powderblue\:50\:dark { color: hsl(187, 52%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:55\:dark, html.auto .sf-c-txt-powderblue\:55\:dark { color: hsl(187, 52%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:60\:dark, html.auto .sf-c-txt-powderblue\:60\:dark { color: hsl(187, 52%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:65\:dark, html.auto .sf-c-txt-powderblue\:65\:dark { color: hsl(187, 52%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:70\:dark, html.auto .sf-c-txt-powderblue\:70\:dark { color: hsl(187, 52%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:75\:dark, html.auto .sf-c-txt-powderblue\:75\:dark { color: hsl(187, 52%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:80\:dark, html.auto .sf-c-txt-powderblue\:80\:dark { color: hsl(187, 52%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:85\:dark, html.auto .sf-c-txt-powderblue\:85\:dark { color: hsl(187, 52%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:90\:dark, html.auto .sf-c-txt-powderblue\:90\:dark { color: hsl(187, 52%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:95\:dark, html.auto .sf-c-txt-powderblue\:95\:dark { color: hsl(187, 52%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-powderblue\:100\:dark, html.auto .sf-c-txt-powderblue\:100\:dark { color: hsl(187, 52%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:dark, html.var.auto .sf-c-txt-powderblue\:dark { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:0\:dark, html.var.auto .sf-c-txt-powderblue\:0\:dark { color: hsl(187, 52%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:5\:dark, html.var.auto .sf-c-txt-powderblue\:5\:dark { color: hsl(187, 52%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:10\:dark, html.var.auto .sf-c-txt-powderblue\:10\:dark { color: hsl(187, 52%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:15\:dark, html.var.auto .sf-c-txt-powderblue\:15\:dark { color: hsl(187, 52%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:20\:dark, html.var.auto .sf-c-txt-powderblue\:20\:dark { color: hsl(187, 52%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:25\:dark, html.var.auto .sf-c-txt-powderblue\:25\:dark { color: hsl(187, 52%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:30\:dark, html.var.auto .sf-c-txt-powderblue\:30\:dark { color: hsl(187, 52%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:35\:dark, html.var.auto .sf-c-txt-powderblue\:35\:dark { color: hsl(187, 52%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:40\:dark, html.var.auto .sf-c-txt-powderblue\:40\:dark { color: hsl(187, 52%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:45\:dark, html.var.auto .sf-c-txt-powderblue\:45\:dark { color: hsl(187, 52%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:50\:dark, html.var.auto .sf-c-txt-powderblue\:50\:dark { color: hsl(187, 52%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:55\:dark, html.var.auto .sf-c-txt-powderblue\:55\:dark { color: hsl(187, 52%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:60\:dark, html.var.auto .sf-c-txt-powderblue\:60\:dark { color: hsl(187, 52%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:65\:dark, html.var.auto .sf-c-txt-powderblue\:65\:dark { color: hsl(187, 52%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:70\:dark, html.var.auto .sf-c-txt-powderblue\:70\:dark { color: hsl(187, 52%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:75\:dark, html.var.auto .sf-c-txt-powderblue\:75\:dark { color: hsl(187, 52%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:80\:dark, html.var.auto .sf-c-txt-powderblue\:80\:dark { color: hsl(187, 52%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:85\:dark, html.var.auto .sf-c-txt-powderblue\:85\:dark { color: hsl(187, 52%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:90\:dark, html.var.auto .sf-c-txt-powderblue\:90\:dark { color: hsl(187, 52%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:95\:dark, html.var.auto .sf-c-txt-powderblue\:95\:dark { color: hsl(187, 52%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-powderblue\:100\:dark, html.var.auto .sf-c-txt-powderblue\:100\:dark { color: hsl(187, 52%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/purple.css b/src/colors/20/purple.css index 42791a8..7182e75 100644 --- a/src/colors/20/purple.css +++ b/src/colors/20/purple.css @@ -1,4 +1,4 @@ -:root { +[class*='purple'] { --sf-c-purple: 300 100% 25%; --sf-c-purple-0: 300 100% 0%; --sf-c-purple-5: 300 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-purple\:100\:dark, html.dark .sf-c-txt-pur html.var[data-theme='auto'] .sf-c-purple\:95\:dark, html.var.auto .sf-c-purple\:95\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 5%) } html.var[data-theme='auto'] .sf-c-purple\:100\:dark, html.var.auto .sf-c-purple\:100\:dark { color: hsl(300, 100%, 95%); background: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple, html.auto .sf-c-txt-purple { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:0, html.auto .sf-c-txt-purple\:0 { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:5, html.auto .sf-c-txt-purple\:5 { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:10, html.auto .sf-c-txt-purple\:10 { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:15, html.auto .sf-c-txt-purple\:15 { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:20, html.auto .sf-c-txt-purple\:20 { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:25, html.auto .sf-c-txt-purple\:25 { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:30, html.auto .sf-c-txt-purple\:30 { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:35, html.auto .sf-c-txt-purple\:35 { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:40, html.auto .sf-c-txt-purple\:40 { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:45, html.auto .sf-c-txt-purple\:45 { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:50, html.auto .sf-c-txt-purple\:50 { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:55, html.auto .sf-c-txt-purple\:55 { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:60, html.auto .sf-c-txt-purple\:60 { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:65, html.auto .sf-c-txt-purple\:65 { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:70, html.auto .sf-c-txt-purple\:70 { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:75, html.auto .sf-c-txt-purple\:75 { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:80, html.auto .sf-c-txt-purple\:80 { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:85, html.auto .sf-c-txt-purple\:85 { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:90, html.auto .sf-c-txt-purple\:90 { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:95, html.auto .sf-c-txt-purple\:95 { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:100, html.auto .sf-c-txt-purple\:100 { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-purple, html.var.auto .sf-c-txt-purple { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:0, html.var.auto .sf-c-txt-purple\:0 { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:5, html.var.auto .sf-c-txt-purple\:5 { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:10, html.var.auto .sf-c-txt-purple\:10 { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:15, html.var.auto .sf-c-txt-purple\:15 { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:20, html.var.auto .sf-c-txt-purple\:20 { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:25, html.var.auto .sf-c-txt-purple\:25 { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:30, html.var.auto .sf-c-txt-purple\:30 { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:35, html.var.auto .sf-c-txt-purple\:35 { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:40, html.var.auto .sf-c-txt-purple\:40 { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:45, html.var.auto .sf-c-txt-purple\:45 { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:50, html.var.auto .sf-c-txt-purple\:50 { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:55, html.var.auto .sf-c-txt-purple\:55 { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:60, html.var.auto .sf-c-txt-purple\:60 { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:65, html.var.auto .sf-c-txt-purple\:65 { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:70, html.var.auto .sf-c-txt-purple\:70 { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:75, html.var.auto .sf-c-txt-purple\:75 { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:80, html.var.auto .sf-c-txt-purple\:80 { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:85, html.var.auto .sf-c-txt-purple\:85 { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:90, html.var.auto .sf-c-txt-purple\:90 { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:95, html.var.auto .sf-c-txt-purple\:95 { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:100, html.var.auto .sf-c-txt-purple\:100 { color: hsl(300, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:dark, html.auto .sf-c-txt-purple\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark, html.auto .sf-c-txt-purple\:0\:dark { color: hsl(300, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:5\:dark, html.auto .sf-c-txt-purple\:5\:dark { color: hsl(300, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark, html.auto .sf-c-txt-purple\:10\:dark { color: hsl(300, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:15\:dark, html.auto .sf-c-txt-purple\:15\:dark { color: hsl(300, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark, html.auto .sf-c-txt-purple\:20\:dark { color: hsl(300, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:25\:dark, html.auto .sf-c-txt-purple\:25\:dark { color: hsl(300, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark, html.auto .sf-c-txt-purple\:30\:dark { color: hsl(300, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:35\:dark, html.auto .sf-c-txt-purple\:35\:dark { color: hsl(300, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark, html.auto .sf-c-txt-purple\:40\:dark { color: hsl(300, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:45\:dark, html.auto .sf-c-txt-purple\:45\:dark { color: hsl(300, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark, html.auto .sf-c-txt-purple\:50\:dark { color: hsl(300, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:55\:dark, html.auto .sf-c-txt-purple\:55\:dark { color: hsl(300, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark, html.auto .sf-c-txt-purple\:60\:dark { color: hsl(300, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:65\:dark, html.auto .sf-c-txt-purple\:65\:dark { color: hsl(300, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark, html.auto .sf-c-txt-purple\:70\:dark { color: hsl(300, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:75\:dark, html.auto .sf-c-txt-purple\:75\:dark { color: hsl(300, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark, html.auto .sf-c-txt-purple\:80\:dark { color: hsl(300, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:85\:dark, html.auto .sf-c-txt-purple\:85\:dark { color: hsl(300, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark, html.auto .sf-c-txt-purple\:90\:dark { color: hsl(300, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:95\:dark, html.auto .sf-c-txt-purple\:95\:dark { color: hsl(300, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark, html.auto .sf-c-txt-purple\:100\:dark { color: hsl(300, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:dark, html.var.auto .sf-c-txt-purple\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark, html.var.auto .sf-c-txt-purple\:0\:dark { color: hsl(300, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:5\:dark, html.var.auto .sf-c-txt-purple\:5\:dark { color: hsl(300, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark, html.var.auto .sf-c-txt-purple\:10\:dark { color: hsl(300, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:15\:dark, html.var.auto .sf-c-txt-purple\:15\:dark { color: hsl(300, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark, html.var.auto .sf-c-txt-purple\:20\:dark { color: hsl(300, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:25\:dark, html.var.auto .sf-c-txt-purple\:25\:dark { color: hsl(300, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark, html.var.auto .sf-c-txt-purple\:30\:dark { color: hsl(300, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:35\:dark, html.var.auto .sf-c-txt-purple\:35\:dark { color: hsl(300, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark, html.var.auto .sf-c-txt-purple\:40\:dark { color: hsl(300, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:45\:dark, html.var.auto .sf-c-txt-purple\:45\:dark { color: hsl(300, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark, html.var.auto .sf-c-txt-purple\:50\:dark { color: hsl(300, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:55\:dark, html.var.auto .sf-c-txt-purple\:55\:dark { color: hsl(300, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark, html.var.auto .sf-c-txt-purple\:60\:dark { color: hsl(300, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:65\:dark, html.var.auto .sf-c-txt-purple\:65\:dark { color: hsl(300, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark, html.var.auto .sf-c-txt-purple\:70\:dark { color: hsl(300, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:75\:dark, html.var.auto .sf-c-txt-purple\:75\:dark { color: hsl(300, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark, html.var.auto .sf-c-txt-purple\:80\:dark { color: hsl(300, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:85\:dark, html.var.auto .sf-c-txt-purple\:85\:dark { color: hsl(300, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark, html.var.auto .sf-c-txt-purple\:90\:dark { color: hsl(300, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:95\:dark, html.var.auto .sf-c-txt-purple\:95\:dark { color: hsl(300, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark, html.var.auto .sf-c-txt-purple\:100\:dark { color: hsl(300, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/rebeccapurple.css b/src/colors/20/rebeccapurple.css index 1805a95..67b2643 100644 --- a/src/colors/20/rebeccapurple.css +++ b/src/colors/20/rebeccapurple.css @@ -1,4 +1,4 @@ -:root { +[class*='rebeccapurple'] { --sf-c-rebeccapurple: 270 50% 40%; --sf-c-rebeccapurple-0: 270 50% 0%; --sf-c-rebeccapurple-5: 270 50% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-rebeccapurple\:100\:dark, html.dark .sf-c- html.var[data-theme='auto'] .sf-c-rebeccapurple\:95\:dark, html.var.auto .sf-c-rebeccapurple\:95\:dark { color: hsl(270, 50%, 95%); background: hsl(270, 50%, 5%) } html.var[data-theme='auto'] .sf-c-rebeccapurple\:100\:dark, html.var.auto .sf-c-rebeccapurple\:100\:dark { color: hsl(270, 50%, 95%); background: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple, html.auto .sf-c-txt-rebeccapurple { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0, html.auto .sf-c-txt-rebeccapurple\:0 { color: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:5, html.auto .sf-c-txt-rebeccapurple\:5 { color: hsl(270, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10, html.auto .sf-c-txt-rebeccapurple\:10 { color: hsl(270, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:15, html.auto .sf-c-txt-rebeccapurple\:15 { color: hsl(270, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20, html.auto .sf-c-txt-rebeccapurple\:20 { color: hsl(270, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:25, html.auto .sf-c-txt-rebeccapurple\:25 { color: hsl(270, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30, html.auto .sf-c-txt-rebeccapurple\:30 { color: hsl(270, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:35, html.auto .sf-c-txt-rebeccapurple\:35 { color: hsl(270, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40, html.auto .sf-c-txt-rebeccapurple\:40 { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:45, html.auto .sf-c-txt-rebeccapurple\:45 { color: hsl(270, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50, html.auto .sf-c-txt-rebeccapurple\:50 { color: hsl(270, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:55, html.auto .sf-c-txt-rebeccapurple\:55 { color: hsl(270, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60, html.auto .sf-c-txt-rebeccapurple\:60 { color: hsl(270, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:65, html.auto .sf-c-txt-rebeccapurple\:65 { color: hsl(270, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70, html.auto .sf-c-txt-rebeccapurple\:70 { color: hsl(270, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:75, html.auto .sf-c-txt-rebeccapurple\:75 { color: hsl(270, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80, html.auto .sf-c-txt-rebeccapurple\:80 { color: hsl(270, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:85, html.auto .sf-c-txt-rebeccapurple\:85 { color: hsl(270, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90, html.auto .sf-c-txt-rebeccapurple\:90 { color: hsl(270, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:95, html.auto .sf-c-txt-rebeccapurple\:95 { color: hsl(270, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100, html.auto .sf-c-txt-rebeccapurple\:100 { color: hsl(270, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple, html.var.auto .sf-c-txt-rebeccapurple { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0, html.var.auto .sf-c-txt-rebeccapurple\:0 { color: hsl(270, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:5, html.var.auto .sf-c-txt-rebeccapurple\:5 { color: hsl(270, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10, html.var.auto .sf-c-txt-rebeccapurple\:10 { color: hsl(270, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:15, html.var.auto .sf-c-txt-rebeccapurple\:15 { color: hsl(270, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20, html.var.auto .sf-c-txt-rebeccapurple\:20 { color: hsl(270, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:25, html.var.auto .sf-c-txt-rebeccapurple\:25 { color: hsl(270, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30, html.var.auto .sf-c-txt-rebeccapurple\:30 { color: hsl(270, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:35, html.var.auto .sf-c-txt-rebeccapurple\:35 { color: hsl(270, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40, html.var.auto .sf-c-txt-rebeccapurple\:40 { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:45, html.var.auto .sf-c-txt-rebeccapurple\:45 { color: hsl(270, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50, html.var.auto .sf-c-txt-rebeccapurple\:50 { color: hsl(270, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:55, html.var.auto .sf-c-txt-rebeccapurple\:55 { color: hsl(270, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60, html.var.auto .sf-c-txt-rebeccapurple\:60 { color: hsl(270, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:65, html.var.auto .sf-c-txt-rebeccapurple\:65 { color: hsl(270, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70, html.var.auto .sf-c-txt-rebeccapurple\:70 { color: hsl(270, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:75, html.var.auto .sf-c-txt-rebeccapurple\:75 { color: hsl(270, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80, html.var.auto .sf-c-txt-rebeccapurple\:80 { color: hsl(270, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:85, html.var.auto .sf-c-txt-rebeccapurple\:85 { color: hsl(270, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90, html.var.auto .sf-c-txt-rebeccapurple\:90 { color: hsl(270, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:95, html.var.auto .sf-c-txt-rebeccapurple\:95 { color: hsl(270, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100, html.var.auto .sf-c-txt-rebeccapurple\:100 { color: hsl(270, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:dark, html.auto .sf-c-txt-rebeccapurple\:dark { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0\:dark, html.auto .sf-c-txt-rebeccapurple\:0\:dark { color: hsl(270, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:5\:dark, html.auto .sf-c-txt-rebeccapurple\:5\:dark { color: hsl(270, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10\:dark, html.auto .sf-c-txt-rebeccapurple\:10\:dark { color: hsl(270, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:15\:dark, html.auto .sf-c-txt-rebeccapurple\:15\:dark { color: hsl(270, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20\:dark, html.auto .sf-c-txt-rebeccapurple\:20\:dark { color: hsl(270, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:25\:dark, html.auto .sf-c-txt-rebeccapurple\:25\:dark { color: hsl(270, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30\:dark, html.auto .sf-c-txt-rebeccapurple\:30\:dark { color: hsl(270, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:35\:dark, html.auto .sf-c-txt-rebeccapurple\:35\:dark { color: hsl(270, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40\:dark, html.auto .sf-c-txt-rebeccapurple\:40\:dark { color: hsl(270, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:45\:dark, html.auto .sf-c-txt-rebeccapurple\:45\:dark { color: hsl(270, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50\:dark, html.auto .sf-c-txt-rebeccapurple\:50\:dark { color: hsl(270, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:55\:dark, html.auto .sf-c-txt-rebeccapurple\:55\:dark { color: hsl(270, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60\:dark, html.auto .sf-c-txt-rebeccapurple\:60\:dark { color: hsl(270, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:65\:dark, html.auto .sf-c-txt-rebeccapurple\:65\:dark { color: hsl(270, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70\:dark, html.auto .sf-c-txt-rebeccapurple\:70\:dark { color: hsl(270, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:75\:dark, html.auto .sf-c-txt-rebeccapurple\:75\:dark { color: hsl(270, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80\:dark, html.auto .sf-c-txt-rebeccapurple\:80\:dark { color: hsl(270, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:85\:dark, html.auto .sf-c-txt-rebeccapurple\:85\:dark { color: hsl(270, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90\:dark, html.auto .sf-c-txt-rebeccapurple\:90\:dark { color: hsl(270, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:95\:dark, html.auto .sf-c-txt-rebeccapurple\:95\:dark { color: hsl(270, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100\:dark, html.auto .sf-c-txt-rebeccapurple\:100\:dark { color: hsl(270, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:dark, html.var.auto .sf-c-txt-rebeccapurple\:dark { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:0\:dark, html.var.auto .sf-c-txt-rebeccapurple\:0\:dark { color: hsl(270, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:5\:dark, html.var.auto .sf-c-txt-rebeccapurple\:5\:dark { color: hsl(270, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:10\:dark, html.var.auto .sf-c-txt-rebeccapurple\:10\:dark { color: hsl(270, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:15\:dark, html.var.auto .sf-c-txt-rebeccapurple\:15\:dark { color: hsl(270, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:20\:dark, html.var.auto .sf-c-txt-rebeccapurple\:20\:dark { color: hsl(270, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:25\:dark, html.var.auto .sf-c-txt-rebeccapurple\:25\:dark { color: hsl(270, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:30\:dark, html.var.auto .sf-c-txt-rebeccapurple\:30\:dark { color: hsl(270, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:35\:dark, html.var.auto .sf-c-txt-rebeccapurple\:35\:dark { color: hsl(270, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:40\:dark, html.var.auto .sf-c-txt-rebeccapurple\:40\:dark { color: hsl(270, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:45\:dark, html.var.auto .sf-c-txt-rebeccapurple\:45\:dark { color: hsl(270, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:50\:dark, html.var.auto .sf-c-txt-rebeccapurple\:50\:dark { color: hsl(270, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:55\:dark, html.var.auto .sf-c-txt-rebeccapurple\:55\:dark { color: hsl(270, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:60\:dark, html.var.auto .sf-c-txt-rebeccapurple\:60\:dark { color: hsl(270, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:65\:dark, html.var.auto .sf-c-txt-rebeccapurple\:65\:dark { color: hsl(270, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:70\:dark, html.var.auto .sf-c-txt-rebeccapurple\:70\:dark { color: hsl(270, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:75\:dark, html.var.auto .sf-c-txt-rebeccapurple\:75\:dark { color: hsl(270, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:80\:dark, html.var.auto .sf-c-txt-rebeccapurple\:80\:dark { color: hsl(270, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:85\:dark, html.var.auto .sf-c-txt-rebeccapurple\:85\:dark { color: hsl(270, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:90\:dark, html.var.auto .sf-c-txt-rebeccapurple\:90\:dark { color: hsl(270, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:95\:dark, html.var.auto .sf-c-txt-rebeccapurple\:95\:dark { color: hsl(270, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-rebeccapurple\:100\:dark, html.var.auto .sf-c-txt-rebeccapurple\:100\:dark { color: hsl(270, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/red.css b/src/colors/20/red.css index 35ad12e..f54cd6f 100644 --- a/src/colors/20/red.css +++ b/src/colors/20/red.css @@ -1,4 +1,4 @@ -:root { +[class*='red'] { --sf-c-red: 0 100% 50%; --sf-c-red-0: 0 100% 0%; --sf-c-red-5: 0 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark, html.dark .sf-c-txt-red\:1 html.var[data-theme='auto'] .sf-c-red\:95\:dark, html.var.auto .sf-c-red\:95\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 5%) } html.var[data-theme='auto'] .sf-c-red\:100\:dark, html.var.auto .sf-c-red\:100\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red, html.auto .sf-c-txt-red { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:0, html.auto .sf-c-txt-red\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red\:5, html.auto .sf-c-txt-red\:5 { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-red\:10, html.auto .sf-c-txt-red\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-red\:15, html.auto .sf-c-txt-red\:15 { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-red\:20, html.auto .sf-c-txt-red\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-red\:25, html.auto .sf-c-txt-red\:25 { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-red\:30, html.auto .sf-c-txt-red\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-red\:35, html.auto .sf-c-txt-red\:35 { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-red\:40, html.auto .sf-c-txt-red\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-red\:45, html.auto .sf-c-txt-red\:45 { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-red\:50, html.auto .sf-c-txt-red\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:55, html.auto .sf-c-txt-red\:55 { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-red\:60, html.auto .sf-c-txt-red\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-red\:65, html.auto .sf-c-txt-red\:65 { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-red\:70, html.auto .sf-c-txt-red\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-red\:75, html.auto .sf-c-txt-red\:75 { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-red\:80, html.auto .sf-c-txt-red\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-red\:85, html.auto .sf-c-txt-red\:85 { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-red\:90, html.auto .sf-c-txt-red\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-red\:95, html.auto .sf-c-txt-red\:95 { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-red\:100, html.auto .sf-c-txt-red\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-red, html.var.auto .sf-c-txt-red { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:0, html.var.auto .sf-c-txt-red\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-red\:5, html.var.auto .sf-c-txt-red\:5 { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-red\:10, html.var.auto .sf-c-txt-red\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-red\:15, html.var.auto .sf-c-txt-red\:15 { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-red\:20, html.var.auto .sf-c-txt-red\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-red\:25, html.var.auto .sf-c-txt-red\:25 { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-red\:30, html.var.auto .sf-c-txt-red\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-red\:35, html.var.auto .sf-c-txt-red\:35 { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-red\:40, html.var.auto .sf-c-txt-red\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-red\:45, html.var.auto .sf-c-txt-red\:45 { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-red\:50, html.var.auto .sf-c-txt-red\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:55, html.var.auto .sf-c-txt-red\:55 { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-red\:60, html.var.auto .sf-c-txt-red\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-red\:65, html.var.auto .sf-c-txt-red\:65 { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-red\:70, html.var.auto .sf-c-txt-red\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-red\:75, html.var.auto .sf-c-txt-red\:75 { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-red\:80, html.var.auto .sf-c-txt-red\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-red\:85, html.var.auto .sf-c-txt-red\:85 { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-red\:90, html.var.auto .sf-c-txt-red\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-red\:95, html.var.auto .sf-c-txt-red\:95 { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-red\:100, html.var.auto .sf-c-txt-red\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-red\:dark, html.auto .sf-c-txt-red\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark, html.auto .sf-c-txt-red\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-red\:5\:dark, html.auto .sf-c-txt-red\:5\:dark { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark, html.auto .sf-c-txt-red\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-red\:15\:dark, html.auto .sf-c-txt-red\:15\:dark { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark, html.auto .sf-c-txt-red\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-red\:25\:dark, html.auto .sf-c-txt-red\:25\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark, html.auto .sf-c-txt-red\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-red\:35\:dark, html.auto .sf-c-txt-red\:35\:dark { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark, html.auto .sf-c-txt-red\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-red\:45\:dark, html.auto .sf-c-txt-red\:45\:dark { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark, html.auto .sf-c-txt-red\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-red\:55\:dark, html.auto .sf-c-txt-red\:55\:dark { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark, html.auto .sf-c-txt-red\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-red\:65\:dark, html.auto .sf-c-txt-red\:65\:dark { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark, html.auto .sf-c-txt-red\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-red\:75\:dark, html.auto .sf-c-txt-red\:75\:dark { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark, html.auto .sf-c-txt-red\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-red\:85\:dark, html.auto .sf-c-txt-red\:85\:dark { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark, html.auto .sf-c-txt-red\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-red\:95\:dark, html.auto .sf-c-txt-red\:95\:dark { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark, html.auto .sf-c-txt-red\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-red\:dark, html.var.auto .sf-c-txt-red\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark, html.var.auto .sf-c-txt-red\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-red\:5\:dark, html.var.auto .sf-c-txt-red\:5\:dark { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark, html.var.auto .sf-c-txt-red\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-red\:15\:dark, html.var.auto .sf-c-txt-red\:15\:dark { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark, html.var.auto .sf-c-txt-red\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-red\:25\:dark, html.var.auto .sf-c-txt-red\:25\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark, html.var.auto .sf-c-txt-red\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-red\:35\:dark, html.var.auto .sf-c-txt-red\:35\:dark { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark, html.var.auto .sf-c-txt-red\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-red\:45\:dark, html.var.auto .sf-c-txt-red\:45\:dark { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark, html.var.auto .sf-c-txt-red\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-red\:55\:dark, html.var.auto .sf-c-txt-red\:55\:dark { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark, html.var.auto .sf-c-txt-red\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-red\:65\:dark, html.var.auto .sf-c-txt-red\:65\:dark { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark, html.var.auto .sf-c-txt-red\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-red\:75\:dark, html.var.auto .sf-c-txt-red\:75\:dark { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark, html.var.auto .sf-c-txt-red\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-red\:85\:dark, html.var.auto .sf-c-txt-red\:85\:dark { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark, html.var.auto .sf-c-txt-red\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-red\:95\:dark, html.var.auto .sf-c-txt-red\:95\:dark { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark, html.var.auto .sf-c-txt-red\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/rosybrown.css b/src/colors/20/rosybrown.css index 5145ced..1f9855f 100644 --- a/src/colors/20/rosybrown.css +++ b/src/colors/20/rosybrown.css @@ -1,4 +1,4 @@ -:root { +[class*='rosybrown'] { --sf-c-rosybrown: 0 25% 65%; --sf-c-rosybrown-0: 0 25% 0%; --sf-c-rosybrown-5: 0 25% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-rosybrown\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-rosybrown\:95\:dark, html.var.auto .sf-c-rosybrown\:95\:dark { color: hsl(0, 25%, 95%); background: hsl(0, 25%, 5%) } html.var[data-theme='auto'] .sf-c-rosybrown\:100\:dark, html.var.auto .sf-c-rosybrown\:100\:dark { color: hsl(0, 25%, 95%); background: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown, html.auto .sf-c-txt-rosybrown { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0, html.auto .sf-c-txt-rosybrown\:0 { color: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:5, html.auto .sf-c-txt-rosybrown\:5 { color: hsl(0, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10, html.auto .sf-c-txt-rosybrown\:10 { color: hsl(0, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:15, html.auto .sf-c-txt-rosybrown\:15 { color: hsl(0, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20, html.auto .sf-c-txt-rosybrown\:20 { color: hsl(0, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:25, html.auto .sf-c-txt-rosybrown\:25 { color: hsl(0, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30, html.auto .sf-c-txt-rosybrown\:30 { color: hsl(0, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:35, html.auto .sf-c-txt-rosybrown\:35 { color: hsl(0, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40, html.auto .sf-c-txt-rosybrown\:40 { color: hsl(0, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:45, html.auto .sf-c-txt-rosybrown\:45 { color: hsl(0, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50, html.auto .sf-c-txt-rosybrown\:50 { color: hsl(0, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:55, html.auto .sf-c-txt-rosybrown\:55 { color: hsl(0, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60, html.auto .sf-c-txt-rosybrown\:60 { color: hsl(0, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:65, html.auto .sf-c-txt-rosybrown\:65 { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70, html.auto .sf-c-txt-rosybrown\:70 { color: hsl(0, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:75, html.auto .sf-c-txt-rosybrown\:75 { color: hsl(0, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80, html.auto .sf-c-txt-rosybrown\:80 { color: hsl(0, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:85, html.auto .sf-c-txt-rosybrown\:85 { color: hsl(0, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90, html.auto .sf-c-txt-rosybrown\:90 { color: hsl(0, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:95, html.auto .sf-c-txt-rosybrown\:95 { color: hsl(0, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100, html.auto .sf-c-txt-rosybrown\:100 { color: hsl(0, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown, html.var.auto .sf-c-txt-rosybrown { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0, html.var.auto .sf-c-txt-rosybrown\:0 { color: hsl(0, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:5, html.var.auto .sf-c-txt-rosybrown\:5 { color: hsl(0, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10, html.var.auto .sf-c-txt-rosybrown\:10 { color: hsl(0, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:15, html.var.auto .sf-c-txt-rosybrown\:15 { color: hsl(0, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20, html.var.auto .sf-c-txt-rosybrown\:20 { color: hsl(0, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:25, html.var.auto .sf-c-txt-rosybrown\:25 { color: hsl(0, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30, html.var.auto .sf-c-txt-rosybrown\:30 { color: hsl(0, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:35, html.var.auto .sf-c-txt-rosybrown\:35 { color: hsl(0, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40, html.var.auto .sf-c-txt-rosybrown\:40 { color: hsl(0, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:45, html.var.auto .sf-c-txt-rosybrown\:45 { color: hsl(0, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50, html.var.auto .sf-c-txt-rosybrown\:50 { color: hsl(0, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:55, html.var.auto .sf-c-txt-rosybrown\:55 { color: hsl(0, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60, html.var.auto .sf-c-txt-rosybrown\:60 { color: hsl(0, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:65, html.var.auto .sf-c-txt-rosybrown\:65 { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70, html.var.auto .sf-c-txt-rosybrown\:70 { color: hsl(0, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:75, html.var.auto .sf-c-txt-rosybrown\:75 { color: hsl(0, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80, html.var.auto .sf-c-txt-rosybrown\:80 { color: hsl(0, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:85, html.var.auto .sf-c-txt-rosybrown\:85 { color: hsl(0, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90, html.var.auto .sf-c-txt-rosybrown\:90 { color: hsl(0, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:95, html.var.auto .sf-c-txt-rosybrown\:95 { color: hsl(0, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100, html.var.auto .sf-c-txt-rosybrown\:100 { color: hsl(0, 25%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:dark, html.auto .sf-c-txt-rosybrown\:dark { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0\:dark, html.auto .sf-c-txt-rosybrown\:0\:dark { color: hsl(0, 25%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:5\:dark, html.auto .sf-c-txt-rosybrown\:5\:dark { color: hsl(0, 25%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10\:dark, html.auto .sf-c-txt-rosybrown\:10\:dark { color: hsl(0, 25%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:15\:dark, html.auto .sf-c-txt-rosybrown\:15\:dark { color: hsl(0, 25%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20\:dark, html.auto .sf-c-txt-rosybrown\:20\:dark { color: hsl(0, 25%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:25\:dark, html.auto .sf-c-txt-rosybrown\:25\:dark { color: hsl(0, 25%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30\:dark, html.auto .sf-c-txt-rosybrown\:30\:dark { color: hsl(0, 25%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:35\:dark, html.auto .sf-c-txt-rosybrown\:35\:dark { color: hsl(0, 25%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40\:dark, html.auto .sf-c-txt-rosybrown\:40\:dark { color: hsl(0, 25%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:45\:dark, html.auto .sf-c-txt-rosybrown\:45\:dark { color: hsl(0, 25%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50\:dark, html.auto .sf-c-txt-rosybrown\:50\:dark { color: hsl(0, 25%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:55\:dark, html.auto .sf-c-txt-rosybrown\:55\:dark { color: hsl(0, 25%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60\:dark, html.auto .sf-c-txt-rosybrown\:60\:dark { color: hsl(0, 25%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:65\:dark, html.auto .sf-c-txt-rosybrown\:65\:dark { color: hsl(0, 25%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70\:dark, html.auto .sf-c-txt-rosybrown\:70\:dark { color: hsl(0, 25%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:75\:dark, html.auto .sf-c-txt-rosybrown\:75\:dark { color: hsl(0, 25%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80\:dark, html.auto .sf-c-txt-rosybrown\:80\:dark { color: hsl(0, 25%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:85\:dark, html.auto .sf-c-txt-rosybrown\:85\:dark { color: hsl(0, 25%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90\:dark, html.auto .sf-c-txt-rosybrown\:90\:dark { color: hsl(0, 25%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:95\:dark, html.auto .sf-c-txt-rosybrown\:95\:dark { color: hsl(0, 25%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100\:dark, html.auto .sf-c-txt-rosybrown\:100\:dark { color: hsl(0, 25%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:dark, html.var.auto .sf-c-txt-rosybrown\:dark { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:0\:dark, html.var.auto .sf-c-txt-rosybrown\:0\:dark { color: hsl(0, 25%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:5\:dark, html.var.auto .sf-c-txt-rosybrown\:5\:dark { color: hsl(0, 25%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:10\:dark, html.var.auto .sf-c-txt-rosybrown\:10\:dark { color: hsl(0, 25%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:15\:dark, html.var.auto .sf-c-txt-rosybrown\:15\:dark { color: hsl(0, 25%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:20\:dark, html.var.auto .sf-c-txt-rosybrown\:20\:dark { color: hsl(0, 25%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:25\:dark, html.var.auto .sf-c-txt-rosybrown\:25\:dark { color: hsl(0, 25%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:30\:dark, html.var.auto .sf-c-txt-rosybrown\:30\:dark { color: hsl(0, 25%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:35\:dark, html.var.auto .sf-c-txt-rosybrown\:35\:dark { color: hsl(0, 25%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:40\:dark, html.var.auto .sf-c-txt-rosybrown\:40\:dark { color: hsl(0, 25%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:45\:dark, html.var.auto .sf-c-txt-rosybrown\:45\:dark { color: hsl(0, 25%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:50\:dark, html.var.auto .sf-c-txt-rosybrown\:50\:dark { color: hsl(0, 25%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:55\:dark, html.var.auto .sf-c-txt-rosybrown\:55\:dark { color: hsl(0, 25%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:60\:dark, html.var.auto .sf-c-txt-rosybrown\:60\:dark { color: hsl(0, 25%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:65\:dark, html.var.auto .sf-c-txt-rosybrown\:65\:dark { color: hsl(0, 25%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:70\:dark, html.var.auto .sf-c-txt-rosybrown\:70\:dark { color: hsl(0, 25%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:75\:dark, html.var.auto .sf-c-txt-rosybrown\:75\:dark { color: hsl(0, 25%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:80\:dark, html.var.auto .sf-c-txt-rosybrown\:80\:dark { color: hsl(0, 25%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:85\:dark, html.var.auto .sf-c-txt-rosybrown\:85\:dark { color: hsl(0, 25%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:90\:dark, html.var.auto .sf-c-txt-rosybrown\:90\:dark { color: hsl(0, 25%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:95\:dark, html.var.auto .sf-c-txt-rosybrown\:95\:dark { color: hsl(0, 25%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-rosybrown\:100\:dark, html.var.auto .sf-c-txt-rosybrown\:100\:dark { color: hsl(0, 25%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/royalblue.css b/src/colors/20/royalblue.css index 41792f5..2930f8a 100644 --- a/src/colors/20/royalblue.css +++ b/src/colors/20/royalblue.css @@ -1,4 +1,4 @@ -:root { +[class*='royalblue'] { --sf-c-royalblue: 225 73% 57%; --sf-c-royalblue-0: 225 73% 0%; --sf-c-royalblue-5: 225 73% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-royalblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-royalblue\:95\:dark, html.var.auto .sf-c-royalblue\:95\:dark { color: hsl(225, 73%, 95%); background: hsl(225, 73%, 5%) } html.var[data-theme='auto'] .sf-c-royalblue\:100\:dark, html.var.auto .sf-c-royalblue\:100\:dark { color: hsl(225, 73%, 95%); background: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue, html.auto .sf-c-txt-royalblue { color: hsl(225, 73%, 57%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:0, html.auto .sf-c-txt-royalblue\:0 { color: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:5, html.auto .sf-c-txt-royalblue\:5 { color: hsl(225, 73%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:10, html.auto .sf-c-txt-royalblue\:10 { color: hsl(225, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:15, html.auto .sf-c-txt-royalblue\:15 { color: hsl(225, 73%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:20, html.auto .sf-c-txt-royalblue\:20 { color: hsl(225, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:25, html.auto .sf-c-txt-royalblue\:25 { color: hsl(225, 73%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:30, html.auto .sf-c-txt-royalblue\:30 { color: hsl(225, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:35, html.auto .sf-c-txt-royalblue\:35 { color: hsl(225, 73%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:40, html.auto .sf-c-txt-royalblue\:40 { color: hsl(225, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:45, html.auto .sf-c-txt-royalblue\:45 { color: hsl(225, 73%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:50, html.auto .sf-c-txt-royalblue\:50 { color: hsl(225, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:55, html.auto .sf-c-txt-royalblue\:55 { color: hsl(225, 73%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:60, html.auto .sf-c-txt-royalblue\:60 { color: hsl(225, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:65, html.auto .sf-c-txt-royalblue\:65 { color: hsl(225, 73%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:70, html.auto .sf-c-txt-royalblue\:70 { color: hsl(225, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:75, html.auto .sf-c-txt-royalblue\:75 { color: hsl(225, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:80, html.auto .sf-c-txt-royalblue\:80 { color: hsl(225, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:85, html.auto .sf-c-txt-royalblue\:85 { color: hsl(225, 73%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:90, html.auto .sf-c-txt-royalblue\:90 { color: hsl(225, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:95, html.auto .sf-c-txt-royalblue\:95 { color: hsl(225, 73%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:100, html.auto .sf-c-txt-royalblue\:100 { color: hsl(225, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue, html.var.auto .sf-c-txt-royalblue { color: hsl(225, 73%, 57%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:0, html.var.auto .sf-c-txt-royalblue\:0 { color: hsl(225, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:5, html.var.auto .sf-c-txt-royalblue\:5 { color: hsl(225, 73%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:10, html.var.auto .sf-c-txt-royalblue\:10 { color: hsl(225, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:15, html.var.auto .sf-c-txt-royalblue\:15 { color: hsl(225, 73%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:20, html.var.auto .sf-c-txt-royalblue\:20 { color: hsl(225, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:25, html.var.auto .sf-c-txt-royalblue\:25 { color: hsl(225, 73%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:30, html.var.auto .sf-c-txt-royalblue\:30 { color: hsl(225, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:35, html.var.auto .sf-c-txt-royalblue\:35 { color: hsl(225, 73%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:40, html.var.auto .sf-c-txt-royalblue\:40 { color: hsl(225, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:45, html.var.auto .sf-c-txt-royalblue\:45 { color: hsl(225, 73%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:50, html.var.auto .sf-c-txt-royalblue\:50 { color: hsl(225, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:55, html.var.auto .sf-c-txt-royalblue\:55 { color: hsl(225, 73%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:60, html.var.auto .sf-c-txt-royalblue\:60 { color: hsl(225, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:65, html.var.auto .sf-c-txt-royalblue\:65 { color: hsl(225, 73%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:70, html.var.auto .sf-c-txt-royalblue\:70 { color: hsl(225, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:75, html.var.auto .sf-c-txt-royalblue\:75 { color: hsl(225, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:80, html.var.auto .sf-c-txt-royalblue\:80 { color: hsl(225, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:85, html.var.auto .sf-c-txt-royalblue\:85 { color: hsl(225, 73%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:90, html.var.auto .sf-c-txt-royalblue\:90 { color: hsl(225, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:95, html.var.auto .sf-c-txt-royalblue\:95 { color: hsl(225, 73%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:100, html.var.auto .sf-c-txt-royalblue\:100 { color: hsl(225, 73%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:dark, html.auto .sf-c-txt-royalblue\:dark { color: hsl(225, 73%, 57%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:0\:dark, html.auto .sf-c-txt-royalblue\:0\:dark { color: hsl(225, 73%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:5\:dark, html.auto .sf-c-txt-royalblue\:5\:dark { color: hsl(225, 73%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:10\:dark, html.auto .sf-c-txt-royalblue\:10\:dark { color: hsl(225, 73%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:15\:dark, html.auto .sf-c-txt-royalblue\:15\:dark { color: hsl(225, 73%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:20\:dark, html.auto .sf-c-txt-royalblue\:20\:dark { color: hsl(225, 73%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:25\:dark, html.auto .sf-c-txt-royalblue\:25\:dark { color: hsl(225, 73%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:30\:dark, html.auto .sf-c-txt-royalblue\:30\:dark { color: hsl(225, 73%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:35\:dark, html.auto .sf-c-txt-royalblue\:35\:dark { color: hsl(225, 73%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:40\:dark, html.auto .sf-c-txt-royalblue\:40\:dark { color: hsl(225, 73%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:45\:dark, html.auto .sf-c-txt-royalblue\:45\:dark { color: hsl(225, 73%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:50\:dark, html.auto .sf-c-txt-royalblue\:50\:dark { color: hsl(225, 73%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:55\:dark, html.auto .sf-c-txt-royalblue\:55\:dark { color: hsl(225, 73%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:60\:dark, html.auto .sf-c-txt-royalblue\:60\:dark { color: hsl(225, 73%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:65\:dark, html.auto .sf-c-txt-royalblue\:65\:dark { color: hsl(225, 73%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:70\:dark, html.auto .sf-c-txt-royalblue\:70\:dark { color: hsl(225, 73%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:75\:dark, html.auto .sf-c-txt-royalblue\:75\:dark { color: hsl(225, 73%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:80\:dark, html.auto .sf-c-txt-royalblue\:80\:dark { color: hsl(225, 73%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:85\:dark, html.auto .sf-c-txt-royalblue\:85\:dark { color: hsl(225, 73%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:90\:dark, html.auto .sf-c-txt-royalblue\:90\:dark { color: hsl(225, 73%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:95\:dark, html.auto .sf-c-txt-royalblue\:95\:dark { color: hsl(225, 73%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-royalblue\:100\:dark, html.auto .sf-c-txt-royalblue\:100\:dark { color: hsl(225, 73%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:dark, html.var.auto .sf-c-txt-royalblue\:dark { color: hsl(225, 73%, 57%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:0\:dark, html.var.auto .sf-c-txt-royalblue\:0\:dark { color: hsl(225, 73%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:5\:dark, html.var.auto .sf-c-txt-royalblue\:5\:dark { color: hsl(225, 73%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:10\:dark, html.var.auto .sf-c-txt-royalblue\:10\:dark { color: hsl(225, 73%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:15\:dark, html.var.auto .sf-c-txt-royalblue\:15\:dark { color: hsl(225, 73%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:20\:dark, html.var.auto .sf-c-txt-royalblue\:20\:dark { color: hsl(225, 73%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:25\:dark, html.var.auto .sf-c-txt-royalblue\:25\:dark { color: hsl(225, 73%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:30\:dark, html.var.auto .sf-c-txt-royalblue\:30\:dark { color: hsl(225, 73%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:35\:dark, html.var.auto .sf-c-txt-royalblue\:35\:dark { color: hsl(225, 73%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:40\:dark, html.var.auto .sf-c-txt-royalblue\:40\:dark { color: hsl(225, 73%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:45\:dark, html.var.auto .sf-c-txt-royalblue\:45\:dark { color: hsl(225, 73%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:50\:dark, html.var.auto .sf-c-txt-royalblue\:50\:dark { color: hsl(225, 73%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:55\:dark, html.var.auto .sf-c-txt-royalblue\:55\:dark { color: hsl(225, 73%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:60\:dark, html.var.auto .sf-c-txt-royalblue\:60\:dark { color: hsl(225, 73%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:65\:dark, html.var.auto .sf-c-txt-royalblue\:65\:dark { color: hsl(225, 73%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:70\:dark, html.var.auto .sf-c-txt-royalblue\:70\:dark { color: hsl(225, 73%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:75\:dark, html.var.auto .sf-c-txt-royalblue\:75\:dark { color: hsl(225, 73%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:80\:dark, html.var.auto .sf-c-txt-royalblue\:80\:dark { color: hsl(225, 73%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:85\:dark, html.var.auto .sf-c-txt-royalblue\:85\:dark { color: hsl(225, 73%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:90\:dark, html.var.auto .sf-c-txt-royalblue\:90\:dark { color: hsl(225, 73%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:95\:dark, html.var.auto .sf-c-txt-royalblue\:95\:dark { color: hsl(225, 73%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-royalblue\:100\:dark, html.var.auto .sf-c-txt-royalblue\:100\:dark { color: hsl(225, 73%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/saddlebrown.css b/src/colors/20/saddlebrown.css index 7f9f518..7af0957 100644 --- a/src/colors/20/saddlebrown.css +++ b/src/colors/20/saddlebrown.css @@ -1,4 +1,4 @@ -:root { +[class*='saddlebrown'] { --sf-c-saddlebrown: 25 76% 31%; --sf-c-saddlebrown-0: 25 76% 0%; --sf-c-saddlebrown-5: 25 76% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-saddlebrown\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-saddlebrown\:95\:dark, html.var.auto .sf-c-saddlebrown\:95\:dark { color: hsl(25, 76%, 95%); background: hsl(25, 76%, 5%) } html.var[data-theme='auto'] .sf-c-saddlebrown\:100\:dark, html.var.auto .sf-c-saddlebrown\:100\:dark { color: hsl(25, 76%, 95%); background: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown, html.auto .sf-c-txt-saddlebrown { color: hsl(25, 76%, 31%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0, html.auto .sf-c-txt-saddlebrown\:0 { color: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:5, html.auto .sf-c-txt-saddlebrown\:5 { color: hsl(25, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10, html.auto .sf-c-txt-saddlebrown\:10 { color: hsl(25, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:15, html.auto .sf-c-txt-saddlebrown\:15 { color: hsl(25, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20, html.auto .sf-c-txt-saddlebrown\:20 { color: hsl(25, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:25, html.auto .sf-c-txt-saddlebrown\:25 { color: hsl(25, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30, html.auto .sf-c-txt-saddlebrown\:30 { color: hsl(25, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:35, html.auto .sf-c-txt-saddlebrown\:35 { color: hsl(25, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40, html.auto .sf-c-txt-saddlebrown\:40 { color: hsl(25, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:45, html.auto .sf-c-txt-saddlebrown\:45 { color: hsl(25, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50, html.auto .sf-c-txt-saddlebrown\:50 { color: hsl(25, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:55, html.auto .sf-c-txt-saddlebrown\:55 { color: hsl(25, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60, html.auto .sf-c-txt-saddlebrown\:60 { color: hsl(25, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:65, html.auto .sf-c-txt-saddlebrown\:65 { color: hsl(25, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70, html.auto .sf-c-txt-saddlebrown\:70 { color: hsl(25, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:75, html.auto .sf-c-txt-saddlebrown\:75 { color: hsl(25, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80, html.auto .sf-c-txt-saddlebrown\:80 { color: hsl(25, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:85, html.auto .sf-c-txt-saddlebrown\:85 { color: hsl(25, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90, html.auto .sf-c-txt-saddlebrown\:90 { color: hsl(25, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:95, html.auto .sf-c-txt-saddlebrown\:95 { color: hsl(25, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100, html.auto .sf-c-txt-saddlebrown\:100 { color: hsl(25, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown, html.var.auto .sf-c-txt-saddlebrown { color: hsl(25, 76%, 31%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0, html.var.auto .sf-c-txt-saddlebrown\:0 { color: hsl(25, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:5, html.var.auto .sf-c-txt-saddlebrown\:5 { color: hsl(25, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10, html.var.auto .sf-c-txt-saddlebrown\:10 { color: hsl(25, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:15, html.var.auto .sf-c-txt-saddlebrown\:15 { color: hsl(25, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20, html.var.auto .sf-c-txt-saddlebrown\:20 { color: hsl(25, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:25, html.var.auto .sf-c-txt-saddlebrown\:25 { color: hsl(25, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30, html.var.auto .sf-c-txt-saddlebrown\:30 { color: hsl(25, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:35, html.var.auto .sf-c-txt-saddlebrown\:35 { color: hsl(25, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40, html.var.auto .sf-c-txt-saddlebrown\:40 { color: hsl(25, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:45, html.var.auto .sf-c-txt-saddlebrown\:45 { color: hsl(25, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50, html.var.auto .sf-c-txt-saddlebrown\:50 { color: hsl(25, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:55, html.var.auto .sf-c-txt-saddlebrown\:55 { color: hsl(25, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60, html.var.auto .sf-c-txt-saddlebrown\:60 { color: hsl(25, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:65, html.var.auto .sf-c-txt-saddlebrown\:65 { color: hsl(25, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70, html.var.auto .sf-c-txt-saddlebrown\:70 { color: hsl(25, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:75, html.var.auto .sf-c-txt-saddlebrown\:75 { color: hsl(25, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80, html.var.auto .sf-c-txt-saddlebrown\:80 { color: hsl(25, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:85, html.var.auto .sf-c-txt-saddlebrown\:85 { color: hsl(25, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90, html.var.auto .sf-c-txt-saddlebrown\:90 { color: hsl(25, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:95, html.var.auto .sf-c-txt-saddlebrown\:95 { color: hsl(25, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100, html.var.auto .sf-c-txt-saddlebrown\:100 { color: hsl(25, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:dark, html.auto .sf-c-txt-saddlebrown\:dark { color: hsl(25, 76%, 31%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0\:dark, html.auto .sf-c-txt-saddlebrown\:0\:dark { color: hsl(25, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:5\:dark, html.auto .sf-c-txt-saddlebrown\:5\:dark { color: hsl(25, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10\:dark, html.auto .sf-c-txt-saddlebrown\:10\:dark { color: hsl(25, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:15\:dark, html.auto .sf-c-txt-saddlebrown\:15\:dark { color: hsl(25, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20\:dark, html.auto .sf-c-txt-saddlebrown\:20\:dark { color: hsl(25, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:25\:dark, html.auto .sf-c-txt-saddlebrown\:25\:dark { color: hsl(25, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30\:dark, html.auto .sf-c-txt-saddlebrown\:30\:dark { color: hsl(25, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:35\:dark, html.auto .sf-c-txt-saddlebrown\:35\:dark { color: hsl(25, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40\:dark, html.auto .sf-c-txt-saddlebrown\:40\:dark { color: hsl(25, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:45\:dark, html.auto .sf-c-txt-saddlebrown\:45\:dark { color: hsl(25, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50\:dark, html.auto .sf-c-txt-saddlebrown\:50\:dark { color: hsl(25, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:55\:dark, html.auto .sf-c-txt-saddlebrown\:55\:dark { color: hsl(25, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60\:dark, html.auto .sf-c-txt-saddlebrown\:60\:dark { color: hsl(25, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:65\:dark, html.auto .sf-c-txt-saddlebrown\:65\:dark { color: hsl(25, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70\:dark, html.auto .sf-c-txt-saddlebrown\:70\:dark { color: hsl(25, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:75\:dark, html.auto .sf-c-txt-saddlebrown\:75\:dark { color: hsl(25, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80\:dark, html.auto .sf-c-txt-saddlebrown\:80\:dark { color: hsl(25, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:85\:dark, html.auto .sf-c-txt-saddlebrown\:85\:dark { color: hsl(25, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90\:dark, html.auto .sf-c-txt-saddlebrown\:90\:dark { color: hsl(25, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:95\:dark, html.auto .sf-c-txt-saddlebrown\:95\:dark { color: hsl(25, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100\:dark, html.auto .sf-c-txt-saddlebrown\:100\:dark { color: hsl(25, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:dark, html.var.auto .sf-c-txt-saddlebrown\:dark { color: hsl(25, 76%, 31%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:0\:dark, html.var.auto .sf-c-txt-saddlebrown\:0\:dark { color: hsl(25, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:5\:dark, html.var.auto .sf-c-txt-saddlebrown\:5\:dark { color: hsl(25, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:10\:dark, html.var.auto .sf-c-txt-saddlebrown\:10\:dark { color: hsl(25, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:15\:dark, html.var.auto .sf-c-txt-saddlebrown\:15\:dark { color: hsl(25, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:20\:dark, html.var.auto .sf-c-txt-saddlebrown\:20\:dark { color: hsl(25, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:25\:dark, html.var.auto .sf-c-txt-saddlebrown\:25\:dark { color: hsl(25, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:30\:dark, html.var.auto .sf-c-txt-saddlebrown\:30\:dark { color: hsl(25, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:35\:dark, html.var.auto .sf-c-txt-saddlebrown\:35\:dark { color: hsl(25, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:40\:dark, html.var.auto .sf-c-txt-saddlebrown\:40\:dark { color: hsl(25, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:45\:dark, html.var.auto .sf-c-txt-saddlebrown\:45\:dark { color: hsl(25, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:50\:dark, html.var.auto .sf-c-txt-saddlebrown\:50\:dark { color: hsl(25, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:55\:dark, html.var.auto .sf-c-txt-saddlebrown\:55\:dark { color: hsl(25, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:60\:dark, html.var.auto .sf-c-txt-saddlebrown\:60\:dark { color: hsl(25, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:65\:dark, html.var.auto .sf-c-txt-saddlebrown\:65\:dark { color: hsl(25, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:70\:dark, html.var.auto .sf-c-txt-saddlebrown\:70\:dark { color: hsl(25, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:75\:dark, html.var.auto .sf-c-txt-saddlebrown\:75\:dark { color: hsl(25, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:80\:dark, html.var.auto .sf-c-txt-saddlebrown\:80\:dark { color: hsl(25, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:85\:dark, html.var.auto .sf-c-txt-saddlebrown\:85\:dark { color: hsl(25, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:90\:dark, html.var.auto .sf-c-txt-saddlebrown\:90\:dark { color: hsl(25, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:95\:dark, html.var.auto .sf-c-txt-saddlebrown\:95\:dark { color: hsl(25, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-saddlebrown\:100\:dark, html.var.auto .sf-c-txt-saddlebrown\:100\:dark { color: hsl(25, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/salmon.css b/src/colors/20/salmon.css index 5d44809..022bee9 100644 --- a/src/colors/20/salmon.css +++ b/src/colors/20/salmon.css @@ -1,4 +1,4 @@ -:root { +[class*='salmon'] { --sf-c-salmon: 6 93% 71%; --sf-c-salmon-0: 6 93% 0%; --sf-c-salmon-5: 6 93% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-salmon\:100\:dark, html.dark .sf-c-txt-sal html.var[data-theme='auto'] .sf-c-salmon\:95\:dark, html.var.auto .sf-c-salmon\:95\:dark { color: hsl(6, 93%, 95%); background: hsl(6, 93%, 5%) } html.var[data-theme='auto'] .sf-c-salmon\:100\:dark, html.var.auto .sf-c-salmon\:100\:dark { color: hsl(6, 93%, 95%); background: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon, html.auto .sf-c-txt-salmon { color: hsl(6, 93%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:0, html.auto .sf-c-txt-salmon\:0 { color: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:5, html.auto .sf-c-txt-salmon\:5 { color: hsl(6, 93%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:10, html.auto .sf-c-txt-salmon\:10 { color: hsl(6, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:15, html.auto .sf-c-txt-salmon\:15 { color: hsl(6, 93%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:20, html.auto .sf-c-txt-salmon\:20 { color: hsl(6, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:25, html.auto .sf-c-txt-salmon\:25 { color: hsl(6, 93%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:30, html.auto .sf-c-txt-salmon\:30 { color: hsl(6, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:35, html.auto .sf-c-txt-salmon\:35 { color: hsl(6, 93%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:40, html.auto .sf-c-txt-salmon\:40 { color: hsl(6, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:45, html.auto .sf-c-txt-salmon\:45 { color: hsl(6, 93%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:50, html.auto .sf-c-txt-salmon\:50 { color: hsl(6, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:55, html.auto .sf-c-txt-salmon\:55 { color: hsl(6, 93%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:60, html.auto .sf-c-txt-salmon\:60 { color: hsl(6, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:65, html.auto .sf-c-txt-salmon\:65 { color: hsl(6, 93%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:70, html.auto .sf-c-txt-salmon\:70 { color: hsl(6, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:75, html.auto .sf-c-txt-salmon\:75 { color: hsl(6, 93%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:80, html.auto .sf-c-txt-salmon\:80 { color: hsl(6, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:85, html.auto .sf-c-txt-salmon\:85 { color: hsl(6, 93%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:90, html.auto .sf-c-txt-salmon\:90 { color: hsl(6, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:95, html.auto .sf-c-txt-salmon\:95 { color: hsl(6, 93%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:100, html.auto .sf-c-txt-salmon\:100 { color: hsl(6, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-salmon, html.var.auto .sf-c-txt-salmon { color: hsl(6, 93%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:0, html.var.auto .sf-c-txt-salmon\:0 { color: hsl(6, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:5, html.var.auto .sf-c-txt-salmon\:5 { color: hsl(6, 93%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:10, html.var.auto .sf-c-txt-salmon\:10 { color: hsl(6, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:15, html.var.auto .sf-c-txt-salmon\:15 { color: hsl(6, 93%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:20, html.var.auto .sf-c-txt-salmon\:20 { color: hsl(6, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:25, html.var.auto .sf-c-txt-salmon\:25 { color: hsl(6, 93%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:30, html.var.auto .sf-c-txt-salmon\:30 { color: hsl(6, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:35, html.var.auto .sf-c-txt-salmon\:35 { color: hsl(6, 93%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:40, html.var.auto .sf-c-txt-salmon\:40 { color: hsl(6, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:45, html.var.auto .sf-c-txt-salmon\:45 { color: hsl(6, 93%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:50, html.var.auto .sf-c-txt-salmon\:50 { color: hsl(6, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:55, html.var.auto .sf-c-txt-salmon\:55 { color: hsl(6, 93%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:60, html.var.auto .sf-c-txt-salmon\:60 { color: hsl(6, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:65, html.var.auto .sf-c-txt-salmon\:65 { color: hsl(6, 93%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:70, html.var.auto .sf-c-txt-salmon\:70 { color: hsl(6, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:75, html.var.auto .sf-c-txt-salmon\:75 { color: hsl(6, 93%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:80, html.var.auto .sf-c-txt-salmon\:80 { color: hsl(6, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:85, html.var.auto .sf-c-txt-salmon\:85 { color: hsl(6, 93%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:90, html.var.auto .sf-c-txt-salmon\:90 { color: hsl(6, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:95, html.var.auto .sf-c-txt-salmon\:95 { color: hsl(6, 93%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:100, html.var.auto .sf-c-txt-salmon\:100 { color: hsl(6, 93%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:dark, html.auto .sf-c-txt-salmon\:dark { color: hsl(6, 93%, 71%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:0\:dark, html.auto .sf-c-txt-salmon\:0\:dark { color: hsl(6, 93%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:5\:dark, html.auto .sf-c-txt-salmon\:5\:dark { color: hsl(6, 93%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:10\:dark, html.auto .sf-c-txt-salmon\:10\:dark { color: hsl(6, 93%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:15\:dark, html.auto .sf-c-txt-salmon\:15\:dark { color: hsl(6, 93%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:20\:dark, html.auto .sf-c-txt-salmon\:20\:dark { color: hsl(6, 93%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:25\:dark, html.auto .sf-c-txt-salmon\:25\:dark { color: hsl(6, 93%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:30\:dark, html.auto .sf-c-txt-salmon\:30\:dark { color: hsl(6, 93%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:35\:dark, html.auto .sf-c-txt-salmon\:35\:dark { color: hsl(6, 93%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:40\:dark, html.auto .sf-c-txt-salmon\:40\:dark { color: hsl(6, 93%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:45\:dark, html.auto .sf-c-txt-salmon\:45\:dark { color: hsl(6, 93%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:50\:dark, html.auto .sf-c-txt-salmon\:50\:dark { color: hsl(6, 93%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:55\:dark, html.auto .sf-c-txt-salmon\:55\:dark { color: hsl(6, 93%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:60\:dark, html.auto .sf-c-txt-salmon\:60\:dark { color: hsl(6, 93%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:65\:dark, html.auto .sf-c-txt-salmon\:65\:dark { color: hsl(6, 93%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:70\:dark, html.auto .sf-c-txt-salmon\:70\:dark { color: hsl(6, 93%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:75\:dark, html.auto .sf-c-txt-salmon\:75\:dark { color: hsl(6, 93%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:80\:dark, html.auto .sf-c-txt-salmon\:80\:dark { color: hsl(6, 93%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:85\:dark, html.auto .sf-c-txt-salmon\:85\:dark { color: hsl(6, 93%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:90\:dark, html.auto .sf-c-txt-salmon\:90\:dark { color: hsl(6, 93%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:95\:dark, html.auto .sf-c-txt-salmon\:95\:dark { color: hsl(6, 93%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-salmon\:100\:dark, html.auto .sf-c-txt-salmon\:100\:dark { color: hsl(6, 93%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:dark, html.var.auto .sf-c-txt-salmon\:dark { color: hsl(6, 93%, 71%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:0\:dark, html.var.auto .sf-c-txt-salmon\:0\:dark { color: hsl(6, 93%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:5\:dark, html.var.auto .sf-c-txt-salmon\:5\:dark { color: hsl(6, 93%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:10\:dark, html.var.auto .sf-c-txt-salmon\:10\:dark { color: hsl(6, 93%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:15\:dark, html.var.auto .sf-c-txt-salmon\:15\:dark { color: hsl(6, 93%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:20\:dark, html.var.auto .sf-c-txt-salmon\:20\:dark { color: hsl(6, 93%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:25\:dark, html.var.auto .sf-c-txt-salmon\:25\:dark { color: hsl(6, 93%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:30\:dark, html.var.auto .sf-c-txt-salmon\:30\:dark { color: hsl(6, 93%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:35\:dark, html.var.auto .sf-c-txt-salmon\:35\:dark { color: hsl(6, 93%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:40\:dark, html.var.auto .sf-c-txt-salmon\:40\:dark { color: hsl(6, 93%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:45\:dark, html.var.auto .sf-c-txt-salmon\:45\:dark { color: hsl(6, 93%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:50\:dark, html.var.auto .sf-c-txt-salmon\:50\:dark { color: hsl(6, 93%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:55\:dark, html.var.auto .sf-c-txt-salmon\:55\:dark { color: hsl(6, 93%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:60\:dark, html.var.auto .sf-c-txt-salmon\:60\:dark { color: hsl(6, 93%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:65\:dark, html.var.auto .sf-c-txt-salmon\:65\:dark { color: hsl(6, 93%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:70\:dark, html.var.auto .sf-c-txt-salmon\:70\:dark { color: hsl(6, 93%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:75\:dark, html.var.auto .sf-c-txt-salmon\:75\:dark { color: hsl(6, 93%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:80\:dark, html.var.auto .sf-c-txt-salmon\:80\:dark { color: hsl(6, 93%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:85\:dark, html.var.auto .sf-c-txt-salmon\:85\:dark { color: hsl(6, 93%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:90\:dark, html.var.auto .sf-c-txt-salmon\:90\:dark { color: hsl(6, 93%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:95\:dark, html.var.auto .sf-c-txt-salmon\:95\:dark { color: hsl(6, 93%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-salmon\:100\:dark, html.var.auto .sf-c-txt-salmon\:100\:dark { color: hsl(6, 93%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/sandybrown.css b/src/colors/20/sandybrown.css index 5cbc3ab..2db19f9 100644 --- a/src/colors/20/sandybrown.css +++ b/src/colors/20/sandybrown.css @@ -1,4 +1,4 @@ -:root { +[class*='sandybrown'] { --sf-c-sandybrown: 28 87% 67%; --sf-c-sandybrown-0: 28 87% 0%; --sf-c-sandybrown-5: 28 87% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-sandybrown\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-sandybrown\:95\:dark, html.var.auto .sf-c-sandybrown\:95\:dark { color: hsl(28, 87%, 95%); background: hsl(28, 87%, 5%) } html.var[data-theme='auto'] .sf-c-sandybrown\:100\:dark, html.var.auto .sf-c-sandybrown\:100\:dark { color: hsl(28, 87%, 95%); background: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown, html.auto .sf-c-txt-sandybrown { color: hsl(28, 87%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0, html.auto .sf-c-txt-sandybrown\:0 { color: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:5, html.auto .sf-c-txt-sandybrown\:5 { color: hsl(28, 87%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10, html.auto .sf-c-txt-sandybrown\:10 { color: hsl(28, 87%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:15, html.auto .sf-c-txt-sandybrown\:15 { color: hsl(28, 87%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20, html.auto .sf-c-txt-sandybrown\:20 { color: hsl(28, 87%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:25, html.auto .sf-c-txt-sandybrown\:25 { color: hsl(28, 87%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30, html.auto .sf-c-txt-sandybrown\:30 { color: hsl(28, 87%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:35, html.auto .sf-c-txt-sandybrown\:35 { color: hsl(28, 87%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40, html.auto .sf-c-txt-sandybrown\:40 { color: hsl(28, 87%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:45, html.auto .sf-c-txt-sandybrown\:45 { color: hsl(28, 87%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50, html.auto .sf-c-txt-sandybrown\:50 { color: hsl(28, 87%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:55, html.auto .sf-c-txt-sandybrown\:55 { color: hsl(28, 87%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60, html.auto .sf-c-txt-sandybrown\:60 { color: hsl(28, 87%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:65, html.auto .sf-c-txt-sandybrown\:65 { color: hsl(28, 87%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70, html.auto .sf-c-txt-sandybrown\:70 { color: hsl(28, 87%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:75, html.auto .sf-c-txt-sandybrown\:75 { color: hsl(28, 87%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80, html.auto .sf-c-txt-sandybrown\:80 { color: hsl(28, 87%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:85, html.auto .sf-c-txt-sandybrown\:85 { color: hsl(28, 87%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90, html.auto .sf-c-txt-sandybrown\:90 { color: hsl(28, 87%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:95, html.auto .sf-c-txt-sandybrown\:95 { color: hsl(28, 87%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100, html.auto .sf-c-txt-sandybrown\:100 { color: hsl(28, 87%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown, html.var.auto .sf-c-txt-sandybrown { color: hsl(28, 87%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0, html.var.auto .sf-c-txt-sandybrown\:0 { color: hsl(28, 87%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:5, html.var.auto .sf-c-txt-sandybrown\:5 { color: hsl(28, 87%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10, html.var.auto .sf-c-txt-sandybrown\:10 { color: hsl(28, 87%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:15, html.var.auto .sf-c-txt-sandybrown\:15 { color: hsl(28, 87%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20, html.var.auto .sf-c-txt-sandybrown\:20 { color: hsl(28, 87%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:25, html.var.auto .sf-c-txt-sandybrown\:25 { color: hsl(28, 87%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30, html.var.auto .sf-c-txt-sandybrown\:30 { color: hsl(28, 87%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:35, html.var.auto .sf-c-txt-sandybrown\:35 { color: hsl(28, 87%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40, html.var.auto .sf-c-txt-sandybrown\:40 { color: hsl(28, 87%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:45, html.var.auto .sf-c-txt-sandybrown\:45 { color: hsl(28, 87%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50, html.var.auto .sf-c-txt-sandybrown\:50 { color: hsl(28, 87%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:55, html.var.auto .sf-c-txt-sandybrown\:55 { color: hsl(28, 87%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60, html.var.auto .sf-c-txt-sandybrown\:60 { color: hsl(28, 87%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:65, html.var.auto .sf-c-txt-sandybrown\:65 { color: hsl(28, 87%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70, html.var.auto .sf-c-txt-sandybrown\:70 { color: hsl(28, 87%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:75, html.var.auto .sf-c-txt-sandybrown\:75 { color: hsl(28, 87%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80, html.var.auto .sf-c-txt-sandybrown\:80 { color: hsl(28, 87%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:85, html.var.auto .sf-c-txt-sandybrown\:85 { color: hsl(28, 87%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90, html.var.auto .sf-c-txt-sandybrown\:90 { color: hsl(28, 87%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:95, html.var.auto .sf-c-txt-sandybrown\:95 { color: hsl(28, 87%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100, html.var.auto .sf-c-txt-sandybrown\:100 { color: hsl(28, 87%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:dark, html.auto .sf-c-txt-sandybrown\:dark { color: hsl(28, 87%, 67%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0\:dark, html.auto .sf-c-txt-sandybrown\:0\:dark { color: hsl(28, 87%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:5\:dark, html.auto .sf-c-txt-sandybrown\:5\:dark { color: hsl(28, 87%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10\:dark, html.auto .sf-c-txt-sandybrown\:10\:dark { color: hsl(28, 87%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:15\:dark, html.auto .sf-c-txt-sandybrown\:15\:dark { color: hsl(28, 87%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20\:dark, html.auto .sf-c-txt-sandybrown\:20\:dark { color: hsl(28, 87%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:25\:dark, html.auto .sf-c-txt-sandybrown\:25\:dark { color: hsl(28, 87%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30\:dark, html.auto .sf-c-txt-sandybrown\:30\:dark { color: hsl(28, 87%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:35\:dark, html.auto .sf-c-txt-sandybrown\:35\:dark { color: hsl(28, 87%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40\:dark, html.auto .sf-c-txt-sandybrown\:40\:dark { color: hsl(28, 87%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:45\:dark, html.auto .sf-c-txt-sandybrown\:45\:dark { color: hsl(28, 87%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50\:dark, html.auto .sf-c-txt-sandybrown\:50\:dark { color: hsl(28, 87%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:55\:dark, html.auto .sf-c-txt-sandybrown\:55\:dark { color: hsl(28, 87%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60\:dark, html.auto .sf-c-txt-sandybrown\:60\:dark { color: hsl(28, 87%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:65\:dark, html.auto .sf-c-txt-sandybrown\:65\:dark { color: hsl(28, 87%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70\:dark, html.auto .sf-c-txt-sandybrown\:70\:dark { color: hsl(28, 87%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:75\:dark, html.auto .sf-c-txt-sandybrown\:75\:dark { color: hsl(28, 87%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80\:dark, html.auto .sf-c-txt-sandybrown\:80\:dark { color: hsl(28, 87%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:85\:dark, html.auto .sf-c-txt-sandybrown\:85\:dark { color: hsl(28, 87%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90\:dark, html.auto .sf-c-txt-sandybrown\:90\:dark { color: hsl(28, 87%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:95\:dark, html.auto .sf-c-txt-sandybrown\:95\:dark { color: hsl(28, 87%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100\:dark, html.auto .sf-c-txt-sandybrown\:100\:dark { color: hsl(28, 87%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:dark, html.var.auto .sf-c-txt-sandybrown\:dark { color: hsl(28, 87%, 67%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:0\:dark, html.var.auto .sf-c-txt-sandybrown\:0\:dark { color: hsl(28, 87%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:5\:dark, html.var.auto .sf-c-txt-sandybrown\:5\:dark { color: hsl(28, 87%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:10\:dark, html.var.auto .sf-c-txt-sandybrown\:10\:dark { color: hsl(28, 87%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:15\:dark, html.var.auto .sf-c-txt-sandybrown\:15\:dark { color: hsl(28, 87%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:20\:dark, html.var.auto .sf-c-txt-sandybrown\:20\:dark { color: hsl(28, 87%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:25\:dark, html.var.auto .sf-c-txt-sandybrown\:25\:dark { color: hsl(28, 87%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:30\:dark, html.var.auto .sf-c-txt-sandybrown\:30\:dark { color: hsl(28, 87%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:35\:dark, html.var.auto .sf-c-txt-sandybrown\:35\:dark { color: hsl(28, 87%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:40\:dark, html.var.auto .sf-c-txt-sandybrown\:40\:dark { color: hsl(28, 87%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:45\:dark, html.var.auto .sf-c-txt-sandybrown\:45\:dark { color: hsl(28, 87%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:50\:dark, html.var.auto .sf-c-txt-sandybrown\:50\:dark { color: hsl(28, 87%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:55\:dark, html.var.auto .sf-c-txt-sandybrown\:55\:dark { color: hsl(28, 87%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:60\:dark, html.var.auto .sf-c-txt-sandybrown\:60\:dark { color: hsl(28, 87%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:65\:dark, html.var.auto .sf-c-txt-sandybrown\:65\:dark { color: hsl(28, 87%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:70\:dark, html.var.auto .sf-c-txt-sandybrown\:70\:dark { color: hsl(28, 87%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:75\:dark, html.var.auto .sf-c-txt-sandybrown\:75\:dark { color: hsl(28, 87%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:80\:dark, html.var.auto .sf-c-txt-sandybrown\:80\:dark { color: hsl(28, 87%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:85\:dark, html.var.auto .sf-c-txt-sandybrown\:85\:dark { color: hsl(28, 87%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:90\:dark, html.var.auto .sf-c-txt-sandybrown\:90\:dark { color: hsl(28, 87%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:95\:dark, html.var.auto .sf-c-txt-sandybrown\:95\:dark { color: hsl(28, 87%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-sandybrown\:100\:dark, html.var.auto .sf-c-txt-sandybrown\:100\:dark { color: hsl(28, 87%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/seagreen.css b/src/colors/20/seagreen.css index 0cd9845..8a711f6 100644 --- a/src/colors/20/seagreen.css +++ b/src/colors/20/seagreen.css @@ -1,4 +1,4 @@ -:root { +[class*='seagreen'] { --sf-c-seagreen: 146 50% 36%; --sf-c-seagreen-0: 146 50% 0%; --sf-c-seagreen-5: 146 50% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-seagreen\:100\:dark, html.dark .sf-c-txt-s html.var[data-theme='auto'] .sf-c-seagreen\:95\:dark, html.var.auto .sf-c-seagreen\:95\:dark { color: hsl(146, 50%, 95%); background: hsl(146, 50%, 5%) } html.var[data-theme='auto'] .sf-c-seagreen\:100\:dark, html.var.auto .sf-c-seagreen\:100\:dark { color: hsl(146, 50%, 95%); background: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen, html.auto .sf-c-txt-seagreen { color: hsl(146, 50%, 36%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:0, html.auto .sf-c-txt-seagreen\:0 { color: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:5, html.auto .sf-c-txt-seagreen\:5 { color: hsl(146, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:10, html.auto .sf-c-txt-seagreen\:10 { color: hsl(146, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:15, html.auto .sf-c-txt-seagreen\:15 { color: hsl(146, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:20, html.auto .sf-c-txt-seagreen\:20 { color: hsl(146, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:25, html.auto .sf-c-txt-seagreen\:25 { color: hsl(146, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:30, html.auto .sf-c-txt-seagreen\:30 { color: hsl(146, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:35, html.auto .sf-c-txt-seagreen\:35 { color: hsl(146, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:40, html.auto .sf-c-txt-seagreen\:40 { color: hsl(146, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:45, html.auto .sf-c-txt-seagreen\:45 { color: hsl(146, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:50, html.auto .sf-c-txt-seagreen\:50 { color: hsl(146, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:55, html.auto .sf-c-txt-seagreen\:55 { color: hsl(146, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:60, html.auto .sf-c-txt-seagreen\:60 { color: hsl(146, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:65, html.auto .sf-c-txt-seagreen\:65 { color: hsl(146, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:70, html.auto .sf-c-txt-seagreen\:70 { color: hsl(146, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:75, html.auto .sf-c-txt-seagreen\:75 { color: hsl(146, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:80, html.auto .sf-c-txt-seagreen\:80 { color: hsl(146, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:85, html.auto .sf-c-txt-seagreen\:85 { color: hsl(146, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:90, html.auto .sf-c-txt-seagreen\:90 { color: hsl(146, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:95, html.auto .sf-c-txt-seagreen\:95 { color: hsl(146, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:100, html.auto .sf-c-txt-seagreen\:100 { color: hsl(146, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen, html.var.auto .sf-c-txt-seagreen { color: hsl(146, 50%, 36%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:0, html.var.auto .sf-c-txt-seagreen\:0 { color: hsl(146, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:5, html.var.auto .sf-c-txt-seagreen\:5 { color: hsl(146, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:10, html.var.auto .sf-c-txt-seagreen\:10 { color: hsl(146, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:15, html.var.auto .sf-c-txt-seagreen\:15 { color: hsl(146, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:20, html.var.auto .sf-c-txt-seagreen\:20 { color: hsl(146, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:25, html.var.auto .sf-c-txt-seagreen\:25 { color: hsl(146, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:30, html.var.auto .sf-c-txt-seagreen\:30 { color: hsl(146, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:35, html.var.auto .sf-c-txt-seagreen\:35 { color: hsl(146, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:40, html.var.auto .sf-c-txt-seagreen\:40 { color: hsl(146, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:45, html.var.auto .sf-c-txt-seagreen\:45 { color: hsl(146, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:50, html.var.auto .sf-c-txt-seagreen\:50 { color: hsl(146, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:55, html.var.auto .sf-c-txt-seagreen\:55 { color: hsl(146, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:60, html.var.auto .sf-c-txt-seagreen\:60 { color: hsl(146, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:65, html.var.auto .sf-c-txt-seagreen\:65 { color: hsl(146, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:70, html.var.auto .sf-c-txt-seagreen\:70 { color: hsl(146, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:75, html.var.auto .sf-c-txt-seagreen\:75 { color: hsl(146, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:80, html.var.auto .sf-c-txt-seagreen\:80 { color: hsl(146, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:85, html.var.auto .sf-c-txt-seagreen\:85 { color: hsl(146, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:90, html.var.auto .sf-c-txt-seagreen\:90 { color: hsl(146, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:95, html.var.auto .sf-c-txt-seagreen\:95 { color: hsl(146, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:100, html.var.auto .sf-c-txt-seagreen\:100 { color: hsl(146, 50%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:dark, html.auto .sf-c-txt-seagreen\:dark { color: hsl(146, 50%, 36%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:0\:dark, html.auto .sf-c-txt-seagreen\:0\:dark { color: hsl(146, 50%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:5\:dark, html.auto .sf-c-txt-seagreen\:5\:dark { color: hsl(146, 50%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:10\:dark, html.auto .sf-c-txt-seagreen\:10\:dark { color: hsl(146, 50%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:15\:dark, html.auto .sf-c-txt-seagreen\:15\:dark { color: hsl(146, 50%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:20\:dark, html.auto .sf-c-txt-seagreen\:20\:dark { color: hsl(146, 50%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:25\:dark, html.auto .sf-c-txt-seagreen\:25\:dark { color: hsl(146, 50%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:30\:dark, html.auto .sf-c-txt-seagreen\:30\:dark { color: hsl(146, 50%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:35\:dark, html.auto .sf-c-txt-seagreen\:35\:dark { color: hsl(146, 50%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:40\:dark, html.auto .sf-c-txt-seagreen\:40\:dark { color: hsl(146, 50%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:45\:dark, html.auto .sf-c-txt-seagreen\:45\:dark { color: hsl(146, 50%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:50\:dark, html.auto .sf-c-txt-seagreen\:50\:dark { color: hsl(146, 50%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:55\:dark, html.auto .sf-c-txt-seagreen\:55\:dark { color: hsl(146, 50%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:60\:dark, html.auto .sf-c-txt-seagreen\:60\:dark { color: hsl(146, 50%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:65\:dark, html.auto .sf-c-txt-seagreen\:65\:dark { color: hsl(146, 50%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:70\:dark, html.auto .sf-c-txt-seagreen\:70\:dark { color: hsl(146, 50%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:75\:dark, html.auto .sf-c-txt-seagreen\:75\:dark { color: hsl(146, 50%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:80\:dark, html.auto .sf-c-txt-seagreen\:80\:dark { color: hsl(146, 50%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:85\:dark, html.auto .sf-c-txt-seagreen\:85\:dark { color: hsl(146, 50%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:90\:dark, html.auto .sf-c-txt-seagreen\:90\:dark { color: hsl(146, 50%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:95\:dark, html.auto .sf-c-txt-seagreen\:95\:dark { color: hsl(146, 50%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-seagreen\:100\:dark, html.auto .sf-c-txt-seagreen\:100\:dark { color: hsl(146, 50%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:dark, html.var.auto .sf-c-txt-seagreen\:dark { color: hsl(146, 50%, 36%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:0\:dark, html.var.auto .sf-c-txt-seagreen\:0\:dark { color: hsl(146, 50%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:5\:dark, html.var.auto .sf-c-txt-seagreen\:5\:dark { color: hsl(146, 50%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:10\:dark, html.var.auto .sf-c-txt-seagreen\:10\:dark { color: hsl(146, 50%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:15\:dark, html.var.auto .sf-c-txt-seagreen\:15\:dark { color: hsl(146, 50%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:20\:dark, html.var.auto .sf-c-txt-seagreen\:20\:dark { color: hsl(146, 50%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:25\:dark, html.var.auto .sf-c-txt-seagreen\:25\:dark { color: hsl(146, 50%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:30\:dark, html.var.auto .sf-c-txt-seagreen\:30\:dark { color: hsl(146, 50%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:35\:dark, html.var.auto .sf-c-txt-seagreen\:35\:dark { color: hsl(146, 50%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:40\:dark, html.var.auto .sf-c-txt-seagreen\:40\:dark { color: hsl(146, 50%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:45\:dark, html.var.auto .sf-c-txt-seagreen\:45\:dark { color: hsl(146, 50%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:50\:dark, html.var.auto .sf-c-txt-seagreen\:50\:dark { color: hsl(146, 50%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:55\:dark, html.var.auto .sf-c-txt-seagreen\:55\:dark { color: hsl(146, 50%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:60\:dark, html.var.auto .sf-c-txt-seagreen\:60\:dark { color: hsl(146, 50%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:65\:dark, html.var.auto .sf-c-txt-seagreen\:65\:dark { color: hsl(146, 50%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:70\:dark, html.var.auto .sf-c-txt-seagreen\:70\:dark { color: hsl(146, 50%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:75\:dark, html.var.auto .sf-c-txt-seagreen\:75\:dark { color: hsl(146, 50%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:80\:dark, html.var.auto .sf-c-txt-seagreen\:80\:dark { color: hsl(146, 50%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:85\:dark, html.var.auto .sf-c-txt-seagreen\:85\:dark { color: hsl(146, 50%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:90\:dark, html.var.auto .sf-c-txt-seagreen\:90\:dark { color: hsl(146, 50%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:95\:dark, html.var.auto .sf-c-txt-seagreen\:95\:dark { color: hsl(146, 50%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-seagreen\:100\:dark, html.var.auto .sf-c-txt-seagreen\:100\:dark { color: hsl(146, 50%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/seashell.css b/src/colors/20/seashell.css index 8400840..4c0c7ad 100644 --- a/src/colors/20/seashell.css +++ b/src/colors/20/seashell.css @@ -1,4 +1,4 @@ -:root { +[class*='seashell'] { --sf-c-seashell: 25 100% 97%; --sf-c-seashell-0: 25 100% 0%; --sf-c-seashell-5: 25 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-seashell\:100\:dark, html.dark .sf-c-txt-s html.var[data-theme='auto'] .sf-c-seashell\:95\:dark, html.var.auto .sf-c-seashell\:95\:dark { color: hsl(25, 100%, 95%); background: hsl(25, 100%, 5%) } html.var[data-theme='auto'] .sf-c-seashell\:100\:dark, html.var.auto .sf-c-seashell\:100\:dark { color: hsl(25, 100%, 95%); background: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell, html.auto .sf-c-txt-seashell { color: hsl(25, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:0, html.auto .sf-c-txt-seashell\:0 { color: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:5, html.auto .sf-c-txt-seashell\:5 { color: hsl(25, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:10, html.auto .sf-c-txt-seashell\:10 { color: hsl(25, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:15, html.auto .sf-c-txt-seashell\:15 { color: hsl(25, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:20, html.auto .sf-c-txt-seashell\:20 { color: hsl(25, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:25, html.auto .sf-c-txt-seashell\:25 { color: hsl(25, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:30, html.auto .sf-c-txt-seashell\:30 { color: hsl(25, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:35, html.auto .sf-c-txt-seashell\:35 { color: hsl(25, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:40, html.auto .sf-c-txt-seashell\:40 { color: hsl(25, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:45, html.auto .sf-c-txt-seashell\:45 { color: hsl(25, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:50, html.auto .sf-c-txt-seashell\:50 { color: hsl(25, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:55, html.auto .sf-c-txt-seashell\:55 { color: hsl(25, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:60, html.auto .sf-c-txt-seashell\:60 { color: hsl(25, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:65, html.auto .sf-c-txt-seashell\:65 { color: hsl(25, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:70, html.auto .sf-c-txt-seashell\:70 { color: hsl(25, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:75, html.auto .sf-c-txt-seashell\:75 { color: hsl(25, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:80, html.auto .sf-c-txt-seashell\:80 { color: hsl(25, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:85, html.auto .sf-c-txt-seashell\:85 { color: hsl(25, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:90, html.auto .sf-c-txt-seashell\:90 { color: hsl(25, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:95, html.auto .sf-c-txt-seashell\:95 { color: hsl(25, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:100, html.auto .sf-c-txt-seashell\:100 { color: hsl(25, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seashell, html.var.auto .sf-c-txt-seashell { color: hsl(25, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:0, html.var.auto .sf-c-txt-seashell\:0 { color: hsl(25, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:5, html.var.auto .sf-c-txt-seashell\:5 { color: hsl(25, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:10, html.var.auto .sf-c-txt-seashell\:10 { color: hsl(25, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:15, html.var.auto .sf-c-txt-seashell\:15 { color: hsl(25, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:20, html.var.auto .sf-c-txt-seashell\:20 { color: hsl(25, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:25, html.var.auto .sf-c-txt-seashell\:25 { color: hsl(25, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:30, html.var.auto .sf-c-txt-seashell\:30 { color: hsl(25, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:35, html.var.auto .sf-c-txt-seashell\:35 { color: hsl(25, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:40, html.var.auto .sf-c-txt-seashell\:40 { color: hsl(25, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:45, html.var.auto .sf-c-txt-seashell\:45 { color: hsl(25, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:50, html.var.auto .sf-c-txt-seashell\:50 { color: hsl(25, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:55, html.var.auto .sf-c-txt-seashell\:55 { color: hsl(25, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:60, html.var.auto .sf-c-txt-seashell\:60 { color: hsl(25, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:65, html.var.auto .sf-c-txt-seashell\:65 { color: hsl(25, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:70, html.var.auto .sf-c-txt-seashell\:70 { color: hsl(25, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:75, html.var.auto .sf-c-txt-seashell\:75 { color: hsl(25, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:80, html.var.auto .sf-c-txt-seashell\:80 { color: hsl(25, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:85, html.var.auto .sf-c-txt-seashell\:85 { color: hsl(25, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:90, html.var.auto .sf-c-txt-seashell\:90 { color: hsl(25, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:95, html.var.auto .sf-c-txt-seashell\:95 { color: hsl(25, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:100, html.var.auto .sf-c-txt-seashell\:100 { color: hsl(25, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:dark, html.auto .sf-c-txt-seashell\:dark { color: hsl(25, 100%, 97%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:0\:dark, html.auto .sf-c-txt-seashell\:0\:dark { color: hsl(25, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:5\:dark, html.auto .sf-c-txt-seashell\:5\:dark { color: hsl(25, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:10\:dark, html.auto .sf-c-txt-seashell\:10\:dark { color: hsl(25, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:15\:dark, html.auto .sf-c-txt-seashell\:15\:dark { color: hsl(25, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:20\:dark, html.auto .sf-c-txt-seashell\:20\:dark { color: hsl(25, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:25\:dark, html.auto .sf-c-txt-seashell\:25\:dark { color: hsl(25, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:30\:dark, html.auto .sf-c-txt-seashell\:30\:dark { color: hsl(25, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:35\:dark, html.auto .sf-c-txt-seashell\:35\:dark { color: hsl(25, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:40\:dark, html.auto .sf-c-txt-seashell\:40\:dark { color: hsl(25, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:45\:dark, html.auto .sf-c-txt-seashell\:45\:dark { color: hsl(25, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:50\:dark, html.auto .sf-c-txt-seashell\:50\:dark { color: hsl(25, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:55\:dark, html.auto .sf-c-txt-seashell\:55\:dark { color: hsl(25, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:60\:dark, html.auto .sf-c-txt-seashell\:60\:dark { color: hsl(25, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:65\:dark, html.auto .sf-c-txt-seashell\:65\:dark { color: hsl(25, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:70\:dark, html.auto .sf-c-txt-seashell\:70\:dark { color: hsl(25, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:75\:dark, html.auto .sf-c-txt-seashell\:75\:dark { color: hsl(25, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:80\:dark, html.auto .sf-c-txt-seashell\:80\:dark { color: hsl(25, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:85\:dark, html.auto .sf-c-txt-seashell\:85\:dark { color: hsl(25, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:90\:dark, html.auto .sf-c-txt-seashell\:90\:dark { color: hsl(25, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:95\:dark, html.auto .sf-c-txt-seashell\:95\:dark { color: hsl(25, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-seashell\:100\:dark, html.auto .sf-c-txt-seashell\:100\:dark { color: hsl(25, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:dark, html.var.auto .sf-c-txt-seashell\:dark { color: hsl(25, 100%, 97%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:0\:dark, html.var.auto .sf-c-txt-seashell\:0\:dark { color: hsl(25, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:5\:dark, html.var.auto .sf-c-txt-seashell\:5\:dark { color: hsl(25, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:10\:dark, html.var.auto .sf-c-txt-seashell\:10\:dark { color: hsl(25, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:15\:dark, html.var.auto .sf-c-txt-seashell\:15\:dark { color: hsl(25, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:20\:dark, html.var.auto .sf-c-txt-seashell\:20\:dark { color: hsl(25, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:25\:dark, html.var.auto .sf-c-txt-seashell\:25\:dark { color: hsl(25, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:30\:dark, html.var.auto .sf-c-txt-seashell\:30\:dark { color: hsl(25, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:35\:dark, html.var.auto .sf-c-txt-seashell\:35\:dark { color: hsl(25, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:40\:dark, html.var.auto .sf-c-txt-seashell\:40\:dark { color: hsl(25, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:45\:dark, html.var.auto .sf-c-txt-seashell\:45\:dark { color: hsl(25, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:50\:dark, html.var.auto .sf-c-txt-seashell\:50\:dark { color: hsl(25, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:55\:dark, html.var.auto .sf-c-txt-seashell\:55\:dark { color: hsl(25, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:60\:dark, html.var.auto .sf-c-txt-seashell\:60\:dark { color: hsl(25, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:65\:dark, html.var.auto .sf-c-txt-seashell\:65\:dark { color: hsl(25, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:70\:dark, html.var.auto .sf-c-txt-seashell\:70\:dark { color: hsl(25, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:75\:dark, html.var.auto .sf-c-txt-seashell\:75\:dark { color: hsl(25, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:80\:dark, html.var.auto .sf-c-txt-seashell\:80\:dark { color: hsl(25, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:85\:dark, html.var.auto .sf-c-txt-seashell\:85\:dark { color: hsl(25, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:90\:dark, html.var.auto .sf-c-txt-seashell\:90\:dark { color: hsl(25, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:95\:dark, html.var.auto .sf-c-txt-seashell\:95\:dark { color: hsl(25, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-seashell\:100\:dark, html.var.auto .sf-c-txt-seashell\:100\:dark { color: hsl(25, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/sienna.css b/src/colors/20/sienna.css index 8ce1d86..ff80ae2 100644 --- a/src/colors/20/sienna.css +++ b/src/colors/20/sienna.css @@ -1,4 +1,4 @@ -:root { +[class*='sienna'] { --sf-c-sienna: 19 56% 40%; --sf-c-sienna-0: 19 56% 0%; --sf-c-sienna-5: 19 56% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-sienna\:100\:dark, html.dark .sf-c-txt-sie html.var[data-theme='auto'] .sf-c-sienna\:95\:dark, html.var.auto .sf-c-sienna\:95\:dark { color: hsl(19, 56%, 95%); background: hsl(19, 56%, 5%) } html.var[data-theme='auto'] .sf-c-sienna\:100\:dark, html.var.auto .sf-c-sienna\:100\:dark { color: hsl(19, 56%, 95%); background: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna, html.auto .sf-c-txt-sienna { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:0, html.auto .sf-c-txt-sienna\:0 { color: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:5, html.auto .sf-c-txt-sienna\:5 { color: hsl(19, 56%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:10, html.auto .sf-c-txt-sienna\:10 { color: hsl(19, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:15, html.auto .sf-c-txt-sienna\:15 { color: hsl(19, 56%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:20, html.auto .sf-c-txt-sienna\:20 { color: hsl(19, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:25, html.auto .sf-c-txt-sienna\:25 { color: hsl(19, 56%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:30, html.auto .sf-c-txt-sienna\:30 { color: hsl(19, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:35, html.auto .sf-c-txt-sienna\:35 { color: hsl(19, 56%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:40, html.auto .sf-c-txt-sienna\:40 { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:45, html.auto .sf-c-txt-sienna\:45 { color: hsl(19, 56%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:50, html.auto .sf-c-txt-sienna\:50 { color: hsl(19, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:55, html.auto .sf-c-txt-sienna\:55 { color: hsl(19, 56%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:60, html.auto .sf-c-txt-sienna\:60 { color: hsl(19, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:65, html.auto .sf-c-txt-sienna\:65 { color: hsl(19, 56%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:70, html.auto .sf-c-txt-sienna\:70 { color: hsl(19, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:75, html.auto .sf-c-txt-sienna\:75 { color: hsl(19, 56%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:80, html.auto .sf-c-txt-sienna\:80 { color: hsl(19, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:85, html.auto .sf-c-txt-sienna\:85 { color: hsl(19, 56%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:90, html.auto .sf-c-txt-sienna\:90 { color: hsl(19, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:95, html.auto .sf-c-txt-sienna\:95 { color: hsl(19, 56%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:100, html.auto .sf-c-txt-sienna\:100 { color: hsl(19, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sienna, html.var.auto .sf-c-txt-sienna { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:0, html.var.auto .sf-c-txt-sienna\:0 { color: hsl(19, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:5, html.var.auto .sf-c-txt-sienna\:5 { color: hsl(19, 56%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:10, html.var.auto .sf-c-txt-sienna\:10 { color: hsl(19, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:15, html.var.auto .sf-c-txt-sienna\:15 { color: hsl(19, 56%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:20, html.var.auto .sf-c-txt-sienna\:20 { color: hsl(19, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:25, html.var.auto .sf-c-txt-sienna\:25 { color: hsl(19, 56%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:30, html.var.auto .sf-c-txt-sienna\:30 { color: hsl(19, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:35, html.var.auto .sf-c-txt-sienna\:35 { color: hsl(19, 56%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:40, html.var.auto .sf-c-txt-sienna\:40 { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:45, html.var.auto .sf-c-txt-sienna\:45 { color: hsl(19, 56%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:50, html.var.auto .sf-c-txt-sienna\:50 { color: hsl(19, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:55, html.var.auto .sf-c-txt-sienna\:55 { color: hsl(19, 56%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:60, html.var.auto .sf-c-txt-sienna\:60 { color: hsl(19, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:65, html.var.auto .sf-c-txt-sienna\:65 { color: hsl(19, 56%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:70, html.var.auto .sf-c-txt-sienna\:70 { color: hsl(19, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:75, html.var.auto .sf-c-txt-sienna\:75 { color: hsl(19, 56%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:80, html.var.auto .sf-c-txt-sienna\:80 { color: hsl(19, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:85, html.var.auto .sf-c-txt-sienna\:85 { color: hsl(19, 56%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:90, html.var.auto .sf-c-txt-sienna\:90 { color: hsl(19, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:95, html.var.auto .sf-c-txt-sienna\:95 { color: hsl(19, 56%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:100, html.var.auto .sf-c-txt-sienna\:100 { color: hsl(19, 56%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:dark, html.auto .sf-c-txt-sienna\:dark { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:0\:dark, html.auto .sf-c-txt-sienna\:0\:dark { color: hsl(19, 56%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:5\:dark, html.auto .sf-c-txt-sienna\:5\:dark { color: hsl(19, 56%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:10\:dark, html.auto .sf-c-txt-sienna\:10\:dark { color: hsl(19, 56%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:15\:dark, html.auto .sf-c-txt-sienna\:15\:dark { color: hsl(19, 56%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:20\:dark, html.auto .sf-c-txt-sienna\:20\:dark { color: hsl(19, 56%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:25\:dark, html.auto .sf-c-txt-sienna\:25\:dark { color: hsl(19, 56%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:30\:dark, html.auto .sf-c-txt-sienna\:30\:dark { color: hsl(19, 56%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:35\:dark, html.auto .sf-c-txt-sienna\:35\:dark { color: hsl(19, 56%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:40\:dark, html.auto .sf-c-txt-sienna\:40\:dark { color: hsl(19, 56%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:45\:dark, html.auto .sf-c-txt-sienna\:45\:dark { color: hsl(19, 56%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:50\:dark, html.auto .sf-c-txt-sienna\:50\:dark { color: hsl(19, 56%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:55\:dark, html.auto .sf-c-txt-sienna\:55\:dark { color: hsl(19, 56%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:60\:dark, html.auto .sf-c-txt-sienna\:60\:dark { color: hsl(19, 56%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:65\:dark, html.auto .sf-c-txt-sienna\:65\:dark { color: hsl(19, 56%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:70\:dark, html.auto .sf-c-txt-sienna\:70\:dark { color: hsl(19, 56%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:75\:dark, html.auto .sf-c-txt-sienna\:75\:dark { color: hsl(19, 56%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:80\:dark, html.auto .sf-c-txt-sienna\:80\:dark { color: hsl(19, 56%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:85\:dark, html.auto .sf-c-txt-sienna\:85\:dark { color: hsl(19, 56%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:90\:dark, html.auto .sf-c-txt-sienna\:90\:dark { color: hsl(19, 56%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:95\:dark, html.auto .sf-c-txt-sienna\:95\:dark { color: hsl(19, 56%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-sienna\:100\:dark, html.auto .sf-c-txt-sienna\:100\:dark { color: hsl(19, 56%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:dark, html.var.auto .sf-c-txt-sienna\:dark { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:0\:dark, html.var.auto .sf-c-txt-sienna\:0\:dark { color: hsl(19, 56%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:5\:dark, html.var.auto .sf-c-txt-sienna\:5\:dark { color: hsl(19, 56%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:10\:dark, html.var.auto .sf-c-txt-sienna\:10\:dark { color: hsl(19, 56%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:15\:dark, html.var.auto .sf-c-txt-sienna\:15\:dark { color: hsl(19, 56%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:20\:dark, html.var.auto .sf-c-txt-sienna\:20\:dark { color: hsl(19, 56%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:25\:dark, html.var.auto .sf-c-txt-sienna\:25\:dark { color: hsl(19, 56%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:30\:dark, html.var.auto .sf-c-txt-sienna\:30\:dark { color: hsl(19, 56%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:35\:dark, html.var.auto .sf-c-txt-sienna\:35\:dark { color: hsl(19, 56%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:40\:dark, html.var.auto .sf-c-txt-sienna\:40\:dark { color: hsl(19, 56%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:45\:dark, html.var.auto .sf-c-txt-sienna\:45\:dark { color: hsl(19, 56%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:50\:dark, html.var.auto .sf-c-txt-sienna\:50\:dark { color: hsl(19, 56%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:55\:dark, html.var.auto .sf-c-txt-sienna\:55\:dark { color: hsl(19, 56%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:60\:dark, html.var.auto .sf-c-txt-sienna\:60\:dark { color: hsl(19, 56%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:65\:dark, html.var.auto .sf-c-txt-sienna\:65\:dark { color: hsl(19, 56%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:70\:dark, html.var.auto .sf-c-txt-sienna\:70\:dark { color: hsl(19, 56%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:75\:dark, html.var.auto .sf-c-txt-sienna\:75\:dark { color: hsl(19, 56%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:80\:dark, html.var.auto .sf-c-txt-sienna\:80\:dark { color: hsl(19, 56%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:85\:dark, html.var.auto .sf-c-txt-sienna\:85\:dark { color: hsl(19, 56%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:90\:dark, html.var.auto .sf-c-txt-sienna\:90\:dark { color: hsl(19, 56%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:95\:dark, html.var.auto .sf-c-txt-sienna\:95\:dark { color: hsl(19, 56%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-sienna\:100\:dark, html.var.auto .sf-c-txt-sienna\:100\:dark { color: hsl(19, 56%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/silver.css b/src/colors/20/silver.css index 16d9cb1..7a6f5de 100644 --- a/src/colors/20/silver.css +++ b/src/colors/20/silver.css @@ -1,4 +1,4 @@ -:root { +[class*='silver'] { --sf-c-silver: 0 0% 75%; --sf-c-silver-0: 0 0% 0%; --sf-c-silver-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-silver\:100\:dark, html.dark .sf-c-txt-sil html.var[data-theme='auto'] .sf-c-silver\:95\:dark, html.var.auto .sf-c-silver\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-silver\:100\:dark, html.var.auto .sf-c-silver\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver, html.auto .sf-c-txt-silver { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:0, html.auto .sf-c-txt-silver\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:5, html.auto .sf-c-txt-silver\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:10, html.auto .sf-c-txt-silver\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:15, html.auto .sf-c-txt-silver\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:20, html.auto .sf-c-txt-silver\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:25, html.auto .sf-c-txt-silver\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:30, html.auto .sf-c-txt-silver\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:35, html.auto .sf-c-txt-silver\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:40, html.auto .sf-c-txt-silver\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:45, html.auto .sf-c-txt-silver\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:50, html.auto .sf-c-txt-silver\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:55, html.auto .sf-c-txt-silver\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:60, html.auto .sf-c-txt-silver\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:65, html.auto .sf-c-txt-silver\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:70, html.auto .sf-c-txt-silver\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:75, html.auto .sf-c-txt-silver\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:80, html.auto .sf-c-txt-silver\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:85, html.auto .sf-c-txt-silver\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:90, html.auto .sf-c-txt-silver\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:95, html.auto .sf-c-txt-silver\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:100, html.auto .sf-c-txt-silver\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-silver, html.var.auto .sf-c-txt-silver { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:0, html.var.auto .sf-c-txt-silver\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:5, html.var.auto .sf-c-txt-silver\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:10, html.var.auto .sf-c-txt-silver\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:15, html.var.auto .sf-c-txt-silver\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:20, html.var.auto .sf-c-txt-silver\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:25, html.var.auto .sf-c-txt-silver\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:30, html.var.auto .sf-c-txt-silver\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:35, html.var.auto .sf-c-txt-silver\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:40, html.var.auto .sf-c-txt-silver\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:45, html.var.auto .sf-c-txt-silver\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:50, html.var.auto .sf-c-txt-silver\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:55, html.var.auto .sf-c-txt-silver\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:60, html.var.auto .sf-c-txt-silver\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:65, html.var.auto .sf-c-txt-silver\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:70, html.var.auto .sf-c-txt-silver\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:75, html.var.auto .sf-c-txt-silver\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:80, html.var.auto .sf-c-txt-silver\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:85, html.var.auto .sf-c-txt-silver\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:90, html.var.auto .sf-c-txt-silver\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:95, html.var.auto .sf-c-txt-silver\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:100, html.var.auto .sf-c-txt-silver\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:dark, html.auto .sf-c-txt-silver\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark, html.auto .sf-c-txt-silver\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:5\:dark, html.auto .sf-c-txt-silver\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark, html.auto .sf-c-txt-silver\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:15\:dark, html.auto .sf-c-txt-silver\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark, html.auto .sf-c-txt-silver\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:25\:dark, html.auto .sf-c-txt-silver\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark, html.auto .sf-c-txt-silver\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:35\:dark, html.auto .sf-c-txt-silver\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark, html.auto .sf-c-txt-silver\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:45\:dark, html.auto .sf-c-txt-silver\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark, html.auto .sf-c-txt-silver\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:55\:dark, html.auto .sf-c-txt-silver\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark, html.auto .sf-c-txt-silver\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:65\:dark, html.auto .sf-c-txt-silver\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark, html.auto .sf-c-txt-silver\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:75\:dark, html.auto .sf-c-txt-silver\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark, html.auto .sf-c-txt-silver\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:85\:dark, html.auto .sf-c-txt-silver\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark, html.auto .sf-c-txt-silver\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:95\:dark, html.auto .sf-c-txt-silver\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark, html.auto .sf-c-txt-silver\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:dark, html.var.auto .sf-c-txt-silver\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark, html.var.auto .sf-c-txt-silver\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:5\:dark, html.var.auto .sf-c-txt-silver\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark, html.var.auto .sf-c-txt-silver\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:15\:dark, html.var.auto .sf-c-txt-silver\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark, html.var.auto .sf-c-txt-silver\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:25\:dark, html.var.auto .sf-c-txt-silver\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark, html.var.auto .sf-c-txt-silver\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:35\:dark, html.var.auto .sf-c-txt-silver\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark, html.var.auto .sf-c-txt-silver\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:45\:dark, html.var.auto .sf-c-txt-silver\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark, html.var.auto .sf-c-txt-silver\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:55\:dark, html.var.auto .sf-c-txt-silver\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark, html.var.auto .sf-c-txt-silver\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:65\:dark, html.var.auto .sf-c-txt-silver\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark, html.var.auto .sf-c-txt-silver\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:75\:dark, html.var.auto .sf-c-txt-silver\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark, html.var.auto .sf-c-txt-silver\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:85\:dark, html.var.auto .sf-c-txt-silver\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark, html.var.auto .sf-c-txt-silver\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:95\:dark, html.var.auto .sf-c-txt-silver\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark, html.var.auto .sf-c-txt-silver\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/skyblue.css b/src/colors/20/skyblue.css index fd102bc..58c9ef8 100644 --- a/src/colors/20/skyblue.css +++ b/src/colors/20/skyblue.css @@ -1,4 +1,4 @@ -:root { +[class*='skyblue'] { --sf-c-skyblue: 197 71% 73%; --sf-c-skyblue-0: 197 71% 0%; --sf-c-skyblue-5: 197 71% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-skyblue\:100\:dark, html.dark .sf-c-txt-sk html.var[data-theme='auto'] .sf-c-skyblue\:95\:dark, html.var.auto .sf-c-skyblue\:95\:dark { color: hsl(197, 71%, 95%); background: hsl(197, 71%, 5%) } html.var[data-theme='auto'] .sf-c-skyblue\:100\:dark, html.var.auto .sf-c-skyblue\:100\:dark { color: hsl(197, 71%, 95%); background: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue, html.auto .sf-c-txt-skyblue { color: hsl(197, 71%, 73%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:0, html.auto .sf-c-txt-skyblue\:0 { color: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:5, html.auto .sf-c-txt-skyblue\:5 { color: hsl(197, 71%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:10, html.auto .sf-c-txt-skyblue\:10 { color: hsl(197, 71%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:15, html.auto .sf-c-txt-skyblue\:15 { color: hsl(197, 71%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:20, html.auto .sf-c-txt-skyblue\:20 { color: hsl(197, 71%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:25, html.auto .sf-c-txt-skyblue\:25 { color: hsl(197, 71%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:30, html.auto .sf-c-txt-skyblue\:30 { color: hsl(197, 71%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:35, html.auto .sf-c-txt-skyblue\:35 { color: hsl(197, 71%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:40, html.auto .sf-c-txt-skyblue\:40 { color: hsl(197, 71%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:45, html.auto .sf-c-txt-skyblue\:45 { color: hsl(197, 71%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:50, html.auto .sf-c-txt-skyblue\:50 { color: hsl(197, 71%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:55, html.auto .sf-c-txt-skyblue\:55 { color: hsl(197, 71%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:60, html.auto .sf-c-txt-skyblue\:60 { color: hsl(197, 71%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:65, html.auto .sf-c-txt-skyblue\:65 { color: hsl(197, 71%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:70, html.auto .sf-c-txt-skyblue\:70 { color: hsl(197, 71%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:75, html.auto .sf-c-txt-skyblue\:75 { color: hsl(197, 71%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:80, html.auto .sf-c-txt-skyblue\:80 { color: hsl(197, 71%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:85, html.auto .sf-c-txt-skyblue\:85 { color: hsl(197, 71%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:90, html.auto .sf-c-txt-skyblue\:90 { color: hsl(197, 71%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:95, html.auto .sf-c-txt-skyblue\:95 { color: hsl(197, 71%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:100, html.auto .sf-c-txt-skyblue\:100 { color: hsl(197, 71%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue, html.var.auto .sf-c-txt-skyblue { color: hsl(197, 71%, 73%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:0, html.var.auto .sf-c-txt-skyblue\:0 { color: hsl(197, 71%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:5, html.var.auto .sf-c-txt-skyblue\:5 { color: hsl(197, 71%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:10, html.var.auto .sf-c-txt-skyblue\:10 { color: hsl(197, 71%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:15, html.var.auto .sf-c-txt-skyblue\:15 { color: hsl(197, 71%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:20, html.var.auto .sf-c-txt-skyblue\:20 { color: hsl(197, 71%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:25, html.var.auto .sf-c-txt-skyblue\:25 { color: hsl(197, 71%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:30, html.var.auto .sf-c-txt-skyblue\:30 { color: hsl(197, 71%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:35, html.var.auto .sf-c-txt-skyblue\:35 { color: hsl(197, 71%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:40, html.var.auto .sf-c-txt-skyblue\:40 { color: hsl(197, 71%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:45, html.var.auto .sf-c-txt-skyblue\:45 { color: hsl(197, 71%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:50, html.var.auto .sf-c-txt-skyblue\:50 { color: hsl(197, 71%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:55, html.var.auto .sf-c-txt-skyblue\:55 { color: hsl(197, 71%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:60, html.var.auto .sf-c-txt-skyblue\:60 { color: hsl(197, 71%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:65, html.var.auto .sf-c-txt-skyblue\:65 { color: hsl(197, 71%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:70, html.var.auto .sf-c-txt-skyblue\:70 { color: hsl(197, 71%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:75, html.var.auto .sf-c-txt-skyblue\:75 { color: hsl(197, 71%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:80, html.var.auto .sf-c-txt-skyblue\:80 { color: hsl(197, 71%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:85, html.var.auto .sf-c-txt-skyblue\:85 { color: hsl(197, 71%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:90, html.var.auto .sf-c-txt-skyblue\:90 { color: hsl(197, 71%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:95, html.var.auto .sf-c-txt-skyblue\:95 { color: hsl(197, 71%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:100, html.var.auto .sf-c-txt-skyblue\:100 { color: hsl(197, 71%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark, html.auto .sf-c-txt-skyblue\:dark { color: hsl(197, 71%, 73%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark, html.auto .sf-c-txt-skyblue\:0\:dark { color: hsl(197, 71%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:5\:dark, html.auto .sf-c-txt-skyblue\:5\:dark { color: hsl(197, 71%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark, html.auto .sf-c-txt-skyblue\:10\:dark { color: hsl(197, 71%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:15\:dark, html.auto .sf-c-txt-skyblue\:15\:dark { color: hsl(197, 71%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark, html.auto .sf-c-txt-skyblue\:20\:dark { color: hsl(197, 71%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:25\:dark, html.auto .sf-c-txt-skyblue\:25\:dark { color: hsl(197, 71%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark, html.auto .sf-c-txt-skyblue\:30\:dark { color: hsl(197, 71%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:35\:dark, html.auto .sf-c-txt-skyblue\:35\:dark { color: hsl(197, 71%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark, html.auto .sf-c-txt-skyblue\:40\:dark { color: hsl(197, 71%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:45\:dark, html.auto .sf-c-txt-skyblue\:45\:dark { color: hsl(197, 71%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark, html.auto .sf-c-txt-skyblue\:50\:dark { color: hsl(197, 71%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:55\:dark, html.auto .sf-c-txt-skyblue\:55\:dark { color: hsl(197, 71%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark, html.auto .sf-c-txt-skyblue\:60\:dark { color: hsl(197, 71%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:65\:dark, html.auto .sf-c-txt-skyblue\:65\:dark { color: hsl(197, 71%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark, html.auto .sf-c-txt-skyblue\:70\:dark { color: hsl(197, 71%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:75\:dark, html.auto .sf-c-txt-skyblue\:75\:dark { color: hsl(197, 71%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark, html.auto .sf-c-txt-skyblue\:80\:dark { color: hsl(197, 71%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:85\:dark, html.auto .sf-c-txt-skyblue\:85\:dark { color: hsl(197, 71%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark, html.auto .sf-c-txt-skyblue\:90\:dark { color: hsl(197, 71%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:95\:dark, html.auto .sf-c-txt-skyblue\:95\:dark { color: hsl(197, 71%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark, html.auto .sf-c-txt-skyblue\:100\:dark { color: hsl(197, 71%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:dark, html.var.auto .sf-c-txt-skyblue\:dark { color: hsl(197, 71%, 73%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:0\:dark, html.var.auto .sf-c-txt-skyblue\:0\:dark { color: hsl(197, 71%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:5\:dark, html.var.auto .sf-c-txt-skyblue\:5\:dark { color: hsl(197, 71%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:10\:dark, html.var.auto .sf-c-txt-skyblue\:10\:dark { color: hsl(197, 71%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:15\:dark, html.var.auto .sf-c-txt-skyblue\:15\:dark { color: hsl(197, 71%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:20\:dark, html.var.auto .sf-c-txt-skyblue\:20\:dark { color: hsl(197, 71%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:25\:dark, html.var.auto .sf-c-txt-skyblue\:25\:dark { color: hsl(197, 71%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:30\:dark, html.var.auto .sf-c-txt-skyblue\:30\:dark { color: hsl(197, 71%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:35\:dark, html.var.auto .sf-c-txt-skyblue\:35\:dark { color: hsl(197, 71%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:40\:dark, html.var.auto .sf-c-txt-skyblue\:40\:dark { color: hsl(197, 71%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:45\:dark, html.var.auto .sf-c-txt-skyblue\:45\:dark { color: hsl(197, 71%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:50\:dark, html.var.auto .sf-c-txt-skyblue\:50\:dark { color: hsl(197, 71%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:55\:dark, html.var.auto .sf-c-txt-skyblue\:55\:dark { color: hsl(197, 71%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:60\:dark, html.var.auto .sf-c-txt-skyblue\:60\:dark { color: hsl(197, 71%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:65\:dark, html.var.auto .sf-c-txt-skyblue\:65\:dark { color: hsl(197, 71%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:70\:dark, html.var.auto .sf-c-txt-skyblue\:70\:dark { color: hsl(197, 71%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:75\:dark, html.var.auto .sf-c-txt-skyblue\:75\:dark { color: hsl(197, 71%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:80\:dark, html.var.auto .sf-c-txt-skyblue\:80\:dark { color: hsl(197, 71%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:85\:dark, html.var.auto .sf-c-txt-skyblue\:85\:dark { color: hsl(197, 71%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:90\:dark, html.var.auto .sf-c-txt-skyblue\:90\:dark { color: hsl(197, 71%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:95\:dark, html.var.auto .sf-c-txt-skyblue\:95\:dark { color: hsl(197, 71%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-skyblue\:100\:dark, html.var.auto .sf-c-txt-skyblue\:100\:dark { color: hsl(197, 71%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/slateblue.css b/src/colors/20/slateblue.css index 723ec2d..79f1383 100644 --- a/src/colors/20/slateblue.css +++ b/src/colors/20/slateblue.css @@ -1,4 +1,4 @@ -:root { +[class*='slateblue'] { --sf-c-slateblue: 248 53% 58%; --sf-c-slateblue-0: 248 53% 0%; --sf-c-slateblue-5: 248 53% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-slateblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slateblue\:95\:dark, html.var.auto .sf-c-slateblue\:95\:dark { color: hsl(248, 53%, 95%); background: hsl(248, 53%, 5%) } html.var[data-theme='auto'] .sf-c-slateblue\:100\:dark, html.var.auto .sf-c-slateblue\:100\:dark { color: hsl(248, 53%, 95%); background: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue, html.auto .sf-c-txt-slateblue { color: hsl(248, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:0, html.auto .sf-c-txt-slateblue\:0 { color: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:5, html.auto .sf-c-txt-slateblue\:5 { color: hsl(248, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:10, html.auto .sf-c-txt-slateblue\:10 { color: hsl(248, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:15, html.auto .sf-c-txt-slateblue\:15 { color: hsl(248, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:20, html.auto .sf-c-txt-slateblue\:20 { color: hsl(248, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:25, html.auto .sf-c-txt-slateblue\:25 { color: hsl(248, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:30, html.auto .sf-c-txt-slateblue\:30 { color: hsl(248, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:35, html.auto .sf-c-txt-slateblue\:35 { color: hsl(248, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:40, html.auto .sf-c-txt-slateblue\:40 { color: hsl(248, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:45, html.auto .sf-c-txt-slateblue\:45 { color: hsl(248, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:50, html.auto .sf-c-txt-slateblue\:50 { color: hsl(248, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:55, html.auto .sf-c-txt-slateblue\:55 { color: hsl(248, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:60, html.auto .sf-c-txt-slateblue\:60 { color: hsl(248, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:65, html.auto .sf-c-txt-slateblue\:65 { color: hsl(248, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:70, html.auto .sf-c-txt-slateblue\:70 { color: hsl(248, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:75, html.auto .sf-c-txt-slateblue\:75 { color: hsl(248, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:80, html.auto .sf-c-txt-slateblue\:80 { color: hsl(248, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:85, html.auto .sf-c-txt-slateblue\:85 { color: hsl(248, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:90, html.auto .sf-c-txt-slateblue\:90 { color: hsl(248, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:95, html.auto .sf-c-txt-slateblue\:95 { color: hsl(248, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:100, html.auto .sf-c-txt-slateblue\:100 { color: hsl(248, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue, html.var.auto .sf-c-txt-slateblue { color: hsl(248, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:0, html.var.auto .sf-c-txt-slateblue\:0 { color: hsl(248, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:5, html.var.auto .sf-c-txt-slateblue\:5 { color: hsl(248, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:10, html.var.auto .sf-c-txt-slateblue\:10 { color: hsl(248, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:15, html.var.auto .sf-c-txt-slateblue\:15 { color: hsl(248, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:20, html.var.auto .sf-c-txt-slateblue\:20 { color: hsl(248, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:25, html.var.auto .sf-c-txt-slateblue\:25 { color: hsl(248, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:30, html.var.auto .sf-c-txt-slateblue\:30 { color: hsl(248, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:35, html.var.auto .sf-c-txt-slateblue\:35 { color: hsl(248, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:40, html.var.auto .sf-c-txt-slateblue\:40 { color: hsl(248, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:45, html.var.auto .sf-c-txt-slateblue\:45 { color: hsl(248, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:50, html.var.auto .sf-c-txt-slateblue\:50 { color: hsl(248, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:55, html.var.auto .sf-c-txt-slateblue\:55 { color: hsl(248, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:60, html.var.auto .sf-c-txt-slateblue\:60 { color: hsl(248, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:65, html.var.auto .sf-c-txt-slateblue\:65 { color: hsl(248, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:70, html.var.auto .sf-c-txt-slateblue\:70 { color: hsl(248, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:75, html.var.auto .sf-c-txt-slateblue\:75 { color: hsl(248, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:80, html.var.auto .sf-c-txt-slateblue\:80 { color: hsl(248, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:85, html.var.auto .sf-c-txt-slateblue\:85 { color: hsl(248, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:90, html.var.auto .sf-c-txt-slateblue\:90 { color: hsl(248, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:95, html.var.auto .sf-c-txt-slateblue\:95 { color: hsl(248, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:100, html.var.auto .sf-c-txt-slateblue\:100 { color: hsl(248, 53%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:dark, html.auto .sf-c-txt-slateblue\:dark { color: hsl(248, 53%, 58%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:0\:dark, html.auto .sf-c-txt-slateblue\:0\:dark { color: hsl(248, 53%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:5\:dark, html.auto .sf-c-txt-slateblue\:5\:dark { color: hsl(248, 53%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:10\:dark, html.auto .sf-c-txt-slateblue\:10\:dark { color: hsl(248, 53%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:15\:dark, html.auto .sf-c-txt-slateblue\:15\:dark { color: hsl(248, 53%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:20\:dark, html.auto .sf-c-txt-slateblue\:20\:dark { color: hsl(248, 53%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:25\:dark, html.auto .sf-c-txt-slateblue\:25\:dark { color: hsl(248, 53%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:30\:dark, html.auto .sf-c-txt-slateblue\:30\:dark { color: hsl(248, 53%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:35\:dark, html.auto .sf-c-txt-slateblue\:35\:dark { color: hsl(248, 53%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:40\:dark, html.auto .sf-c-txt-slateblue\:40\:dark { color: hsl(248, 53%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:45\:dark, html.auto .sf-c-txt-slateblue\:45\:dark { color: hsl(248, 53%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:50\:dark, html.auto .sf-c-txt-slateblue\:50\:dark { color: hsl(248, 53%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:55\:dark, html.auto .sf-c-txt-slateblue\:55\:dark { color: hsl(248, 53%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:60\:dark, html.auto .sf-c-txt-slateblue\:60\:dark { color: hsl(248, 53%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:65\:dark, html.auto .sf-c-txt-slateblue\:65\:dark { color: hsl(248, 53%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:70\:dark, html.auto .sf-c-txt-slateblue\:70\:dark { color: hsl(248, 53%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:75\:dark, html.auto .sf-c-txt-slateblue\:75\:dark { color: hsl(248, 53%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:80\:dark, html.auto .sf-c-txt-slateblue\:80\:dark { color: hsl(248, 53%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:85\:dark, html.auto .sf-c-txt-slateblue\:85\:dark { color: hsl(248, 53%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:90\:dark, html.auto .sf-c-txt-slateblue\:90\:dark { color: hsl(248, 53%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:95\:dark, html.auto .sf-c-txt-slateblue\:95\:dark { color: hsl(248, 53%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slateblue\:100\:dark, html.auto .sf-c-txt-slateblue\:100\:dark { color: hsl(248, 53%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:dark, html.var.auto .sf-c-txt-slateblue\:dark { color: hsl(248, 53%, 58%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:0\:dark, html.var.auto .sf-c-txt-slateblue\:0\:dark { color: hsl(248, 53%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:5\:dark, html.var.auto .sf-c-txt-slateblue\:5\:dark { color: hsl(248, 53%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:10\:dark, html.var.auto .sf-c-txt-slateblue\:10\:dark { color: hsl(248, 53%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:15\:dark, html.var.auto .sf-c-txt-slateblue\:15\:dark { color: hsl(248, 53%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:20\:dark, html.var.auto .sf-c-txt-slateblue\:20\:dark { color: hsl(248, 53%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:25\:dark, html.var.auto .sf-c-txt-slateblue\:25\:dark { color: hsl(248, 53%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:30\:dark, html.var.auto .sf-c-txt-slateblue\:30\:dark { color: hsl(248, 53%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:35\:dark, html.var.auto .sf-c-txt-slateblue\:35\:dark { color: hsl(248, 53%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:40\:dark, html.var.auto .sf-c-txt-slateblue\:40\:dark { color: hsl(248, 53%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:45\:dark, html.var.auto .sf-c-txt-slateblue\:45\:dark { color: hsl(248, 53%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:50\:dark, html.var.auto .sf-c-txt-slateblue\:50\:dark { color: hsl(248, 53%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:55\:dark, html.var.auto .sf-c-txt-slateblue\:55\:dark { color: hsl(248, 53%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:60\:dark, html.var.auto .sf-c-txt-slateblue\:60\:dark { color: hsl(248, 53%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:65\:dark, html.var.auto .sf-c-txt-slateblue\:65\:dark { color: hsl(248, 53%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:70\:dark, html.var.auto .sf-c-txt-slateblue\:70\:dark { color: hsl(248, 53%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:75\:dark, html.var.auto .sf-c-txt-slateblue\:75\:dark { color: hsl(248, 53%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:80\:dark, html.var.auto .sf-c-txt-slateblue\:80\:dark { color: hsl(248, 53%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:85\:dark, html.var.auto .sf-c-txt-slateblue\:85\:dark { color: hsl(248, 53%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:90\:dark, html.var.auto .sf-c-txt-slateblue\:90\:dark { color: hsl(248, 53%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:95\:dark, html.var.auto .sf-c-txt-slateblue\:95\:dark { color: hsl(248, 53%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slateblue\:100\:dark, html.var.auto .sf-c-txt-slateblue\:100\:dark { color: hsl(248, 53%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/slategray.css b/src/colors/20/slategray.css index 0e60a21..dbf3a36 100644 --- a/src/colors/20/slategray.css +++ b/src/colors/20/slategray.css @@ -1,4 +1,4 @@ -:root { +[class*='slategray'] { --sf-c-slategray: 210 13% 50%; --sf-c-slategray-0: 210 13% 0%; --sf-c-slategray-5: 210 13% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-slategray\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slategray\:95\:dark, html.var.auto .sf-c-slategray\:95\:dark { color: hsl(210, 13%, 95%); background: hsl(210, 13%, 5%) } html.var[data-theme='auto'] .sf-c-slategray\:100\:dark, html.var.auto .sf-c-slategray\:100\:dark { color: hsl(210, 13%, 95%); background: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray, html.auto .sf-c-txt-slategray { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:0, html.auto .sf-c-txt-slategray\:0 { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:5, html.auto .sf-c-txt-slategray\:5 { color: hsl(210, 13%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:10, html.auto .sf-c-txt-slategray\:10 { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:15, html.auto .sf-c-txt-slategray\:15 { color: hsl(210, 13%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:20, html.auto .sf-c-txt-slategray\:20 { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:25, html.auto .sf-c-txt-slategray\:25 { color: hsl(210, 13%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:30, html.auto .sf-c-txt-slategray\:30 { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:35, html.auto .sf-c-txt-slategray\:35 { color: hsl(210, 13%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:40, html.auto .sf-c-txt-slategray\:40 { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:45, html.auto .sf-c-txt-slategray\:45 { color: hsl(210, 13%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:50, html.auto .sf-c-txt-slategray\:50 { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:55, html.auto .sf-c-txt-slategray\:55 { color: hsl(210, 13%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:60, html.auto .sf-c-txt-slategray\:60 { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:65, html.auto .sf-c-txt-slategray\:65 { color: hsl(210, 13%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:70, html.auto .sf-c-txt-slategray\:70 { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:75, html.auto .sf-c-txt-slategray\:75 { color: hsl(210, 13%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:80, html.auto .sf-c-txt-slategray\:80 { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:85, html.auto .sf-c-txt-slategray\:85 { color: hsl(210, 13%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:90, html.auto .sf-c-txt-slategray\:90 { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:95, html.auto .sf-c-txt-slategray\:95 { color: hsl(210, 13%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:100, html.auto .sf-c-txt-slategray\:100 { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategray, html.var.auto .sf-c-txt-slategray { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:0, html.var.auto .sf-c-txt-slategray\:0 { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:5, html.var.auto .sf-c-txt-slategray\:5 { color: hsl(210, 13%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:10, html.var.auto .sf-c-txt-slategray\:10 { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:15, html.var.auto .sf-c-txt-slategray\:15 { color: hsl(210, 13%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:20, html.var.auto .sf-c-txt-slategray\:20 { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:25, html.var.auto .sf-c-txt-slategray\:25 { color: hsl(210, 13%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:30, html.var.auto .sf-c-txt-slategray\:30 { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:35, html.var.auto .sf-c-txt-slategray\:35 { color: hsl(210, 13%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:40, html.var.auto .sf-c-txt-slategray\:40 { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:45, html.var.auto .sf-c-txt-slategray\:45 { color: hsl(210, 13%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:50, html.var.auto .sf-c-txt-slategray\:50 { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:55, html.var.auto .sf-c-txt-slategray\:55 { color: hsl(210, 13%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:60, html.var.auto .sf-c-txt-slategray\:60 { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:65, html.var.auto .sf-c-txt-slategray\:65 { color: hsl(210, 13%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:70, html.var.auto .sf-c-txt-slategray\:70 { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:75, html.var.auto .sf-c-txt-slategray\:75 { color: hsl(210, 13%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:80, html.var.auto .sf-c-txt-slategray\:80 { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:85, html.var.auto .sf-c-txt-slategray\:85 { color: hsl(210, 13%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:90, html.var.auto .sf-c-txt-slategray\:90 { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:95, html.var.auto .sf-c-txt-slategray\:95 { color: hsl(210, 13%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:100, html.var.auto .sf-c-txt-slategray\:100 { color: hsl(210, 13%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:dark, html.auto .sf-c-txt-slategray\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:0\:dark, html.auto .sf-c-txt-slategray\:0\:dark { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:5\:dark, html.auto .sf-c-txt-slategray\:5\:dark { color: hsl(210, 13%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:10\:dark, html.auto .sf-c-txt-slategray\:10\:dark { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:15\:dark, html.auto .sf-c-txt-slategray\:15\:dark { color: hsl(210, 13%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:20\:dark, html.auto .sf-c-txt-slategray\:20\:dark { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:25\:dark, html.auto .sf-c-txt-slategray\:25\:dark { color: hsl(210, 13%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:30\:dark, html.auto .sf-c-txt-slategray\:30\:dark { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:35\:dark, html.auto .sf-c-txt-slategray\:35\:dark { color: hsl(210, 13%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:40\:dark, html.auto .sf-c-txt-slategray\:40\:dark { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:45\:dark, html.auto .sf-c-txt-slategray\:45\:dark { color: hsl(210, 13%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:50\:dark, html.auto .sf-c-txt-slategray\:50\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:55\:dark, html.auto .sf-c-txt-slategray\:55\:dark { color: hsl(210, 13%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:60\:dark, html.auto .sf-c-txt-slategray\:60\:dark { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:65\:dark, html.auto .sf-c-txt-slategray\:65\:dark { color: hsl(210, 13%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:70\:dark, html.auto .sf-c-txt-slategray\:70\:dark { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:75\:dark, html.auto .sf-c-txt-slategray\:75\:dark { color: hsl(210, 13%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:80\:dark, html.auto .sf-c-txt-slategray\:80\:dark { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:85\:dark, html.auto .sf-c-txt-slategray\:85\:dark { color: hsl(210, 13%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:90\:dark, html.auto .sf-c-txt-slategray\:90\:dark { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:95\:dark, html.auto .sf-c-txt-slategray\:95\:dark { color: hsl(210, 13%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slategray\:100\:dark, html.auto .sf-c-txt-slategray\:100\:dark { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:dark, html.var.auto .sf-c-txt-slategray\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:0\:dark, html.var.auto .sf-c-txt-slategray\:0\:dark { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:5\:dark, html.var.auto .sf-c-txt-slategray\:5\:dark { color: hsl(210, 13%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:10\:dark, html.var.auto .sf-c-txt-slategray\:10\:dark { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:15\:dark, html.var.auto .sf-c-txt-slategray\:15\:dark { color: hsl(210, 13%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:20\:dark, html.var.auto .sf-c-txt-slategray\:20\:dark { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:25\:dark, html.var.auto .sf-c-txt-slategray\:25\:dark { color: hsl(210, 13%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:30\:dark, html.var.auto .sf-c-txt-slategray\:30\:dark { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:35\:dark, html.var.auto .sf-c-txt-slategray\:35\:dark { color: hsl(210, 13%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:40\:dark, html.var.auto .sf-c-txt-slategray\:40\:dark { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:45\:dark, html.var.auto .sf-c-txt-slategray\:45\:dark { color: hsl(210, 13%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:50\:dark, html.var.auto .sf-c-txt-slategray\:50\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:55\:dark, html.var.auto .sf-c-txt-slategray\:55\:dark { color: hsl(210, 13%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:60\:dark, html.var.auto .sf-c-txt-slategray\:60\:dark { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:65\:dark, html.var.auto .sf-c-txt-slategray\:65\:dark { color: hsl(210, 13%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:70\:dark, html.var.auto .sf-c-txt-slategray\:70\:dark { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:75\:dark, html.var.auto .sf-c-txt-slategray\:75\:dark { color: hsl(210, 13%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:80\:dark, html.var.auto .sf-c-txt-slategray\:80\:dark { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:85\:dark, html.var.auto .sf-c-txt-slategray\:85\:dark { color: hsl(210, 13%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:90\:dark, html.var.auto .sf-c-txt-slategray\:90\:dark { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:95\:dark, html.var.auto .sf-c-txt-slategray\:95\:dark { color: hsl(210, 13%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slategray\:100\:dark, html.var.auto .sf-c-txt-slategray\:100\:dark { color: hsl(210, 13%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/slategrey.css b/src/colors/20/slategrey.css index 949e244..6da3b3e 100644 --- a/src/colors/20/slategrey.css +++ b/src/colors/20/slategrey.css @@ -1,4 +1,4 @@ -:root { +[class*='slategrey'] { --sf-c-slategrey: 210 13% 50%; --sf-c-slategrey-0: 210 13% 0%; --sf-c-slategrey-5: 210 13% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-slategrey\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-slategrey\:95\:dark, html.var.auto .sf-c-slategrey\:95\:dark { color: hsl(210, 13%, 95%); background: hsl(210, 13%, 5%) } html.var[data-theme='auto'] .sf-c-slategrey\:100\:dark, html.var.auto .sf-c-slategrey\:100\:dark { color: hsl(210, 13%, 95%); background: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey, html.auto .sf-c-txt-slategrey { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:0, html.auto .sf-c-txt-slategrey\:0 { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:5, html.auto .sf-c-txt-slategrey\:5 { color: hsl(210, 13%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:10, html.auto .sf-c-txt-slategrey\:10 { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:15, html.auto .sf-c-txt-slategrey\:15 { color: hsl(210, 13%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:20, html.auto .sf-c-txt-slategrey\:20 { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:25, html.auto .sf-c-txt-slategrey\:25 { color: hsl(210, 13%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:30, html.auto .sf-c-txt-slategrey\:30 { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:35, html.auto .sf-c-txt-slategrey\:35 { color: hsl(210, 13%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:40, html.auto .sf-c-txt-slategrey\:40 { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:45, html.auto .sf-c-txt-slategrey\:45 { color: hsl(210, 13%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:50, html.auto .sf-c-txt-slategrey\:50 { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:55, html.auto .sf-c-txt-slategrey\:55 { color: hsl(210, 13%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:60, html.auto .sf-c-txt-slategrey\:60 { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:65, html.auto .sf-c-txt-slategrey\:65 { color: hsl(210, 13%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:70, html.auto .sf-c-txt-slategrey\:70 { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:75, html.auto .sf-c-txt-slategrey\:75 { color: hsl(210, 13%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:80, html.auto .sf-c-txt-slategrey\:80 { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:85, html.auto .sf-c-txt-slategrey\:85 { color: hsl(210, 13%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:90, html.auto .sf-c-txt-slategrey\:90 { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:95, html.auto .sf-c-txt-slategrey\:95 { color: hsl(210, 13%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:100, html.auto .sf-c-txt-slategrey\:100 { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey, html.var.auto .sf-c-txt-slategrey { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:0, html.var.auto .sf-c-txt-slategrey\:0 { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:5, html.var.auto .sf-c-txt-slategrey\:5 { color: hsl(210, 13%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:10, html.var.auto .sf-c-txt-slategrey\:10 { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:15, html.var.auto .sf-c-txt-slategrey\:15 { color: hsl(210, 13%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:20, html.var.auto .sf-c-txt-slategrey\:20 { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:25, html.var.auto .sf-c-txt-slategrey\:25 { color: hsl(210, 13%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:30, html.var.auto .sf-c-txt-slategrey\:30 { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:35, html.var.auto .sf-c-txt-slategrey\:35 { color: hsl(210, 13%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:40, html.var.auto .sf-c-txt-slategrey\:40 { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:45, html.var.auto .sf-c-txt-slategrey\:45 { color: hsl(210, 13%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:50, html.var.auto .sf-c-txt-slategrey\:50 { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:55, html.var.auto .sf-c-txt-slategrey\:55 { color: hsl(210, 13%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:60, html.var.auto .sf-c-txt-slategrey\:60 { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:65, html.var.auto .sf-c-txt-slategrey\:65 { color: hsl(210, 13%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:70, html.var.auto .sf-c-txt-slategrey\:70 { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:75, html.var.auto .sf-c-txt-slategrey\:75 { color: hsl(210, 13%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:80, html.var.auto .sf-c-txt-slategrey\:80 { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:85, html.var.auto .sf-c-txt-slategrey\:85 { color: hsl(210, 13%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:90, html.var.auto .sf-c-txt-slategrey\:90 { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:95, html.var.auto .sf-c-txt-slategrey\:95 { color: hsl(210, 13%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:100, html.var.auto .sf-c-txt-slategrey\:100 { color: hsl(210, 13%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:dark, html.auto .sf-c-txt-slategrey\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:0\:dark, html.auto .sf-c-txt-slategrey\:0\:dark { color: hsl(210, 13%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:5\:dark, html.auto .sf-c-txt-slategrey\:5\:dark { color: hsl(210, 13%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:10\:dark, html.auto .sf-c-txt-slategrey\:10\:dark { color: hsl(210, 13%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:15\:dark, html.auto .sf-c-txt-slategrey\:15\:dark { color: hsl(210, 13%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:20\:dark, html.auto .sf-c-txt-slategrey\:20\:dark { color: hsl(210, 13%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:25\:dark, html.auto .sf-c-txt-slategrey\:25\:dark { color: hsl(210, 13%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:30\:dark, html.auto .sf-c-txt-slategrey\:30\:dark { color: hsl(210, 13%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:35\:dark, html.auto .sf-c-txt-slategrey\:35\:dark { color: hsl(210, 13%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:40\:dark, html.auto .sf-c-txt-slategrey\:40\:dark { color: hsl(210, 13%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:45\:dark, html.auto .sf-c-txt-slategrey\:45\:dark { color: hsl(210, 13%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:50\:dark, html.auto .sf-c-txt-slategrey\:50\:dark { color: hsl(210, 13%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:55\:dark, html.auto .sf-c-txt-slategrey\:55\:dark { color: hsl(210, 13%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:60\:dark, html.auto .sf-c-txt-slategrey\:60\:dark { color: hsl(210, 13%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:65\:dark, html.auto .sf-c-txt-slategrey\:65\:dark { color: hsl(210, 13%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:70\:dark, html.auto .sf-c-txt-slategrey\:70\:dark { color: hsl(210, 13%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:75\:dark, html.auto .sf-c-txt-slategrey\:75\:dark { color: hsl(210, 13%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:80\:dark, html.auto .sf-c-txt-slategrey\:80\:dark { color: hsl(210, 13%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:85\:dark, html.auto .sf-c-txt-slategrey\:85\:dark { color: hsl(210, 13%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:90\:dark, html.auto .sf-c-txt-slategrey\:90\:dark { color: hsl(210, 13%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:95\:dark, html.auto .sf-c-txt-slategrey\:95\:dark { color: hsl(210, 13%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-slategrey\:100\:dark, html.auto .sf-c-txt-slategrey\:100\:dark { color: hsl(210, 13%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:dark, html.var.auto .sf-c-txt-slategrey\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:0\:dark, html.var.auto .sf-c-txt-slategrey\:0\:dark { color: hsl(210, 13%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:5\:dark, html.var.auto .sf-c-txt-slategrey\:5\:dark { color: hsl(210, 13%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:10\:dark, html.var.auto .sf-c-txt-slategrey\:10\:dark { color: hsl(210, 13%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:15\:dark, html.var.auto .sf-c-txt-slategrey\:15\:dark { color: hsl(210, 13%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:20\:dark, html.var.auto .sf-c-txt-slategrey\:20\:dark { color: hsl(210, 13%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:25\:dark, html.var.auto .sf-c-txt-slategrey\:25\:dark { color: hsl(210, 13%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:30\:dark, html.var.auto .sf-c-txt-slategrey\:30\:dark { color: hsl(210, 13%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:35\:dark, html.var.auto .sf-c-txt-slategrey\:35\:dark { color: hsl(210, 13%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:40\:dark, html.var.auto .sf-c-txt-slategrey\:40\:dark { color: hsl(210, 13%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:45\:dark, html.var.auto .sf-c-txt-slategrey\:45\:dark { color: hsl(210, 13%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:50\:dark, html.var.auto .sf-c-txt-slategrey\:50\:dark { color: hsl(210, 13%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:55\:dark, html.var.auto .sf-c-txt-slategrey\:55\:dark { color: hsl(210, 13%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:60\:dark, html.var.auto .sf-c-txt-slategrey\:60\:dark { color: hsl(210, 13%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:65\:dark, html.var.auto .sf-c-txt-slategrey\:65\:dark { color: hsl(210, 13%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:70\:dark, html.var.auto .sf-c-txt-slategrey\:70\:dark { color: hsl(210, 13%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:75\:dark, html.var.auto .sf-c-txt-slategrey\:75\:dark { color: hsl(210, 13%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:80\:dark, html.var.auto .sf-c-txt-slategrey\:80\:dark { color: hsl(210, 13%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:85\:dark, html.var.auto .sf-c-txt-slategrey\:85\:dark { color: hsl(210, 13%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:90\:dark, html.var.auto .sf-c-txt-slategrey\:90\:dark { color: hsl(210, 13%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:95\:dark, html.var.auto .sf-c-txt-slategrey\:95\:dark { color: hsl(210, 13%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-slategrey\:100\:dark, html.var.auto .sf-c-txt-slategrey\:100\:dark { color: hsl(210, 13%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/snow.css b/src/colors/20/snow.css index 975e1b9..182bd5a 100644 --- a/src/colors/20/snow.css +++ b/src/colors/20/snow.css @@ -1,4 +1,4 @@ -:root { +[class*='snow'] { --sf-c-snow: 0 100% 99%; --sf-c-snow-0: 0 100% 0%; --sf-c-snow-5: 0 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-snow\:100\:dark, html.dark .sf-c-txt-snow\ html.var[data-theme='auto'] .sf-c-snow\:95\:dark, html.var.auto .sf-c-snow\:95\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 5%) } html.var[data-theme='auto'] .sf-c-snow\:100\:dark, html.var.auto .sf-c-snow\:100\:dark { color: hsl(0, 100%, 95%); background: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow, html.auto .sf-c-txt-snow { color: hsl(0, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:0, html.auto .sf-c-txt-snow\:0 { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:5, html.auto .sf-c-txt-snow\:5 { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:10, html.auto .sf-c-txt-snow\:10 { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:15, html.auto .sf-c-txt-snow\:15 { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:20, html.auto .sf-c-txt-snow\:20 { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:25, html.auto .sf-c-txt-snow\:25 { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:30, html.auto .sf-c-txt-snow\:30 { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:35, html.auto .sf-c-txt-snow\:35 { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:40, html.auto .sf-c-txt-snow\:40 { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:45, html.auto .sf-c-txt-snow\:45 { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:50, html.auto .sf-c-txt-snow\:50 { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:55, html.auto .sf-c-txt-snow\:55 { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:60, html.auto .sf-c-txt-snow\:60 { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:65, html.auto .sf-c-txt-snow\:65 { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:70, html.auto .sf-c-txt-snow\:70 { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:75, html.auto .sf-c-txt-snow\:75 { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:80, html.auto .sf-c-txt-snow\:80 { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:85, html.auto .sf-c-txt-snow\:85 { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:90, html.auto .sf-c-txt-snow\:90 { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:95, html.auto .sf-c-txt-snow\:95 { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:100, html.auto .sf-c-txt-snow\:100 { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-snow, html.var.auto .sf-c-txt-snow { color: hsl(0, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:0, html.var.auto .sf-c-txt-snow\:0 { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:5, html.var.auto .sf-c-txt-snow\:5 { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:10, html.var.auto .sf-c-txt-snow\:10 { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:15, html.var.auto .sf-c-txt-snow\:15 { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:20, html.var.auto .sf-c-txt-snow\:20 { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:25, html.var.auto .sf-c-txt-snow\:25 { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:30, html.var.auto .sf-c-txt-snow\:30 { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:35, html.var.auto .sf-c-txt-snow\:35 { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:40, html.var.auto .sf-c-txt-snow\:40 { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:45, html.var.auto .sf-c-txt-snow\:45 { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:50, html.var.auto .sf-c-txt-snow\:50 { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:55, html.var.auto .sf-c-txt-snow\:55 { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:60, html.var.auto .sf-c-txt-snow\:60 { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:65, html.var.auto .sf-c-txt-snow\:65 { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:70, html.var.auto .sf-c-txt-snow\:70 { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:75, html.var.auto .sf-c-txt-snow\:75 { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:80, html.var.auto .sf-c-txt-snow\:80 { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:85, html.var.auto .sf-c-txt-snow\:85 { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:90, html.var.auto .sf-c-txt-snow\:90 { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:95, html.var.auto .sf-c-txt-snow\:95 { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:100, html.var.auto .sf-c-txt-snow\:100 { color: hsl(0, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:dark, html.auto .sf-c-txt-snow\:dark { color: hsl(0, 100%, 99%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:0\:dark, html.auto .sf-c-txt-snow\:0\:dark { color: hsl(0, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:5\:dark, html.auto .sf-c-txt-snow\:5\:dark { color: hsl(0, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:10\:dark, html.auto .sf-c-txt-snow\:10\:dark { color: hsl(0, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:15\:dark, html.auto .sf-c-txt-snow\:15\:dark { color: hsl(0, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:20\:dark, html.auto .sf-c-txt-snow\:20\:dark { color: hsl(0, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:25\:dark, html.auto .sf-c-txt-snow\:25\:dark { color: hsl(0, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:30\:dark, html.auto .sf-c-txt-snow\:30\:dark { color: hsl(0, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:35\:dark, html.auto .sf-c-txt-snow\:35\:dark { color: hsl(0, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:40\:dark, html.auto .sf-c-txt-snow\:40\:dark { color: hsl(0, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:45\:dark, html.auto .sf-c-txt-snow\:45\:dark { color: hsl(0, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:50\:dark, html.auto .sf-c-txt-snow\:50\:dark { color: hsl(0, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:55\:dark, html.auto .sf-c-txt-snow\:55\:dark { color: hsl(0, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:60\:dark, html.auto .sf-c-txt-snow\:60\:dark { color: hsl(0, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:65\:dark, html.auto .sf-c-txt-snow\:65\:dark { color: hsl(0, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:70\:dark, html.auto .sf-c-txt-snow\:70\:dark { color: hsl(0, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:75\:dark, html.auto .sf-c-txt-snow\:75\:dark { color: hsl(0, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:80\:dark, html.auto .sf-c-txt-snow\:80\:dark { color: hsl(0, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:85\:dark, html.auto .sf-c-txt-snow\:85\:dark { color: hsl(0, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:90\:dark, html.auto .sf-c-txt-snow\:90\:dark { color: hsl(0, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:95\:dark, html.auto .sf-c-txt-snow\:95\:dark { color: hsl(0, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-snow\:100\:dark, html.auto .sf-c-txt-snow\:100\:dark { color: hsl(0, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:dark, html.var.auto .sf-c-txt-snow\:dark { color: hsl(0, 100%, 99%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:0\:dark, html.var.auto .sf-c-txt-snow\:0\:dark { color: hsl(0, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:5\:dark, html.var.auto .sf-c-txt-snow\:5\:dark { color: hsl(0, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:10\:dark, html.var.auto .sf-c-txt-snow\:10\:dark { color: hsl(0, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:15\:dark, html.var.auto .sf-c-txt-snow\:15\:dark { color: hsl(0, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:20\:dark, html.var.auto .sf-c-txt-snow\:20\:dark { color: hsl(0, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:25\:dark, html.var.auto .sf-c-txt-snow\:25\:dark { color: hsl(0, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:30\:dark, html.var.auto .sf-c-txt-snow\:30\:dark { color: hsl(0, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:35\:dark, html.var.auto .sf-c-txt-snow\:35\:dark { color: hsl(0, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:40\:dark, html.var.auto .sf-c-txt-snow\:40\:dark { color: hsl(0, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:45\:dark, html.var.auto .sf-c-txt-snow\:45\:dark { color: hsl(0, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:50\:dark, html.var.auto .sf-c-txt-snow\:50\:dark { color: hsl(0, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:55\:dark, html.var.auto .sf-c-txt-snow\:55\:dark { color: hsl(0, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:60\:dark, html.var.auto .sf-c-txt-snow\:60\:dark { color: hsl(0, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:65\:dark, html.var.auto .sf-c-txt-snow\:65\:dark { color: hsl(0, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:70\:dark, html.var.auto .sf-c-txt-snow\:70\:dark { color: hsl(0, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:75\:dark, html.var.auto .sf-c-txt-snow\:75\:dark { color: hsl(0, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:80\:dark, html.var.auto .sf-c-txt-snow\:80\:dark { color: hsl(0, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:85\:dark, html.var.auto .sf-c-txt-snow\:85\:dark { color: hsl(0, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:90\:dark, html.var.auto .sf-c-txt-snow\:90\:dark { color: hsl(0, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:95\:dark, html.var.auto .sf-c-txt-snow\:95\:dark { color: hsl(0, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-snow\:100\:dark, html.var.auto .sf-c-txt-snow\:100\:dark { color: hsl(0, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/springgreen.css b/src/colors/20/springgreen.css index 7b28df5..cfc0532 100644 --- a/src/colors/20/springgreen.css +++ b/src/colors/20/springgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='springgreen'] { --sf-c-springgreen: 150 100% 50%; --sf-c-springgreen-0: 150 100% 0%; --sf-c-springgreen-5: 150 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-springgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-springgreen\:95\:dark, html.var.auto .sf-c-springgreen\:95\:dark { color: hsl(150, 100%, 95%); background: hsl(150, 100%, 5%) } html.var[data-theme='auto'] .sf-c-springgreen\:100\:dark, html.var.auto .sf-c-springgreen\:100\:dark { color: hsl(150, 100%, 95%); background: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen, html.auto .sf-c-txt-springgreen { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:0, html.auto .sf-c-txt-springgreen\:0 { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:5, html.auto .sf-c-txt-springgreen\:5 { color: hsl(150, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:10, html.auto .sf-c-txt-springgreen\:10 { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:15, html.auto .sf-c-txt-springgreen\:15 { color: hsl(150, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:20, html.auto .sf-c-txt-springgreen\:20 { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:25, html.auto .sf-c-txt-springgreen\:25 { color: hsl(150, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:30, html.auto .sf-c-txt-springgreen\:30 { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:35, html.auto .sf-c-txt-springgreen\:35 { color: hsl(150, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:40, html.auto .sf-c-txt-springgreen\:40 { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:45, html.auto .sf-c-txt-springgreen\:45 { color: hsl(150, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:50, html.auto .sf-c-txt-springgreen\:50 { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:55, html.auto .sf-c-txt-springgreen\:55 { color: hsl(150, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:60, html.auto .sf-c-txt-springgreen\:60 { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:65, html.auto .sf-c-txt-springgreen\:65 { color: hsl(150, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:70, html.auto .sf-c-txt-springgreen\:70 { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:75, html.auto .sf-c-txt-springgreen\:75 { color: hsl(150, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:80, html.auto .sf-c-txt-springgreen\:80 { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:85, html.auto .sf-c-txt-springgreen\:85 { color: hsl(150, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:90, html.auto .sf-c-txt-springgreen\:90 { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:95, html.auto .sf-c-txt-springgreen\:95 { color: hsl(150, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:100, html.auto .sf-c-txt-springgreen\:100 { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen, html.var.auto .sf-c-txt-springgreen { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:0, html.var.auto .sf-c-txt-springgreen\:0 { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:5, html.var.auto .sf-c-txt-springgreen\:5 { color: hsl(150, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:10, html.var.auto .sf-c-txt-springgreen\:10 { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:15, html.var.auto .sf-c-txt-springgreen\:15 { color: hsl(150, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:20, html.var.auto .sf-c-txt-springgreen\:20 { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:25, html.var.auto .sf-c-txt-springgreen\:25 { color: hsl(150, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:30, html.var.auto .sf-c-txt-springgreen\:30 { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:35, html.var.auto .sf-c-txt-springgreen\:35 { color: hsl(150, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:40, html.var.auto .sf-c-txt-springgreen\:40 { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:45, html.var.auto .sf-c-txt-springgreen\:45 { color: hsl(150, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:50, html.var.auto .sf-c-txt-springgreen\:50 { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:55, html.var.auto .sf-c-txt-springgreen\:55 { color: hsl(150, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:60, html.var.auto .sf-c-txt-springgreen\:60 { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:65, html.var.auto .sf-c-txt-springgreen\:65 { color: hsl(150, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:70, html.var.auto .sf-c-txt-springgreen\:70 { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:75, html.var.auto .sf-c-txt-springgreen\:75 { color: hsl(150, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:80, html.var.auto .sf-c-txt-springgreen\:80 { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:85, html.var.auto .sf-c-txt-springgreen\:85 { color: hsl(150, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:90, html.var.auto .sf-c-txt-springgreen\:90 { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:95, html.var.auto .sf-c-txt-springgreen\:95 { color: hsl(150, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:100, html.var.auto .sf-c-txt-springgreen\:100 { color: hsl(150, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:dark, html.auto .sf-c-txt-springgreen\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:0\:dark, html.auto .sf-c-txt-springgreen\:0\:dark { color: hsl(150, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:5\:dark, html.auto .sf-c-txt-springgreen\:5\:dark { color: hsl(150, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:10\:dark, html.auto .sf-c-txt-springgreen\:10\:dark { color: hsl(150, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:15\:dark, html.auto .sf-c-txt-springgreen\:15\:dark { color: hsl(150, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:20\:dark, html.auto .sf-c-txt-springgreen\:20\:dark { color: hsl(150, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:25\:dark, html.auto .sf-c-txt-springgreen\:25\:dark { color: hsl(150, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:30\:dark, html.auto .sf-c-txt-springgreen\:30\:dark { color: hsl(150, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:35\:dark, html.auto .sf-c-txt-springgreen\:35\:dark { color: hsl(150, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:40\:dark, html.auto .sf-c-txt-springgreen\:40\:dark { color: hsl(150, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:45\:dark, html.auto .sf-c-txt-springgreen\:45\:dark { color: hsl(150, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:50\:dark, html.auto .sf-c-txt-springgreen\:50\:dark { color: hsl(150, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:55\:dark, html.auto .sf-c-txt-springgreen\:55\:dark { color: hsl(150, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:60\:dark, html.auto .sf-c-txt-springgreen\:60\:dark { color: hsl(150, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:65\:dark, html.auto .sf-c-txt-springgreen\:65\:dark { color: hsl(150, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:70\:dark, html.auto .sf-c-txt-springgreen\:70\:dark { color: hsl(150, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:75\:dark, html.auto .sf-c-txt-springgreen\:75\:dark { color: hsl(150, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:80\:dark, html.auto .sf-c-txt-springgreen\:80\:dark { color: hsl(150, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:85\:dark, html.auto .sf-c-txt-springgreen\:85\:dark { color: hsl(150, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:90\:dark, html.auto .sf-c-txt-springgreen\:90\:dark { color: hsl(150, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:95\:dark, html.auto .sf-c-txt-springgreen\:95\:dark { color: hsl(150, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-springgreen\:100\:dark, html.auto .sf-c-txt-springgreen\:100\:dark { color: hsl(150, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:dark, html.var.auto .sf-c-txt-springgreen\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:0\:dark, html.var.auto .sf-c-txt-springgreen\:0\:dark { color: hsl(150, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:5\:dark, html.var.auto .sf-c-txt-springgreen\:5\:dark { color: hsl(150, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:10\:dark, html.var.auto .sf-c-txt-springgreen\:10\:dark { color: hsl(150, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:15\:dark, html.var.auto .sf-c-txt-springgreen\:15\:dark { color: hsl(150, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:20\:dark, html.var.auto .sf-c-txt-springgreen\:20\:dark { color: hsl(150, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:25\:dark, html.var.auto .sf-c-txt-springgreen\:25\:dark { color: hsl(150, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:30\:dark, html.var.auto .sf-c-txt-springgreen\:30\:dark { color: hsl(150, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:35\:dark, html.var.auto .sf-c-txt-springgreen\:35\:dark { color: hsl(150, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:40\:dark, html.var.auto .sf-c-txt-springgreen\:40\:dark { color: hsl(150, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:45\:dark, html.var.auto .sf-c-txt-springgreen\:45\:dark { color: hsl(150, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:50\:dark, html.var.auto .sf-c-txt-springgreen\:50\:dark { color: hsl(150, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:55\:dark, html.var.auto .sf-c-txt-springgreen\:55\:dark { color: hsl(150, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:60\:dark, html.var.auto .sf-c-txt-springgreen\:60\:dark { color: hsl(150, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:65\:dark, html.var.auto .sf-c-txt-springgreen\:65\:dark { color: hsl(150, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:70\:dark, html.var.auto .sf-c-txt-springgreen\:70\:dark { color: hsl(150, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:75\:dark, html.var.auto .sf-c-txt-springgreen\:75\:dark { color: hsl(150, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:80\:dark, html.var.auto .sf-c-txt-springgreen\:80\:dark { color: hsl(150, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:85\:dark, html.var.auto .sf-c-txt-springgreen\:85\:dark { color: hsl(150, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:90\:dark, html.var.auto .sf-c-txt-springgreen\:90\:dark { color: hsl(150, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:95\:dark, html.var.auto .sf-c-txt-springgreen\:95\:dark { color: hsl(150, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-springgreen\:100\:dark, html.var.auto .sf-c-txt-springgreen\:100\:dark { color: hsl(150, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/steelblue.css b/src/colors/20/steelblue.css index e840f11..c0cb871 100644 --- a/src/colors/20/steelblue.css +++ b/src/colors/20/steelblue.css @@ -1,4 +1,4 @@ -:root { +[class*='steelblue'] { --sf-c-steelblue: 207 44% 49%; --sf-c-steelblue-0: 207 44% 0%; --sf-c-steelblue-5: 207 44% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-steelblue\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-steelblue\:95\:dark, html.var.auto .sf-c-steelblue\:95\:dark { color: hsl(207, 44%, 95%); background: hsl(207, 44%, 5%) } html.var[data-theme='auto'] .sf-c-steelblue\:100\:dark, html.var.auto .sf-c-steelblue\:100\:dark { color: hsl(207, 44%, 95%); background: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue, html.auto .sf-c-txt-steelblue { color: hsl(207, 44%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:0, html.auto .sf-c-txt-steelblue\:0 { color: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:5, html.auto .sf-c-txt-steelblue\:5 { color: hsl(207, 44%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:10, html.auto .sf-c-txt-steelblue\:10 { color: hsl(207, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:15, html.auto .sf-c-txt-steelblue\:15 { color: hsl(207, 44%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:20, html.auto .sf-c-txt-steelblue\:20 { color: hsl(207, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:25, html.auto .sf-c-txt-steelblue\:25 { color: hsl(207, 44%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:30, html.auto .sf-c-txt-steelblue\:30 { color: hsl(207, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:35, html.auto .sf-c-txt-steelblue\:35 { color: hsl(207, 44%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:40, html.auto .sf-c-txt-steelblue\:40 { color: hsl(207, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:45, html.auto .sf-c-txt-steelblue\:45 { color: hsl(207, 44%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:50, html.auto .sf-c-txt-steelblue\:50 { color: hsl(207, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:55, html.auto .sf-c-txt-steelblue\:55 { color: hsl(207, 44%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:60, html.auto .sf-c-txt-steelblue\:60 { color: hsl(207, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:65, html.auto .sf-c-txt-steelblue\:65 { color: hsl(207, 44%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:70, html.auto .sf-c-txt-steelblue\:70 { color: hsl(207, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:75, html.auto .sf-c-txt-steelblue\:75 { color: hsl(207, 44%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:80, html.auto .sf-c-txt-steelblue\:80 { color: hsl(207, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:85, html.auto .sf-c-txt-steelblue\:85 { color: hsl(207, 44%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:90, html.auto .sf-c-txt-steelblue\:90 { color: hsl(207, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:95, html.auto .sf-c-txt-steelblue\:95 { color: hsl(207, 44%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:100, html.auto .sf-c-txt-steelblue\:100 { color: hsl(207, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue, html.var.auto .sf-c-txt-steelblue { color: hsl(207, 44%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:0, html.var.auto .sf-c-txt-steelblue\:0 { color: hsl(207, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:5, html.var.auto .sf-c-txt-steelblue\:5 { color: hsl(207, 44%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:10, html.var.auto .sf-c-txt-steelblue\:10 { color: hsl(207, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:15, html.var.auto .sf-c-txt-steelblue\:15 { color: hsl(207, 44%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:20, html.var.auto .sf-c-txt-steelblue\:20 { color: hsl(207, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:25, html.var.auto .sf-c-txt-steelblue\:25 { color: hsl(207, 44%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:30, html.var.auto .sf-c-txt-steelblue\:30 { color: hsl(207, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:35, html.var.auto .sf-c-txt-steelblue\:35 { color: hsl(207, 44%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:40, html.var.auto .sf-c-txt-steelblue\:40 { color: hsl(207, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:45, html.var.auto .sf-c-txt-steelblue\:45 { color: hsl(207, 44%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:50, html.var.auto .sf-c-txt-steelblue\:50 { color: hsl(207, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:55, html.var.auto .sf-c-txt-steelblue\:55 { color: hsl(207, 44%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:60, html.var.auto .sf-c-txt-steelblue\:60 { color: hsl(207, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:65, html.var.auto .sf-c-txt-steelblue\:65 { color: hsl(207, 44%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:70, html.var.auto .sf-c-txt-steelblue\:70 { color: hsl(207, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:75, html.var.auto .sf-c-txt-steelblue\:75 { color: hsl(207, 44%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:80, html.var.auto .sf-c-txt-steelblue\:80 { color: hsl(207, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:85, html.var.auto .sf-c-txt-steelblue\:85 { color: hsl(207, 44%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:90, html.var.auto .sf-c-txt-steelblue\:90 { color: hsl(207, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:95, html.var.auto .sf-c-txt-steelblue\:95 { color: hsl(207, 44%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:100, html.var.auto .sf-c-txt-steelblue\:100 { color: hsl(207, 44%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:dark, html.auto .sf-c-txt-steelblue\:dark { color: hsl(207, 44%, 49%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:0\:dark, html.auto .sf-c-txt-steelblue\:0\:dark { color: hsl(207, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:5\:dark, html.auto .sf-c-txt-steelblue\:5\:dark { color: hsl(207, 44%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:10\:dark, html.auto .sf-c-txt-steelblue\:10\:dark { color: hsl(207, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:15\:dark, html.auto .sf-c-txt-steelblue\:15\:dark { color: hsl(207, 44%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:20\:dark, html.auto .sf-c-txt-steelblue\:20\:dark { color: hsl(207, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:25\:dark, html.auto .sf-c-txt-steelblue\:25\:dark { color: hsl(207, 44%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:30\:dark, html.auto .sf-c-txt-steelblue\:30\:dark { color: hsl(207, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:35\:dark, html.auto .sf-c-txt-steelblue\:35\:dark { color: hsl(207, 44%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:40\:dark, html.auto .sf-c-txt-steelblue\:40\:dark { color: hsl(207, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:45\:dark, html.auto .sf-c-txt-steelblue\:45\:dark { color: hsl(207, 44%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:50\:dark, html.auto .sf-c-txt-steelblue\:50\:dark { color: hsl(207, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:55\:dark, html.auto .sf-c-txt-steelblue\:55\:dark { color: hsl(207, 44%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:60\:dark, html.auto .sf-c-txt-steelblue\:60\:dark { color: hsl(207, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:65\:dark, html.auto .sf-c-txt-steelblue\:65\:dark { color: hsl(207, 44%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:70\:dark, html.auto .sf-c-txt-steelblue\:70\:dark { color: hsl(207, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:75\:dark, html.auto .sf-c-txt-steelblue\:75\:dark { color: hsl(207, 44%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:80\:dark, html.auto .sf-c-txt-steelblue\:80\:dark { color: hsl(207, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:85\:dark, html.auto .sf-c-txt-steelblue\:85\:dark { color: hsl(207, 44%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:90\:dark, html.auto .sf-c-txt-steelblue\:90\:dark { color: hsl(207, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:95\:dark, html.auto .sf-c-txt-steelblue\:95\:dark { color: hsl(207, 44%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-steelblue\:100\:dark, html.auto .sf-c-txt-steelblue\:100\:dark { color: hsl(207, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:dark, html.var.auto .sf-c-txt-steelblue\:dark { color: hsl(207, 44%, 49%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:0\:dark, html.var.auto .sf-c-txt-steelblue\:0\:dark { color: hsl(207, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:5\:dark, html.var.auto .sf-c-txt-steelblue\:5\:dark { color: hsl(207, 44%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:10\:dark, html.var.auto .sf-c-txt-steelblue\:10\:dark { color: hsl(207, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:15\:dark, html.var.auto .sf-c-txt-steelblue\:15\:dark { color: hsl(207, 44%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:20\:dark, html.var.auto .sf-c-txt-steelblue\:20\:dark { color: hsl(207, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:25\:dark, html.var.auto .sf-c-txt-steelblue\:25\:dark { color: hsl(207, 44%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:30\:dark, html.var.auto .sf-c-txt-steelblue\:30\:dark { color: hsl(207, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:35\:dark, html.var.auto .sf-c-txt-steelblue\:35\:dark { color: hsl(207, 44%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:40\:dark, html.var.auto .sf-c-txt-steelblue\:40\:dark { color: hsl(207, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:45\:dark, html.var.auto .sf-c-txt-steelblue\:45\:dark { color: hsl(207, 44%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:50\:dark, html.var.auto .sf-c-txt-steelblue\:50\:dark { color: hsl(207, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:55\:dark, html.var.auto .sf-c-txt-steelblue\:55\:dark { color: hsl(207, 44%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:60\:dark, html.var.auto .sf-c-txt-steelblue\:60\:dark { color: hsl(207, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:65\:dark, html.var.auto .sf-c-txt-steelblue\:65\:dark { color: hsl(207, 44%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:70\:dark, html.var.auto .sf-c-txt-steelblue\:70\:dark { color: hsl(207, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:75\:dark, html.var.auto .sf-c-txt-steelblue\:75\:dark { color: hsl(207, 44%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:80\:dark, html.var.auto .sf-c-txt-steelblue\:80\:dark { color: hsl(207, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:85\:dark, html.var.auto .sf-c-txt-steelblue\:85\:dark { color: hsl(207, 44%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:90\:dark, html.var.auto .sf-c-txt-steelblue\:90\:dark { color: hsl(207, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:95\:dark, html.var.auto .sf-c-txt-steelblue\:95\:dark { color: hsl(207, 44%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-steelblue\:100\:dark, html.var.auto .sf-c-txt-steelblue\:100\:dark { color: hsl(207, 44%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/tan.css b/src/colors/20/tan.css index 51bdab9..1ecc3eb 100644 --- a/src/colors/20/tan.css +++ b/src/colors/20/tan.css @@ -1,4 +1,4 @@ -:root { +[class*='tan'] { --sf-c-tan: 34 44% 69%; --sf-c-tan-0: 34 44% 0%; --sf-c-tan-5: 34 44% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-tan\:100\:dark, html.dark .sf-c-txt-tan\:1 html.var[data-theme='auto'] .sf-c-tan\:95\:dark, html.var.auto .sf-c-tan\:95\:dark { color: hsl(34, 44%, 95%); background: hsl(34, 44%, 5%) } html.var[data-theme='auto'] .sf-c-tan\:100\:dark, html.var.auto .sf-c-tan\:100\:dark { color: hsl(34, 44%, 95%); background: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan, html.auto .sf-c-txt-tan { color: hsl(34, 44%, 69%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:0, html.auto .sf-c-txt-tan\:0 { color: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:5, html.auto .sf-c-txt-tan\:5 { color: hsl(34, 44%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:10, html.auto .sf-c-txt-tan\:10 { color: hsl(34, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:15, html.auto .sf-c-txt-tan\:15 { color: hsl(34, 44%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:20, html.auto .sf-c-txt-tan\:20 { color: hsl(34, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:25, html.auto .sf-c-txt-tan\:25 { color: hsl(34, 44%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:30, html.auto .sf-c-txt-tan\:30 { color: hsl(34, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:35, html.auto .sf-c-txt-tan\:35 { color: hsl(34, 44%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:40, html.auto .sf-c-txt-tan\:40 { color: hsl(34, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:45, html.auto .sf-c-txt-tan\:45 { color: hsl(34, 44%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:50, html.auto .sf-c-txt-tan\:50 { color: hsl(34, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:55, html.auto .sf-c-txt-tan\:55 { color: hsl(34, 44%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:60, html.auto .sf-c-txt-tan\:60 { color: hsl(34, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:65, html.auto .sf-c-txt-tan\:65 { color: hsl(34, 44%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:70, html.auto .sf-c-txt-tan\:70 { color: hsl(34, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:75, html.auto .sf-c-txt-tan\:75 { color: hsl(34, 44%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:80, html.auto .sf-c-txt-tan\:80 { color: hsl(34, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:85, html.auto .sf-c-txt-tan\:85 { color: hsl(34, 44%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:90, html.auto .sf-c-txt-tan\:90 { color: hsl(34, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:95, html.auto .sf-c-txt-tan\:95 { color: hsl(34, 44%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:100, html.auto .sf-c-txt-tan\:100 { color: hsl(34, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tan, html.var.auto .sf-c-txt-tan { color: hsl(34, 44%, 69%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:0, html.var.auto .sf-c-txt-tan\:0 { color: hsl(34, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:5, html.var.auto .sf-c-txt-tan\:5 { color: hsl(34, 44%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:10, html.var.auto .sf-c-txt-tan\:10 { color: hsl(34, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:15, html.var.auto .sf-c-txt-tan\:15 { color: hsl(34, 44%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:20, html.var.auto .sf-c-txt-tan\:20 { color: hsl(34, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:25, html.var.auto .sf-c-txt-tan\:25 { color: hsl(34, 44%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:30, html.var.auto .sf-c-txt-tan\:30 { color: hsl(34, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:35, html.var.auto .sf-c-txt-tan\:35 { color: hsl(34, 44%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:40, html.var.auto .sf-c-txt-tan\:40 { color: hsl(34, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:45, html.var.auto .sf-c-txt-tan\:45 { color: hsl(34, 44%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:50, html.var.auto .sf-c-txt-tan\:50 { color: hsl(34, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:55, html.var.auto .sf-c-txt-tan\:55 { color: hsl(34, 44%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:60, html.var.auto .sf-c-txt-tan\:60 { color: hsl(34, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:65, html.var.auto .sf-c-txt-tan\:65 { color: hsl(34, 44%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:70, html.var.auto .sf-c-txt-tan\:70 { color: hsl(34, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:75, html.var.auto .sf-c-txt-tan\:75 { color: hsl(34, 44%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:80, html.var.auto .sf-c-txt-tan\:80 { color: hsl(34, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:85, html.var.auto .sf-c-txt-tan\:85 { color: hsl(34, 44%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:90, html.var.auto .sf-c-txt-tan\:90 { color: hsl(34, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:95, html.var.auto .sf-c-txt-tan\:95 { color: hsl(34, 44%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:100, html.var.auto .sf-c-txt-tan\:100 { color: hsl(34, 44%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:dark, html.auto .sf-c-txt-tan\:dark { color: hsl(34, 44%, 69%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:0\:dark, html.auto .sf-c-txt-tan\:0\:dark { color: hsl(34, 44%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:5\:dark, html.auto .sf-c-txt-tan\:5\:dark { color: hsl(34, 44%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:10\:dark, html.auto .sf-c-txt-tan\:10\:dark { color: hsl(34, 44%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:15\:dark, html.auto .sf-c-txt-tan\:15\:dark { color: hsl(34, 44%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:20\:dark, html.auto .sf-c-txt-tan\:20\:dark { color: hsl(34, 44%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:25\:dark, html.auto .sf-c-txt-tan\:25\:dark { color: hsl(34, 44%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:30\:dark, html.auto .sf-c-txt-tan\:30\:dark { color: hsl(34, 44%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:35\:dark, html.auto .sf-c-txt-tan\:35\:dark { color: hsl(34, 44%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:40\:dark, html.auto .sf-c-txt-tan\:40\:dark { color: hsl(34, 44%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:45\:dark, html.auto .sf-c-txt-tan\:45\:dark { color: hsl(34, 44%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:50\:dark, html.auto .sf-c-txt-tan\:50\:dark { color: hsl(34, 44%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:55\:dark, html.auto .sf-c-txt-tan\:55\:dark { color: hsl(34, 44%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:60\:dark, html.auto .sf-c-txt-tan\:60\:dark { color: hsl(34, 44%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:65\:dark, html.auto .sf-c-txt-tan\:65\:dark { color: hsl(34, 44%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:70\:dark, html.auto .sf-c-txt-tan\:70\:dark { color: hsl(34, 44%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:75\:dark, html.auto .sf-c-txt-tan\:75\:dark { color: hsl(34, 44%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:80\:dark, html.auto .sf-c-txt-tan\:80\:dark { color: hsl(34, 44%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:85\:dark, html.auto .sf-c-txt-tan\:85\:dark { color: hsl(34, 44%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:90\:dark, html.auto .sf-c-txt-tan\:90\:dark { color: hsl(34, 44%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:95\:dark, html.auto .sf-c-txt-tan\:95\:dark { color: hsl(34, 44%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-tan\:100\:dark, html.auto .sf-c-txt-tan\:100\:dark { color: hsl(34, 44%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:dark, html.var.auto .sf-c-txt-tan\:dark { color: hsl(34, 44%, 69%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:0\:dark, html.var.auto .sf-c-txt-tan\:0\:dark { color: hsl(34, 44%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:5\:dark, html.var.auto .sf-c-txt-tan\:5\:dark { color: hsl(34, 44%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:10\:dark, html.var.auto .sf-c-txt-tan\:10\:dark { color: hsl(34, 44%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:15\:dark, html.var.auto .sf-c-txt-tan\:15\:dark { color: hsl(34, 44%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:20\:dark, html.var.auto .sf-c-txt-tan\:20\:dark { color: hsl(34, 44%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:25\:dark, html.var.auto .sf-c-txt-tan\:25\:dark { color: hsl(34, 44%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:30\:dark, html.var.auto .sf-c-txt-tan\:30\:dark { color: hsl(34, 44%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:35\:dark, html.var.auto .sf-c-txt-tan\:35\:dark { color: hsl(34, 44%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:40\:dark, html.var.auto .sf-c-txt-tan\:40\:dark { color: hsl(34, 44%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:45\:dark, html.var.auto .sf-c-txt-tan\:45\:dark { color: hsl(34, 44%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:50\:dark, html.var.auto .sf-c-txt-tan\:50\:dark { color: hsl(34, 44%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:55\:dark, html.var.auto .sf-c-txt-tan\:55\:dark { color: hsl(34, 44%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:60\:dark, html.var.auto .sf-c-txt-tan\:60\:dark { color: hsl(34, 44%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:65\:dark, html.var.auto .sf-c-txt-tan\:65\:dark { color: hsl(34, 44%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:70\:dark, html.var.auto .sf-c-txt-tan\:70\:dark { color: hsl(34, 44%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:75\:dark, html.var.auto .sf-c-txt-tan\:75\:dark { color: hsl(34, 44%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:80\:dark, html.var.auto .sf-c-txt-tan\:80\:dark { color: hsl(34, 44%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:85\:dark, html.var.auto .sf-c-txt-tan\:85\:dark { color: hsl(34, 44%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:90\:dark, html.var.auto .sf-c-txt-tan\:90\:dark { color: hsl(34, 44%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:95\:dark, html.var.auto .sf-c-txt-tan\:95\:dark { color: hsl(34, 44%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-tan\:100\:dark, html.var.auto .sf-c-txt-tan\:100\:dark { color: hsl(34, 44%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/teal.css b/src/colors/20/teal.css index ac1c1b3..08771ba 100644 --- a/src/colors/20/teal.css +++ b/src/colors/20/teal.css @@ -1,4 +1,4 @@ -:root { +[class*='teal'] { --sf-c-teal: 180 100% 25%; --sf-c-teal-0: 180 100% 0%; --sf-c-teal-5: 180 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-teal\:100\:dark, html.dark .sf-c-txt-teal\ html.var[data-theme='auto'] .sf-c-teal\:95\:dark, html.var.auto .sf-c-teal\:95\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 5%) } html.var[data-theme='auto'] .sf-c-teal\:100\:dark, html.var.auto .sf-c-teal\:100\:dark { color: hsl(180, 100%, 95%); background: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal, html.auto .sf-c-txt-teal { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:0, html.auto .sf-c-txt-teal\:0 { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:5, html.auto .sf-c-txt-teal\:5 { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:10, html.auto .sf-c-txt-teal\:10 { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:15, html.auto .sf-c-txt-teal\:15 { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:20, html.auto .sf-c-txt-teal\:20 { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:25, html.auto .sf-c-txt-teal\:25 { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:30, html.auto .sf-c-txt-teal\:30 { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:35, html.auto .sf-c-txt-teal\:35 { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:40, html.auto .sf-c-txt-teal\:40 { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:45, html.auto .sf-c-txt-teal\:45 { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:50, html.auto .sf-c-txt-teal\:50 { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:55, html.auto .sf-c-txt-teal\:55 { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:60, html.auto .sf-c-txt-teal\:60 { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:65, html.auto .sf-c-txt-teal\:65 { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:70, html.auto .sf-c-txt-teal\:70 { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:75, html.auto .sf-c-txt-teal\:75 { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:80, html.auto .sf-c-txt-teal\:80 { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:85, html.auto .sf-c-txt-teal\:85 { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:90, html.auto .sf-c-txt-teal\:90 { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:95, html.auto .sf-c-txt-teal\:95 { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:100, html.auto .sf-c-txt-teal\:100 { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-teal, html.var.auto .sf-c-txt-teal { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:0, html.var.auto .sf-c-txt-teal\:0 { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:5, html.var.auto .sf-c-txt-teal\:5 { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:10, html.var.auto .sf-c-txt-teal\:10 { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:15, html.var.auto .sf-c-txt-teal\:15 { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:20, html.var.auto .sf-c-txt-teal\:20 { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:25, html.var.auto .sf-c-txt-teal\:25 { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:30, html.var.auto .sf-c-txt-teal\:30 { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:35, html.var.auto .sf-c-txt-teal\:35 { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:40, html.var.auto .sf-c-txt-teal\:40 { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:45, html.var.auto .sf-c-txt-teal\:45 { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:50, html.var.auto .sf-c-txt-teal\:50 { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:55, html.var.auto .sf-c-txt-teal\:55 { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:60, html.var.auto .sf-c-txt-teal\:60 { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:65, html.var.auto .sf-c-txt-teal\:65 { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:70, html.var.auto .sf-c-txt-teal\:70 { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:75, html.var.auto .sf-c-txt-teal\:75 { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:80, html.var.auto .sf-c-txt-teal\:80 { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:85, html.var.auto .sf-c-txt-teal\:85 { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:90, html.var.auto .sf-c-txt-teal\:90 { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:95, html.var.auto .sf-c-txt-teal\:95 { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:100, html.var.auto .sf-c-txt-teal\:100 { color: hsl(180, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:dark, html.auto .sf-c-txt-teal\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark, html.auto .sf-c-txt-teal\:0\:dark { color: hsl(180, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:5\:dark, html.auto .sf-c-txt-teal\:5\:dark { color: hsl(180, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark, html.auto .sf-c-txt-teal\:10\:dark { color: hsl(180, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:15\:dark, html.auto .sf-c-txt-teal\:15\:dark { color: hsl(180, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark, html.auto .sf-c-txt-teal\:20\:dark { color: hsl(180, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:25\:dark, html.auto .sf-c-txt-teal\:25\:dark { color: hsl(180, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark, html.auto .sf-c-txt-teal\:30\:dark { color: hsl(180, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:35\:dark, html.auto .sf-c-txt-teal\:35\:dark { color: hsl(180, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark, html.auto .sf-c-txt-teal\:40\:dark { color: hsl(180, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:45\:dark, html.auto .sf-c-txt-teal\:45\:dark { color: hsl(180, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark, html.auto .sf-c-txt-teal\:50\:dark { color: hsl(180, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:55\:dark, html.auto .sf-c-txt-teal\:55\:dark { color: hsl(180, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark, html.auto .sf-c-txt-teal\:60\:dark { color: hsl(180, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:65\:dark, html.auto .sf-c-txt-teal\:65\:dark { color: hsl(180, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark, html.auto .sf-c-txt-teal\:70\:dark { color: hsl(180, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:75\:dark, html.auto .sf-c-txt-teal\:75\:dark { color: hsl(180, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark, html.auto .sf-c-txt-teal\:80\:dark { color: hsl(180, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:85\:dark, html.auto .sf-c-txt-teal\:85\:dark { color: hsl(180, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark, html.auto .sf-c-txt-teal\:90\:dark { color: hsl(180, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:95\:dark, html.auto .sf-c-txt-teal\:95\:dark { color: hsl(180, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark, html.auto .sf-c-txt-teal\:100\:dark { color: hsl(180, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:dark, html.var.auto .sf-c-txt-teal\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark, html.var.auto .sf-c-txt-teal\:0\:dark { color: hsl(180, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:5\:dark, html.var.auto .sf-c-txt-teal\:5\:dark { color: hsl(180, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark, html.var.auto .sf-c-txt-teal\:10\:dark { color: hsl(180, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:15\:dark, html.var.auto .sf-c-txt-teal\:15\:dark { color: hsl(180, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark, html.var.auto .sf-c-txt-teal\:20\:dark { color: hsl(180, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:25\:dark, html.var.auto .sf-c-txt-teal\:25\:dark { color: hsl(180, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark, html.var.auto .sf-c-txt-teal\:30\:dark { color: hsl(180, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:35\:dark, html.var.auto .sf-c-txt-teal\:35\:dark { color: hsl(180, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark, html.var.auto .sf-c-txt-teal\:40\:dark { color: hsl(180, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:45\:dark, html.var.auto .sf-c-txt-teal\:45\:dark { color: hsl(180, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark, html.var.auto .sf-c-txt-teal\:50\:dark { color: hsl(180, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:55\:dark, html.var.auto .sf-c-txt-teal\:55\:dark { color: hsl(180, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark, html.var.auto .sf-c-txt-teal\:60\:dark { color: hsl(180, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:65\:dark, html.var.auto .sf-c-txt-teal\:65\:dark { color: hsl(180, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark, html.var.auto .sf-c-txt-teal\:70\:dark { color: hsl(180, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:75\:dark, html.var.auto .sf-c-txt-teal\:75\:dark { color: hsl(180, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark, html.var.auto .sf-c-txt-teal\:80\:dark { color: hsl(180, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:85\:dark, html.var.auto .sf-c-txt-teal\:85\:dark { color: hsl(180, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark, html.var.auto .sf-c-txt-teal\:90\:dark { color: hsl(180, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:95\:dark, html.var.auto .sf-c-txt-teal\:95\:dark { color: hsl(180, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark, html.var.auto .sf-c-txt-teal\:100\:dark { color: hsl(180, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/thistle.css b/src/colors/20/thistle.css index d9e0a52..b10c219 100644 --- a/src/colors/20/thistle.css +++ b/src/colors/20/thistle.css @@ -1,4 +1,4 @@ -:root { +[class*='thistle'] { --sf-c-thistle: 300 24% 80%; --sf-c-thistle-0: 300 24% 0%; --sf-c-thistle-5: 300 24% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-thistle\:100\:dark, html.dark .sf-c-txt-th html.var[data-theme='auto'] .sf-c-thistle\:95\:dark, html.var.auto .sf-c-thistle\:95\:dark { color: hsl(300, 24%, 95%); background: hsl(300, 24%, 5%) } html.var[data-theme='auto'] .sf-c-thistle\:100\:dark, html.var.auto .sf-c-thistle\:100\:dark { color: hsl(300, 24%, 95%); background: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle, html.auto .sf-c-txt-thistle { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:0, html.auto .sf-c-txt-thistle\:0 { color: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:5, html.auto .sf-c-txt-thistle\:5 { color: hsl(300, 24%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:10, html.auto .sf-c-txt-thistle\:10 { color: hsl(300, 24%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:15, html.auto .sf-c-txt-thistle\:15 { color: hsl(300, 24%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:20, html.auto .sf-c-txt-thistle\:20 { color: hsl(300, 24%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:25, html.auto .sf-c-txt-thistle\:25 { color: hsl(300, 24%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:30, html.auto .sf-c-txt-thistle\:30 { color: hsl(300, 24%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:35, html.auto .sf-c-txt-thistle\:35 { color: hsl(300, 24%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:40, html.auto .sf-c-txt-thistle\:40 { color: hsl(300, 24%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:45, html.auto .sf-c-txt-thistle\:45 { color: hsl(300, 24%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:50, html.auto .sf-c-txt-thistle\:50 { color: hsl(300, 24%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:55, html.auto .sf-c-txt-thistle\:55 { color: hsl(300, 24%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:60, html.auto .sf-c-txt-thistle\:60 { color: hsl(300, 24%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:65, html.auto .sf-c-txt-thistle\:65 { color: hsl(300, 24%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:70, html.auto .sf-c-txt-thistle\:70 { color: hsl(300, 24%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:75, html.auto .sf-c-txt-thistle\:75 { color: hsl(300, 24%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:80, html.auto .sf-c-txt-thistle\:80 { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:85, html.auto .sf-c-txt-thistle\:85 { color: hsl(300, 24%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:90, html.auto .sf-c-txt-thistle\:90 { color: hsl(300, 24%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:95, html.auto .sf-c-txt-thistle\:95 { color: hsl(300, 24%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:100, html.auto .sf-c-txt-thistle\:100 { color: hsl(300, 24%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-thistle, html.var.auto .sf-c-txt-thistle { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:0, html.var.auto .sf-c-txt-thistle\:0 { color: hsl(300, 24%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:5, html.var.auto .sf-c-txt-thistle\:5 { color: hsl(300, 24%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:10, html.var.auto .sf-c-txt-thistle\:10 { color: hsl(300, 24%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:15, html.var.auto .sf-c-txt-thistle\:15 { color: hsl(300, 24%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:20, html.var.auto .sf-c-txt-thistle\:20 { color: hsl(300, 24%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:25, html.var.auto .sf-c-txt-thistle\:25 { color: hsl(300, 24%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:30, html.var.auto .sf-c-txt-thistle\:30 { color: hsl(300, 24%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:35, html.var.auto .sf-c-txt-thistle\:35 { color: hsl(300, 24%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:40, html.var.auto .sf-c-txt-thistle\:40 { color: hsl(300, 24%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:45, html.var.auto .sf-c-txt-thistle\:45 { color: hsl(300, 24%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:50, html.var.auto .sf-c-txt-thistle\:50 { color: hsl(300, 24%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:55, html.var.auto .sf-c-txt-thistle\:55 { color: hsl(300, 24%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:60, html.var.auto .sf-c-txt-thistle\:60 { color: hsl(300, 24%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:65, html.var.auto .sf-c-txt-thistle\:65 { color: hsl(300, 24%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:70, html.var.auto .sf-c-txt-thistle\:70 { color: hsl(300, 24%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:75, html.var.auto .sf-c-txt-thistle\:75 { color: hsl(300, 24%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:80, html.var.auto .sf-c-txt-thistle\:80 { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:85, html.var.auto .sf-c-txt-thistle\:85 { color: hsl(300, 24%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:90, html.var.auto .sf-c-txt-thistle\:90 { color: hsl(300, 24%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:95, html.var.auto .sf-c-txt-thistle\:95 { color: hsl(300, 24%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:100, html.var.auto .sf-c-txt-thistle\:100 { color: hsl(300, 24%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:dark, html.auto .sf-c-txt-thistle\:dark { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:0\:dark, html.auto .sf-c-txt-thistle\:0\:dark { color: hsl(300, 24%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:5\:dark, html.auto .sf-c-txt-thistle\:5\:dark { color: hsl(300, 24%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:10\:dark, html.auto .sf-c-txt-thistle\:10\:dark { color: hsl(300, 24%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:15\:dark, html.auto .sf-c-txt-thistle\:15\:dark { color: hsl(300, 24%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:20\:dark, html.auto .sf-c-txt-thistle\:20\:dark { color: hsl(300, 24%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:25\:dark, html.auto .sf-c-txt-thistle\:25\:dark { color: hsl(300, 24%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:30\:dark, html.auto .sf-c-txt-thistle\:30\:dark { color: hsl(300, 24%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:35\:dark, html.auto .sf-c-txt-thistle\:35\:dark { color: hsl(300, 24%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:40\:dark, html.auto .sf-c-txt-thistle\:40\:dark { color: hsl(300, 24%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:45\:dark, html.auto .sf-c-txt-thistle\:45\:dark { color: hsl(300, 24%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:50\:dark, html.auto .sf-c-txt-thistle\:50\:dark { color: hsl(300, 24%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:55\:dark, html.auto .sf-c-txt-thistle\:55\:dark { color: hsl(300, 24%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:60\:dark, html.auto .sf-c-txt-thistle\:60\:dark { color: hsl(300, 24%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:65\:dark, html.auto .sf-c-txt-thistle\:65\:dark { color: hsl(300, 24%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:70\:dark, html.auto .sf-c-txt-thistle\:70\:dark { color: hsl(300, 24%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:75\:dark, html.auto .sf-c-txt-thistle\:75\:dark { color: hsl(300, 24%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:80\:dark, html.auto .sf-c-txt-thistle\:80\:dark { color: hsl(300, 24%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:85\:dark, html.auto .sf-c-txt-thistle\:85\:dark { color: hsl(300, 24%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:90\:dark, html.auto .sf-c-txt-thistle\:90\:dark { color: hsl(300, 24%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:95\:dark, html.auto .sf-c-txt-thistle\:95\:dark { color: hsl(300, 24%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-thistle\:100\:dark, html.auto .sf-c-txt-thistle\:100\:dark { color: hsl(300, 24%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:dark, html.var.auto .sf-c-txt-thistle\:dark { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:0\:dark, html.var.auto .sf-c-txt-thistle\:0\:dark { color: hsl(300, 24%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:5\:dark, html.var.auto .sf-c-txt-thistle\:5\:dark { color: hsl(300, 24%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:10\:dark, html.var.auto .sf-c-txt-thistle\:10\:dark { color: hsl(300, 24%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:15\:dark, html.var.auto .sf-c-txt-thistle\:15\:dark { color: hsl(300, 24%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:20\:dark, html.var.auto .sf-c-txt-thistle\:20\:dark { color: hsl(300, 24%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:25\:dark, html.var.auto .sf-c-txt-thistle\:25\:dark { color: hsl(300, 24%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:30\:dark, html.var.auto .sf-c-txt-thistle\:30\:dark { color: hsl(300, 24%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:35\:dark, html.var.auto .sf-c-txt-thistle\:35\:dark { color: hsl(300, 24%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:40\:dark, html.var.auto .sf-c-txt-thistle\:40\:dark { color: hsl(300, 24%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:45\:dark, html.var.auto .sf-c-txt-thistle\:45\:dark { color: hsl(300, 24%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:50\:dark, html.var.auto .sf-c-txt-thistle\:50\:dark { color: hsl(300, 24%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:55\:dark, html.var.auto .sf-c-txt-thistle\:55\:dark { color: hsl(300, 24%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:60\:dark, html.var.auto .sf-c-txt-thistle\:60\:dark { color: hsl(300, 24%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:65\:dark, html.var.auto .sf-c-txt-thistle\:65\:dark { color: hsl(300, 24%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:70\:dark, html.var.auto .sf-c-txt-thistle\:70\:dark { color: hsl(300, 24%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:75\:dark, html.var.auto .sf-c-txt-thistle\:75\:dark { color: hsl(300, 24%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:80\:dark, html.var.auto .sf-c-txt-thistle\:80\:dark { color: hsl(300, 24%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:85\:dark, html.var.auto .sf-c-txt-thistle\:85\:dark { color: hsl(300, 24%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:90\:dark, html.var.auto .sf-c-txt-thistle\:90\:dark { color: hsl(300, 24%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:95\:dark, html.var.auto .sf-c-txt-thistle\:95\:dark { color: hsl(300, 24%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-thistle\:100\:dark, html.var.auto .sf-c-txt-thistle\:100\:dark { color: hsl(300, 24%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/tomato.css b/src/colors/20/tomato.css index 2ff68dc..8f7c7a3 100644 --- a/src/colors/20/tomato.css +++ b/src/colors/20/tomato.css @@ -1,4 +1,4 @@ -:root { +[class*='tomato'] { --sf-c-tomato: 9 100% 64%; --sf-c-tomato-0: 9 100% 0%; --sf-c-tomato-5: 9 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-tomato\:100\:dark, html.dark .sf-c-txt-tom html.var[data-theme='auto'] .sf-c-tomato\:95\:dark, html.var.auto .sf-c-tomato\:95\:dark { color: hsl(9, 100%, 95%); background: hsl(9, 100%, 5%) } html.var[data-theme='auto'] .sf-c-tomato\:100\:dark, html.var.auto .sf-c-tomato\:100\:dark { color: hsl(9, 100%, 95%); background: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato, html.auto .sf-c-txt-tomato { color: hsl(9, 100%, 64%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:0, html.auto .sf-c-txt-tomato\:0 { color: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:5, html.auto .sf-c-txt-tomato\:5 { color: hsl(9, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:10, html.auto .sf-c-txt-tomato\:10 { color: hsl(9, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:15, html.auto .sf-c-txt-tomato\:15 { color: hsl(9, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:20, html.auto .sf-c-txt-tomato\:20 { color: hsl(9, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:25, html.auto .sf-c-txt-tomato\:25 { color: hsl(9, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:30, html.auto .sf-c-txt-tomato\:30 { color: hsl(9, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:35, html.auto .sf-c-txt-tomato\:35 { color: hsl(9, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:40, html.auto .sf-c-txt-tomato\:40 { color: hsl(9, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:45, html.auto .sf-c-txt-tomato\:45 { color: hsl(9, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:50, html.auto .sf-c-txt-tomato\:50 { color: hsl(9, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:55, html.auto .sf-c-txt-tomato\:55 { color: hsl(9, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:60, html.auto .sf-c-txt-tomato\:60 { color: hsl(9, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:65, html.auto .sf-c-txt-tomato\:65 { color: hsl(9, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:70, html.auto .sf-c-txt-tomato\:70 { color: hsl(9, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:75, html.auto .sf-c-txt-tomato\:75 { color: hsl(9, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:80, html.auto .sf-c-txt-tomato\:80 { color: hsl(9, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:85, html.auto .sf-c-txt-tomato\:85 { color: hsl(9, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:90, html.auto .sf-c-txt-tomato\:90 { color: hsl(9, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:95, html.auto .sf-c-txt-tomato\:95 { color: hsl(9, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:100, html.auto .sf-c-txt-tomato\:100 { color: hsl(9, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tomato, html.var.auto .sf-c-txt-tomato { color: hsl(9, 100%, 64%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:0, html.var.auto .sf-c-txt-tomato\:0 { color: hsl(9, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:5, html.var.auto .sf-c-txt-tomato\:5 { color: hsl(9, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:10, html.var.auto .sf-c-txt-tomato\:10 { color: hsl(9, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:15, html.var.auto .sf-c-txt-tomato\:15 { color: hsl(9, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:20, html.var.auto .sf-c-txt-tomato\:20 { color: hsl(9, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:25, html.var.auto .sf-c-txt-tomato\:25 { color: hsl(9, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:30, html.var.auto .sf-c-txt-tomato\:30 { color: hsl(9, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:35, html.var.auto .sf-c-txt-tomato\:35 { color: hsl(9, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:40, html.var.auto .sf-c-txt-tomato\:40 { color: hsl(9, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:45, html.var.auto .sf-c-txt-tomato\:45 { color: hsl(9, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:50, html.var.auto .sf-c-txt-tomato\:50 { color: hsl(9, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:55, html.var.auto .sf-c-txt-tomato\:55 { color: hsl(9, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:60, html.var.auto .sf-c-txt-tomato\:60 { color: hsl(9, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:65, html.var.auto .sf-c-txt-tomato\:65 { color: hsl(9, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:70, html.var.auto .sf-c-txt-tomato\:70 { color: hsl(9, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:75, html.var.auto .sf-c-txt-tomato\:75 { color: hsl(9, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:80, html.var.auto .sf-c-txt-tomato\:80 { color: hsl(9, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:85, html.var.auto .sf-c-txt-tomato\:85 { color: hsl(9, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:90, html.var.auto .sf-c-txt-tomato\:90 { color: hsl(9, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:95, html.var.auto .sf-c-txt-tomato\:95 { color: hsl(9, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:100, html.var.auto .sf-c-txt-tomato\:100 { color: hsl(9, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:dark, html.auto .sf-c-txt-tomato\:dark { color: hsl(9, 100%, 64%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:0\:dark, html.auto .sf-c-txt-tomato\:0\:dark { color: hsl(9, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:5\:dark, html.auto .sf-c-txt-tomato\:5\:dark { color: hsl(9, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:10\:dark, html.auto .sf-c-txt-tomato\:10\:dark { color: hsl(9, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:15\:dark, html.auto .sf-c-txt-tomato\:15\:dark { color: hsl(9, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:20\:dark, html.auto .sf-c-txt-tomato\:20\:dark { color: hsl(9, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:25\:dark, html.auto .sf-c-txt-tomato\:25\:dark { color: hsl(9, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:30\:dark, html.auto .sf-c-txt-tomato\:30\:dark { color: hsl(9, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:35\:dark, html.auto .sf-c-txt-tomato\:35\:dark { color: hsl(9, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:40\:dark, html.auto .sf-c-txt-tomato\:40\:dark { color: hsl(9, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:45\:dark, html.auto .sf-c-txt-tomato\:45\:dark { color: hsl(9, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:50\:dark, html.auto .sf-c-txt-tomato\:50\:dark { color: hsl(9, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:55\:dark, html.auto .sf-c-txt-tomato\:55\:dark { color: hsl(9, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:60\:dark, html.auto .sf-c-txt-tomato\:60\:dark { color: hsl(9, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:65\:dark, html.auto .sf-c-txt-tomato\:65\:dark { color: hsl(9, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:70\:dark, html.auto .sf-c-txt-tomato\:70\:dark { color: hsl(9, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:75\:dark, html.auto .sf-c-txt-tomato\:75\:dark { color: hsl(9, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:80\:dark, html.auto .sf-c-txt-tomato\:80\:dark { color: hsl(9, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:85\:dark, html.auto .sf-c-txt-tomato\:85\:dark { color: hsl(9, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:90\:dark, html.auto .sf-c-txt-tomato\:90\:dark { color: hsl(9, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:95\:dark, html.auto .sf-c-txt-tomato\:95\:dark { color: hsl(9, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-tomato\:100\:dark, html.auto .sf-c-txt-tomato\:100\:dark { color: hsl(9, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:dark, html.var.auto .sf-c-txt-tomato\:dark { color: hsl(9, 100%, 64%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:0\:dark, html.var.auto .sf-c-txt-tomato\:0\:dark { color: hsl(9, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:5\:dark, html.var.auto .sf-c-txt-tomato\:5\:dark { color: hsl(9, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:10\:dark, html.var.auto .sf-c-txt-tomato\:10\:dark { color: hsl(9, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:15\:dark, html.var.auto .sf-c-txt-tomato\:15\:dark { color: hsl(9, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:20\:dark, html.var.auto .sf-c-txt-tomato\:20\:dark { color: hsl(9, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:25\:dark, html.var.auto .sf-c-txt-tomato\:25\:dark { color: hsl(9, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:30\:dark, html.var.auto .sf-c-txt-tomato\:30\:dark { color: hsl(9, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:35\:dark, html.var.auto .sf-c-txt-tomato\:35\:dark { color: hsl(9, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:40\:dark, html.var.auto .sf-c-txt-tomato\:40\:dark { color: hsl(9, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:45\:dark, html.var.auto .sf-c-txt-tomato\:45\:dark { color: hsl(9, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:50\:dark, html.var.auto .sf-c-txt-tomato\:50\:dark { color: hsl(9, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:55\:dark, html.var.auto .sf-c-txt-tomato\:55\:dark { color: hsl(9, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:60\:dark, html.var.auto .sf-c-txt-tomato\:60\:dark { color: hsl(9, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:65\:dark, html.var.auto .sf-c-txt-tomato\:65\:dark { color: hsl(9, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:70\:dark, html.var.auto .sf-c-txt-tomato\:70\:dark { color: hsl(9, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:75\:dark, html.var.auto .sf-c-txt-tomato\:75\:dark { color: hsl(9, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:80\:dark, html.var.auto .sf-c-txt-tomato\:80\:dark { color: hsl(9, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:85\:dark, html.var.auto .sf-c-txt-tomato\:85\:dark { color: hsl(9, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:90\:dark, html.var.auto .sf-c-txt-tomato\:90\:dark { color: hsl(9, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:95\:dark, html.var.auto .sf-c-txt-tomato\:95\:dark { color: hsl(9, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-tomato\:100\:dark, html.var.auto .sf-c-txt-tomato\:100\:dark { color: hsl(9, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/turquoise.css b/src/colors/20/turquoise.css index 9421b6f..cfc4ef4 100644 --- a/src/colors/20/turquoise.css +++ b/src/colors/20/turquoise.css @@ -1,4 +1,4 @@ -:root { +[class*='turquoise'] { --sf-c-turquoise: 174 72% 56%; --sf-c-turquoise-0: 174 72% 0%; --sf-c-turquoise-5: 174 72% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-turquoise\:100\:dark, html.dark .sf-c-txt- html.var[data-theme='auto'] .sf-c-turquoise\:95\:dark, html.var.auto .sf-c-turquoise\:95\:dark { color: hsl(174, 72%, 95%); background: hsl(174, 72%, 5%) } html.var[data-theme='auto'] .sf-c-turquoise\:100\:dark, html.var.auto .sf-c-turquoise\:100\:dark { color: hsl(174, 72%, 95%); background: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise, html.auto .sf-c-txt-turquoise { color: hsl(174, 72%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:0, html.auto .sf-c-txt-turquoise\:0 { color: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:5, html.auto .sf-c-txt-turquoise\:5 { color: hsl(174, 72%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:10, html.auto .sf-c-txt-turquoise\:10 { color: hsl(174, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:15, html.auto .sf-c-txt-turquoise\:15 { color: hsl(174, 72%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:20, html.auto .sf-c-txt-turquoise\:20 { color: hsl(174, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:25, html.auto .sf-c-txt-turquoise\:25 { color: hsl(174, 72%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:30, html.auto .sf-c-txt-turquoise\:30 { color: hsl(174, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:35, html.auto .sf-c-txt-turquoise\:35 { color: hsl(174, 72%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:40, html.auto .sf-c-txt-turquoise\:40 { color: hsl(174, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:45, html.auto .sf-c-txt-turquoise\:45 { color: hsl(174, 72%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:50, html.auto .sf-c-txt-turquoise\:50 { color: hsl(174, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:55, html.auto .sf-c-txt-turquoise\:55 { color: hsl(174, 72%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:60, html.auto .sf-c-txt-turquoise\:60 { color: hsl(174, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:65, html.auto .sf-c-txt-turquoise\:65 { color: hsl(174, 72%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:70, html.auto .sf-c-txt-turquoise\:70 { color: hsl(174, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:75, html.auto .sf-c-txt-turquoise\:75 { color: hsl(174, 72%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:80, html.auto .sf-c-txt-turquoise\:80 { color: hsl(174, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:85, html.auto .sf-c-txt-turquoise\:85 { color: hsl(174, 72%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:90, html.auto .sf-c-txt-turquoise\:90 { color: hsl(174, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:95, html.auto .sf-c-txt-turquoise\:95 { color: hsl(174, 72%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:100, html.auto .sf-c-txt-turquoise\:100 { color: hsl(174, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise, html.var.auto .sf-c-txt-turquoise { color: hsl(174, 72%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:0, html.var.auto .sf-c-txt-turquoise\:0 { color: hsl(174, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:5, html.var.auto .sf-c-txt-turquoise\:5 { color: hsl(174, 72%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:10, html.var.auto .sf-c-txt-turquoise\:10 { color: hsl(174, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:15, html.var.auto .sf-c-txt-turquoise\:15 { color: hsl(174, 72%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:20, html.var.auto .sf-c-txt-turquoise\:20 { color: hsl(174, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:25, html.var.auto .sf-c-txt-turquoise\:25 { color: hsl(174, 72%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:30, html.var.auto .sf-c-txt-turquoise\:30 { color: hsl(174, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:35, html.var.auto .sf-c-txt-turquoise\:35 { color: hsl(174, 72%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:40, html.var.auto .sf-c-txt-turquoise\:40 { color: hsl(174, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:45, html.var.auto .sf-c-txt-turquoise\:45 { color: hsl(174, 72%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:50, html.var.auto .sf-c-txt-turquoise\:50 { color: hsl(174, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:55, html.var.auto .sf-c-txt-turquoise\:55 { color: hsl(174, 72%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:60, html.var.auto .sf-c-txt-turquoise\:60 { color: hsl(174, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:65, html.var.auto .sf-c-txt-turquoise\:65 { color: hsl(174, 72%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:70, html.var.auto .sf-c-txt-turquoise\:70 { color: hsl(174, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:75, html.var.auto .sf-c-txt-turquoise\:75 { color: hsl(174, 72%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:80, html.var.auto .sf-c-txt-turquoise\:80 { color: hsl(174, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:85, html.var.auto .sf-c-txt-turquoise\:85 { color: hsl(174, 72%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:90, html.var.auto .sf-c-txt-turquoise\:90 { color: hsl(174, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:95, html.var.auto .sf-c-txt-turquoise\:95 { color: hsl(174, 72%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:100, html.var.auto .sf-c-txt-turquoise\:100 { color: hsl(174, 72%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:dark, html.auto .sf-c-txt-turquoise\:dark { color: hsl(174, 72%, 56%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:0\:dark, html.auto .sf-c-txt-turquoise\:0\:dark { color: hsl(174, 72%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:5\:dark, html.auto .sf-c-txt-turquoise\:5\:dark { color: hsl(174, 72%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:10\:dark, html.auto .sf-c-txt-turquoise\:10\:dark { color: hsl(174, 72%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:15\:dark, html.auto .sf-c-txt-turquoise\:15\:dark { color: hsl(174, 72%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:20\:dark, html.auto .sf-c-txt-turquoise\:20\:dark { color: hsl(174, 72%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:25\:dark, html.auto .sf-c-txt-turquoise\:25\:dark { color: hsl(174, 72%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:30\:dark, html.auto .sf-c-txt-turquoise\:30\:dark { color: hsl(174, 72%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:35\:dark, html.auto .sf-c-txt-turquoise\:35\:dark { color: hsl(174, 72%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:40\:dark, html.auto .sf-c-txt-turquoise\:40\:dark { color: hsl(174, 72%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:45\:dark, html.auto .sf-c-txt-turquoise\:45\:dark { color: hsl(174, 72%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:50\:dark, html.auto .sf-c-txt-turquoise\:50\:dark { color: hsl(174, 72%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:55\:dark, html.auto .sf-c-txt-turquoise\:55\:dark { color: hsl(174, 72%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:60\:dark, html.auto .sf-c-txt-turquoise\:60\:dark { color: hsl(174, 72%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:65\:dark, html.auto .sf-c-txt-turquoise\:65\:dark { color: hsl(174, 72%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:70\:dark, html.auto .sf-c-txt-turquoise\:70\:dark { color: hsl(174, 72%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:75\:dark, html.auto .sf-c-txt-turquoise\:75\:dark { color: hsl(174, 72%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:80\:dark, html.auto .sf-c-txt-turquoise\:80\:dark { color: hsl(174, 72%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:85\:dark, html.auto .sf-c-txt-turquoise\:85\:dark { color: hsl(174, 72%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:90\:dark, html.auto .sf-c-txt-turquoise\:90\:dark { color: hsl(174, 72%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:95\:dark, html.auto .sf-c-txt-turquoise\:95\:dark { color: hsl(174, 72%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-turquoise\:100\:dark, html.auto .sf-c-txt-turquoise\:100\:dark { color: hsl(174, 72%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:dark, html.var.auto .sf-c-txt-turquoise\:dark { color: hsl(174, 72%, 56%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:0\:dark, html.var.auto .sf-c-txt-turquoise\:0\:dark { color: hsl(174, 72%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:5\:dark, html.var.auto .sf-c-txt-turquoise\:5\:dark { color: hsl(174, 72%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:10\:dark, html.var.auto .sf-c-txt-turquoise\:10\:dark { color: hsl(174, 72%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:15\:dark, html.var.auto .sf-c-txt-turquoise\:15\:dark { color: hsl(174, 72%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:20\:dark, html.var.auto .sf-c-txt-turquoise\:20\:dark { color: hsl(174, 72%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:25\:dark, html.var.auto .sf-c-txt-turquoise\:25\:dark { color: hsl(174, 72%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:30\:dark, html.var.auto .sf-c-txt-turquoise\:30\:dark { color: hsl(174, 72%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:35\:dark, html.var.auto .sf-c-txt-turquoise\:35\:dark { color: hsl(174, 72%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:40\:dark, html.var.auto .sf-c-txt-turquoise\:40\:dark { color: hsl(174, 72%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:45\:dark, html.var.auto .sf-c-txt-turquoise\:45\:dark { color: hsl(174, 72%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:50\:dark, html.var.auto .sf-c-txt-turquoise\:50\:dark { color: hsl(174, 72%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:55\:dark, html.var.auto .sf-c-txt-turquoise\:55\:dark { color: hsl(174, 72%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:60\:dark, html.var.auto .sf-c-txt-turquoise\:60\:dark { color: hsl(174, 72%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:65\:dark, html.var.auto .sf-c-txt-turquoise\:65\:dark { color: hsl(174, 72%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:70\:dark, html.var.auto .sf-c-txt-turquoise\:70\:dark { color: hsl(174, 72%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:75\:dark, html.var.auto .sf-c-txt-turquoise\:75\:dark { color: hsl(174, 72%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:80\:dark, html.var.auto .sf-c-txt-turquoise\:80\:dark { color: hsl(174, 72%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:85\:dark, html.var.auto .sf-c-txt-turquoise\:85\:dark { color: hsl(174, 72%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:90\:dark, html.var.auto .sf-c-txt-turquoise\:90\:dark { color: hsl(174, 72%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:95\:dark, html.var.auto .sf-c-txt-turquoise\:95\:dark { color: hsl(174, 72%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-turquoise\:100\:dark, html.var.auto .sf-c-txt-turquoise\:100\:dark { color: hsl(174, 72%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/violet.css b/src/colors/20/violet.css index 5fc9cbf..f386753 100644 --- a/src/colors/20/violet.css +++ b/src/colors/20/violet.css @@ -1,4 +1,4 @@ -:root { +[class*='violet'] { --sf-c-violet: 300 76% 72%; --sf-c-violet-0: 300 76% 0%; --sf-c-violet-5: 300 76% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-violet\:100\:dark, html.dark .sf-c-txt-vio html.var[data-theme='auto'] .sf-c-violet\:95\:dark, html.var.auto .sf-c-violet\:95\:dark { color: hsl(300, 76%, 95%); background: hsl(300, 76%, 5%) } html.var[data-theme='auto'] .sf-c-violet\:100\:dark, html.var.auto .sf-c-violet\:100\:dark { color: hsl(300, 76%, 95%); background: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet, html.auto .sf-c-txt-violet { color: hsl(300, 76%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:0, html.auto .sf-c-txt-violet\:0 { color: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:5, html.auto .sf-c-txt-violet\:5 { color: hsl(300, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:10, html.auto .sf-c-txt-violet\:10 { color: hsl(300, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:15, html.auto .sf-c-txt-violet\:15 { color: hsl(300, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:20, html.auto .sf-c-txt-violet\:20 { color: hsl(300, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:25, html.auto .sf-c-txt-violet\:25 { color: hsl(300, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:30, html.auto .sf-c-txt-violet\:30 { color: hsl(300, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:35, html.auto .sf-c-txt-violet\:35 { color: hsl(300, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:40, html.auto .sf-c-txt-violet\:40 { color: hsl(300, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:45, html.auto .sf-c-txt-violet\:45 { color: hsl(300, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:50, html.auto .sf-c-txt-violet\:50 { color: hsl(300, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:55, html.auto .sf-c-txt-violet\:55 { color: hsl(300, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:60, html.auto .sf-c-txt-violet\:60 { color: hsl(300, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:65, html.auto .sf-c-txt-violet\:65 { color: hsl(300, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:70, html.auto .sf-c-txt-violet\:70 { color: hsl(300, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:75, html.auto .sf-c-txt-violet\:75 { color: hsl(300, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:80, html.auto .sf-c-txt-violet\:80 { color: hsl(300, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:85, html.auto .sf-c-txt-violet\:85 { color: hsl(300, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:90, html.auto .sf-c-txt-violet\:90 { color: hsl(300, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:95, html.auto .sf-c-txt-violet\:95 { color: hsl(300, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:100, html.auto .sf-c-txt-violet\:100 { color: hsl(300, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-violet, html.var.auto .sf-c-txt-violet { color: hsl(300, 76%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:0, html.var.auto .sf-c-txt-violet\:0 { color: hsl(300, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:5, html.var.auto .sf-c-txt-violet\:5 { color: hsl(300, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:10, html.var.auto .sf-c-txt-violet\:10 { color: hsl(300, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:15, html.var.auto .sf-c-txt-violet\:15 { color: hsl(300, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:20, html.var.auto .sf-c-txt-violet\:20 { color: hsl(300, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:25, html.var.auto .sf-c-txt-violet\:25 { color: hsl(300, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:30, html.var.auto .sf-c-txt-violet\:30 { color: hsl(300, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:35, html.var.auto .sf-c-txt-violet\:35 { color: hsl(300, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:40, html.var.auto .sf-c-txt-violet\:40 { color: hsl(300, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:45, html.var.auto .sf-c-txt-violet\:45 { color: hsl(300, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:50, html.var.auto .sf-c-txt-violet\:50 { color: hsl(300, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:55, html.var.auto .sf-c-txt-violet\:55 { color: hsl(300, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:60, html.var.auto .sf-c-txt-violet\:60 { color: hsl(300, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:65, html.var.auto .sf-c-txt-violet\:65 { color: hsl(300, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:70, html.var.auto .sf-c-txt-violet\:70 { color: hsl(300, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:75, html.var.auto .sf-c-txt-violet\:75 { color: hsl(300, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:80, html.var.auto .sf-c-txt-violet\:80 { color: hsl(300, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:85, html.var.auto .sf-c-txt-violet\:85 { color: hsl(300, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:90, html.var.auto .sf-c-txt-violet\:90 { color: hsl(300, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:95, html.var.auto .sf-c-txt-violet\:95 { color: hsl(300, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:100, html.var.auto .sf-c-txt-violet\:100 { color: hsl(300, 76%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:dark, html.auto .sf-c-txt-violet\:dark { color: hsl(300, 76%, 72%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark, html.auto .sf-c-txt-violet\:0\:dark { color: hsl(300, 76%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:5\:dark, html.auto .sf-c-txt-violet\:5\:dark { color: hsl(300, 76%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark, html.auto .sf-c-txt-violet\:10\:dark { color: hsl(300, 76%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:15\:dark, html.auto .sf-c-txt-violet\:15\:dark { color: hsl(300, 76%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark, html.auto .sf-c-txt-violet\:20\:dark { color: hsl(300, 76%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:25\:dark, html.auto .sf-c-txt-violet\:25\:dark { color: hsl(300, 76%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark, html.auto .sf-c-txt-violet\:30\:dark { color: hsl(300, 76%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:35\:dark, html.auto .sf-c-txt-violet\:35\:dark { color: hsl(300, 76%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark, html.auto .sf-c-txt-violet\:40\:dark { color: hsl(300, 76%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:45\:dark, html.auto .sf-c-txt-violet\:45\:dark { color: hsl(300, 76%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark, html.auto .sf-c-txt-violet\:50\:dark { color: hsl(300, 76%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:55\:dark, html.auto .sf-c-txt-violet\:55\:dark { color: hsl(300, 76%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark, html.auto .sf-c-txt-violet\:60\:dark { color: hsl(300, 76%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:65\:dark, html.auto .sf-c-txt-violet\:65\:dark { color: hsl(300, 76%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark, html.auto .sf-c-txt-violet\:70\:dark { color: hsl(300, 76%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:75\:dark, html.auto .sf-c-txt-violet\:75\:dark { color: hsl(300, 76%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark, html.auto .sf-c-txt-violet\:80\:dark { color: hsl(300, 76%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:85\:dark, html.auto .sf-c-txt-violet\:85\:dark { color: hsl(300, 76%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark, html.auto .sf-c-txt-violet\:90\:dark { color: hsl(300, 76%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:95\:dark, html.auto .sf-c-txt-violet\:95\:dark { color: hsl(300, 76%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark, html.auto .sf-c-txt-violet\:100\:dark { color: hsl(300, 76%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:dark, html.var.auto .sf-c-txt-violet\:dark { color: hsl(300, 76%, 72%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:0\:dark, html.var.auto .sf-c-txt-violet\:0\:dark { color: hsl(300, 76%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:5\:dark, html.var.auto .sf-c-txt-violet\:5\:dark { color: hsl(300, 76%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:10\:dark, html.var.auto .sf-c-txt-violet\:10\:dark { color: hsl(300, 76%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:15\:dark, html.var.auto .sf-c-txt-violet\:15\:dark { color: hsl(300, 76%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:20\:dark, html.var.auto .sf-c-txt-violet\:20\:dark { color: hsl(300, 76%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:25\:dark, html.var.auto .sf-c-txt-violet\:25\:dark { color: hsl(300, 76%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:30\:dark, html.var.auto .sf-c-txt-violet\:30\:dark { color: hsl(300, 76%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:35\:dark, html.var.auto .sf-c-txt-violet\:35\:dark { color: hsl(300, 76%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:40\:dark, html.var.auto .sf-c-txt-violet\:40\:dark { color: hsl(300, 76%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:45\:dark, html.var.auto .sf-c-txt-violet\:45\:dark { color: hsl(300, 76%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:50\:dark, html.var.auto .sf-c-txt-violet\:50\:dark { color: hsl(300, 76%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:55\:dark, html.var.auto .sf-c-txt-violet\:55\:dark { color: hsl(300, 76%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:60\:dark, html.var.auto .sf-c-txt-violet\:60\:dark { color: hsl(300, 76%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:65\:dark, html.var.auto .sf-c-txt-violet\:65\:dark { color: hsl(300, 76%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:70\:dark, html.var.auto .sf-c-txt-violet\:70\:dark { color: hsl(300, 76%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:75\:dark, html.var.auto .sf-c-txt-violet\:75\:dark { color: hsl(300, 76%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:80\:dark, html.var.auto .sf-c-txt-violet\:80\:dark { color: hsl(300, 76%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:85\:dark, html.var.auto .sf-c-txt-violet\:85\:dark { color: hsl(300, 76%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:90\:dark, html.var.auto .sf-c-txt-violet\:90\:dark { color: hsl(300, 76%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:95\:dark, html.var.auto .sf-c-txt-violet\:95\:dark { color: hsl(300, 76%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-violet\:100\:dark, html.var.auto .sf-c-txt-violet\:100\:dark { color: hsl(300, 76%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/wheat.css b/src/colors/20/wheat.css index 92a997d..e3bcc1d 100644 --- a/src/colors/20/wheat.css +++ b/src/colors/20/wheat.css @@ -1,4 +1,4 @@ -:root { +[class*='wheat'] { --sf-c-wheat: 39 77% 83%; --sf-c-wheat-0: 39 77% 0%; --sf-c-wheat-5: 39 77% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-wheat\:100\:dark, html.dark .sf-c-txt-whea html.var[data-theme='auto'] .sf-c-wheat\:95\:dark, html.var.auto .sf-c-wheat\:95\:dark { color: hsl(39, 77%, 95%); background: hsl(39, 77%, 5%) } html.var[data-theme='auto'] .sf-c-wheat\:100\:dark, html.var.auto .sf-c-wheat\:100\:dark { color: hsl(39, 77%, 95%); background: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat, html.auto .sf-c-txt-wheat { color: hsl(39, 77%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:0, html.auto .sf-c-txt-wheat\:0 { color: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:5, html.auto .sf-c-txt-wheat\:5 { color: hsl(39, 77%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:10, html.auto .sf-c-txt-wheat\:10 { color: hsl(39, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:15, html.auto .sf-c-txt-wheat\:15 { color: hsl(39, 77%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:20, html.auto .sf-c-txt-wheat\:20 { color: hsl(39, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:25, html.auto .sf-c-txt-wheat\:25 { color: hsl(39, 77%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:30, html.auto .sf-c-txt-wheat\:30 { color: hsl(39, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:35, html.auto .sf-c-txt-wheat\:35 { color: hsl(39, 77%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:40, html.auto .sf-c-txt-wheat\:40 { color: hsl(39, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:45, html.auto .sf-c-txt-wheat\:45 { color: hsl(39, 77%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:50, html.auto .sf-c-txt-wheat\:50 { color: hsl(39, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:55, html.auto .sf-c-txt-wheat\:55 { color: hsl(39, 77%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:60, html.auto .sf-c-txt-wheat\:60 { color: hsl(39, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:65, html.auto .sf-c-txt-wheat\:65 { color: hsl(39, 77%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:70, html.auto .sf-c-txt-wheat\:70 { color: hsl(39, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:75, html.auto .sf-c-txt-wheat\:75 { color: hsl(39, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:80, html.auto .sf-c-txt-wheat\:80 { color: hsl(39, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:85, html.auto .sf-c-txt-wheat\:85 { color: hsl(39, 77%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:90, html.auto .sf-c-txt-wheat\:90 { color: hsl(39, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:95, html.auto .sf-c-txt-wheat\:95 { color: hsl(39, 77%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:100, html.auto .sf-c-txt-wheat\:100 { color: hsl(39, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-wheat, html.var.auto .sf-c-txt-wheat { color: hsl(39, 77%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:0, html.var.auto .sf-c-txt-wheat\:0 { color: hsl(39, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:5, html.var.auto .sf-c-txt-wheat\:5 { color: hsl(39, 77%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:10, html.var.auto .sf-c-txt-wheat\:10 { color: hsl(39, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:15, html.var.auto .sf-c-txt-wheat\:15 { color: hsl(39, 77%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:20, html.var.auto .sf-c-txt-wheat\:20 { color: hsl(39, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:25, html.var.auto .sf-c-txt-wheat\:25 { color: hsl(39, 77%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:30, html.var.auto .sf-c-txt-wheat\:30 { color: hsl(39, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:35, html.var.auto .sf-c-txt-wheat\:35 { color: hsl(39, 77%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:40, html.var.auto .sf-c-txt-wheat\:40 { color: hsl(39, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:45, html.var.auto .sf-c-txt-wheat\:45 { color: hsl(39, 77%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:50, html.var.auto .sf-c-txt-wheat\:50 { color: hsl(39, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:55, html.var.auto .sf-c-txt-wheat\:55 { color: hsl(39, 77%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:60, html.var.auto .sf-c-txt-wheat\:60 { color: hsl(39, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:65, html.var.auto .sf-c-txt-wheat\:65 { color: hsl(39, 77%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:70, html.var.auto .sf-c-txt-wheat\:70 { color: hsl(39, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:75, html.var.auto .sf-c-txt-wheat\:75 { color: hsl(39, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:80, html.var.auto .sf-c-txt-wheat\:80 { color: hsl(39, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:85, html.var.auto .sf-c-txt-wheat\:85 { color: hsl(39, 77%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:90, html.var.auto .sf-c-txt-wheat\:90 { color: hsl(39, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:95, html.var.auto .sf-c-txt-wheat\:95 { color: hsl(39, 77%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:100, html.var.auto .sf-c-txt-wheat\:100 { color: hsl(39, 77%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:dark, html.auto .sf-c-txt-wheat\:dark { color: hsl(39, 77%, 83%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:0\:dark, html.auto .sf-c-txt-wheat\:0\:dark { color: hsl(39, 77%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:5\:dark, html.auto .sf-c-txt-wheat\:5\:dark { color: hsl(39, 77%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:10\:dark, html.auto .sf-c-txt-wheat\:10\:dark { color: hsl(39, 77%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:15\:dark, html.auto .sf-c-txt-wheat\:15\:dark { color: hsl(39, 77%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:20\:dark, html.auto .sf-c-txt-wheat\:20\:dark { color: hsl(39, 77%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:25\:dark, html.auto .sf-c-txt-wheat\:25\:dark { color: hsl(39, 77%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:30\:dark, html.auto .sf-c-txt-wheat\:30\:dark { color: hsl(39, 77%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:35\:dark, html.auto .sf-c-txt-wheat\:35\:dark { color: hsl(39, 77%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:40\:dark, html.auto .sf-c-txt-wheat\:40\:dark { color: hsl(39, 77%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:45\:dark, html.auto .sf-c-txt-wheat\:45\:dark { color: hsl(39, 77%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:50\:dark, html.auto .sf-c-txt-wheat\:50\:dark { color: hsl(39, 77%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:55\:dark, html.auto .sf-c-txt-wheat\:55\:dark { color: hsl(39, 77%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:60\:dark, html.auto .sf-c-txt-wheat\:60\:dark { color: hsl(39, 77%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:65\:dark, html.auto .sf-c-txt-wheat\:65\:dark { color: hsl(39, 77%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:70\:dark, html.auto .sf-c-txt-wheat\:70\:dark { color: hsl(39, 77%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:75\:dark, html.auto .sf-c-txt-wheat\:75\:dark { color: hsl(39, 77%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:80\:dark, html.auto .sf-c-txt-wheat\:80\:dark { color: hsl(39, 77%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:85\:dark, html.auto .sf-c-txt-wheat\:85\:dark { color: hsl(39, 77%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:90\:dark, html.auto .sf-c-txt-wheat\:90\:dark { color: hsl(39, 77%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:95\:dark, html.auto .sf-c-txt-wheat\:95\:dark { color: hsl(39, 77%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-wheat\:100\:dark, html.auto .sf-c-txt-wheat\:100\:dark { color: hsl(39, 77%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:dark, html.var.auto .sf-c-txt-wheat\:dark { color: hsl(39, 77%, 83%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:0\:dark, html.var.auto .sf-c-txt-wheat\:0\:dark { color: hsl(39, 77%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:5\:dark, html.var.auto .sf-c-txt-wheat\:5\:dark { color: hsl(39, 77%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:10\:dark, html.var.auto .sf-c-txt-wheat\:10\:dark { color: hsl(39, 77%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:15\:dark, html.var.auto .sf-c-txt-wheat\:15\:dark { color: hsl(39, 77%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:20\:dark, html.var.auto .sf-c-txt-wheat\:20\:dark { color: hsl(39, 77%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:25\:dark, html.var.auto .sf-c-txt-wheat\:25\:dark { color: hsl(39, 77%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:30\:dark, html.var.auto .sf-c-txt-wheat\:30\:dark { color: hsl(39, 77%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:35\:dark, html.var.auto .sf-c-txt-wheat\:35\:dark { color: hsl(39, 77%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:40\:dark, html.var.auto .sf-c-txt-wheat\:40\:dark { color: hsl(39, 77%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:45\:dark, html.var.auto .sf-c-txt-wheat\:45\:dark { color: hsl(39, 77%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:50\:dark, html.var.auto .sf-c-txt-wheat\:50\:dark { color: hsl(39, 77%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:55\:dark, html.var.auto .sf-c-txt-wheat\:55\:dark { color: hsl(39, 77%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:60\:dark, html.var.auto .sf-c-txt-wheat\:60\:dark { color: hsl(39, 77%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:65\:dark, html.var.auto .sf-c-txt-wheat\:65\:dark { color: hsl(39, 77%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:70\:dark, html.var.auto .sf-c-txt-wheat\:70\:dark { color: hsl(39, 77%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:75\:dark, html.var.auto .sf-c-txt-wheat\:75\:dark { color: hsl(39, 77%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:80\:dark, html.var.auto .sf-c-txt-wheat\:80\:dark { color: hsl(39, 77%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:85\:dark, html.var.auto .sf-c-txt-wheat\:85\:dark { color: hsl(39, 77%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:90\:dark, html.var.auto .sf-c-txt-wheat\:90\:dark { color: hsl(39, 77%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:95\:dark, html.var.auto .sf-c-txt-wheat\:95\:dark { color: hsl(39, 77%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-wheat\:100\:dark, html.var.auto .sf-c-txt-wheat\:100\:dark { color: hsl(39, 77%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/white.css b/src/colors/20/white.css index 1983937..fd633af 100644 --- a/src/colors/20/white.css +++ b/src/colors/20/white.css @@ -1,4 +1,4 @@ -:root { +[class*='white'] { --sf-c-white: 0 0% 100%; --sf-c-white-0: 0 0% 0%; --sf-c-white-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-white\:100\:dark, html.dark .sf-c-txt-whit html.var[data-theme='auto'] .sf-c-white\:95\:dark, html.var.auto .sf-c-white\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-white\:100\:dark, html.var.auto .sf-c-white\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white, html.auto .sf-c-txt-white { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:0, html.auto .sf-c-txt-white\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white\:5, html.auto .sf-c-txt-white\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-white\:10, html.auto .sf-c-txt-white\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-white\:15, html.auto .sf-c-txt-white\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-white\:20, html.auto .sf-c-txt-white\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-white\:25, html.auto .sf-c-txt-white\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-white\:30, html.auto .sf-c-txt-white\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-white\:35, html.auto .sf-c-txt-white\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-white\:40, html.auto .sf-c-txt-white\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-white\:45, html.auto .sf-c-txt-white\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-white\:50, html.auto .sf-c-txt-white\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-white\:55, html.auto .sf-c-txt-white\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-white\:60, html.auto .sf-c-txt-white\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-white\:65, html.auto .sf-c-txt-white\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-white\:70, html.auto .sf-c-txt-white\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-white\:75, html.auto .sf-c-txt-white\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-white\:80, html.auto .sf-c-txt-white\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-white\:85, html.auto .sf-c-txt-white\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-white\:90, html.auto .sf-c-txt-white\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-white\:95, html.auto .sf-c-txt-white\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-white\:100, html.auto .sf-c-txt-white\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white, html.var.auto .sf-c-txt-white { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:0, html.var.auto .sf-c-txt-white\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-white\:5, html.var.auto .sf-c-txt-white\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-white\:10, html.var.auto .sf-c-txt-white\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-white\:15, html.var.auto .sf-c-txt-white\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-white\:20, html.var.auto .sf-c-txt-white\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-white\:25, html.var.auto .sf-c-txt-white\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-white\:30, html.var.auto .sf-c-txt-white\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-white\:35, html.var.auto .sf-c-txt-white\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-white\:40, html.var.auto .sf-c-txt-white\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-white\:45, html.var.auto .sf-c-txt-white\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-white\:50, html.var.auto .sf-c-txt-white\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-white\:55, html.var.auto .sf-c-txt-white\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-white\:60, html.var.auto .sf-c-txt-white\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-white\:65, html.var.auto .sf-c-txt-white\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-white\:70, html.var.auto .sf-c-txt-white\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-white\:75, html.var.auto .sf-c-txt-white\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-white\:80, html.var.auto .sf-c-txt-white\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-white\:85, html.var.auto .sf-c-txt-white\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-white\:90, html.var.auto .sf-c-txt-white\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-white\:95, html.var.auto .sf-c-txt-white\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-white\:100, html.var.auto .sf-c-txt-white\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:dark, html.auto .sf-c-txt-white\:dark { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark, html.auto .sf-c-txt-white\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-white\:5\:dark, html.auto .sf-c-txt-white\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark, html.auto .sf-c-txt-white\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-white\:15\:dark, html.auto .sf-c-txt-white\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark, html.auto .sf-c-txt-white\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-white\:25\:dark, html.auto .sf-c-txt-white\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark, html.auto .sf-c-txt-white\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-white\:35\:dark, html.auto .sf-c-txt-white\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark, html.auto .sf-c-txt-white\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-white\:45\:dark, html.auto .sf-c-txt-white\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark, html.auto .sf-c-txt-white\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-white\:55\:dark, html.auto .sf-c-txt-white\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark, html.auto .sf-c-txt-white\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-white\:65\:dark, html.auto .sf-c-txt-white\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark, html.auto .sf-c-txt-white\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-white\:75\:dark, html.auto .sf-c-txt-white\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark, html.auto .sf-c-txt-white\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-white\:85\:dark, html.auto .sf-c-txt-white\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark, html.auto .sf-c-txt-white\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-white\:95\:dark, html.auto .sf-c-txt-white\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark, html.auto .sf-c-txt-white\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:dark, html.var.auto .sf-c-txt-white\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark, html.var.auto .sf-c-txt-white\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-white\:5\:dark, html.var.auto .sf-c-txt-white\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark, html.var.auto .sf-c-txt-white\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-white\:15\:dark, html.var.auto .sf-c-txt-white\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark, html.var.auto .sf-c-txt-white\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-white\:25\:dark, html.var.auto .sf-c-txt-white\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark, html.var.auto .sf-c-txt-white\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-white\:35\:dark, html.var.auto .sf-c-txt-white\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark, html.var.auto .sf-c-txt-white\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-white\:45\:dark, html.var.auto .sf-c-txt-white\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark, html.var.auto .sf-c-txt-white\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-white\:55\:dark, html.var.auto .sf-c-txt-white\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark, html.var.auto .sf-c-txt-white\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-white\:65\:dark, html.var.auto .sf-c-txt-white\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark, html.var.auto .sf-c-txt-white\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-white\:75\:dark, html.var.auto .sf-c-txt-white\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark, html.var.auto .sf-c-txt-white\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-white\:85\:dark, html.var.auto .sf-c-txt-white\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark, html.var.auto .sf-c-txt-white\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-white\:95\:dark, html.var.auto .sf-c-txt-white\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark, html.var.auto .sf-c-txt-white\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/whitesmoke.css b/src/colors/20/whitesmoke.css index bef8acb..c42406b 100644 --- a/src/colors/20/whitesmoke.css +++ b/src/colors/20/whitesmoke.css @@ -1,4 +1,4 @@ -:root { +[class*='whitesmoke'] { --sf-c-whitesmoke: 0 0% 96%; --sf-c-whitesmoke-0: 0 0% 0%; --sf-c-whitesmoke-5: 0 0% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-whitesmoke\:100\:dark, html.dark .sf-c-txt html.var[data-theme='auto'] .sf-c-whitesmoke\:95\:dark, html.var.auto .sf-c-whitesmoke\:95\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 5%) } html.var[data-theme='auto'] .sf-c-whitesmoke\:100\:dark, html.var.auto .sf-c-whitesmoke\:100\:dark { color: hsl(0, 0%, 95%); background: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke, html.auto .sf-c-txt-whitesmoke { color: hsl(0, 0%, 96%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0, html.auto .sf-c-txt-whitesmoke\:0 { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:5, html.auto .sf-c-txt-whitesmoke\:5 { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10, html.auto .sf-c-txt-whitesmoke\:10 { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:15, html.auto .sf-c-txt-whitesmoke\:15 { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20, html.auto .sf-c-txt-whitesmoke\:20 { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:25, html.auto .sf-c-txt-whitesmoke\:25 { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30, html.auto .sf-c-txt-whitesmoke\:30 { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:35, html.auto .sf-c-txt-whitesmoke\:35 { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40, html.auto .sf-c-txt-whitesmoke\:40 { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:45, html.auto .sf-c-txt-whitesmoke\:45 { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50, html.auto .sf-c-txt-whitesmoke\:50 { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:55, html.auto .sf-c-txt-whitesmoke\:55 { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60, html.auto .sf-c-txt-whitesmoke\:60 { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:65, html.auto .sf-c-txt-whitesmoke\:65 { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70, html.auto .sf-c-txt-whitesmoke\:70 { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:75, html.auto .sf-c-txt-whitesmoke\:75 { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80, html.auto .sf-c-txt-whitesmoke\:80 { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:85, html.auto .sf-c-txt-whitesmoke\:85 { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90, html.auto .sf-c-txt-whitesmoke\:90 { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:95, html.auto .sf-c-txt-whitesmoke\:95 { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100, html.auto .sf-c-txt-whitesmoke\:100 { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke, html.var.auto .sf-c-txt-whitesmoke { color: hsl(0, 0%, 96%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0, html.var.auto .sf-c-txt-whitesmoke\:0 { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:5, html.var.auto .sf-c-txt-whitesmoke\:5 { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10, html.var.auto .sf-c-txt-whitesmoke\:10 { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:15, html.var.auto .sf-c-txt-whitesmoke\:15 { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20, html.var.auto .sf-c-txt-whitesmoke\:20 { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:25, html.var.auto .sf-c-txt-whitesmoke\:25 { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30, html.var.auto .sf-c-txt-whitesmoke\:30 { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:35, html.var.auto .sf-c-txt-whitesmoke\:35 { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40, html.var.auto .sf-c-txt-whitesmoke\:40 { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:45, html.var.auto .sf-c-txt-whitesmoke\:45 { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50, html.var.auto .sf-c-txt-whitesmoke\:50 { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:55, html.var.auto .sf-c-txt-whitesmoke\:55 { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60, html.var.auto .sf-c-txt-whitesmoke\:60 { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:65, html.var.auto .sf-c-txt-whitesmoke\:65 { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70, html.var.auto .sf-c-txt-whitesmoke\:70 { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:75, html.var.auto .sf-c-txt-whitesmoke\:75 { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80, html.var.auto .sf-c-txt-whitesmoke\:80 { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:85, html.var.auto .sf-c-txt-whitesmoke\:85 { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90, html.var.auto .sf-c-txt-whitesmoke\:90 { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:95, html.var.auto .sf-c-txt-whitesmoke\:95 { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100, html.var.auto .sf-c-txt-whitesmoke\:100 { color: hsl(0, 0%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:dark, html.auto .sf-c-txt-whitesmoke\:dark { color: hsl(0, 0%, 96%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0\:dark, html.auto .sf-c-txt-whitesmoke\:0\:dark { color: hsl(0, 0%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:5\:dark, html.auto .sf-c-txt-whitesmoke\:5\:dark { color: hsl(0, 0%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10\:dark, html.auto .sf-c-txt-whitesmoke\:10\:dark { color: hsl(0, 0%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:15\:dark, html.auto .sf-c-txt-whitesmoke\:15\:dark { color: hsl(0, 0%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20\:dark, html.auto .sf-c-txt-whitesmoke\:20\:dark { color: hsl(0, 0%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:25\:dark, html.auto .sf-c-txt-whitesmoke\:25\:dark { color: hsl(0, 0%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30\:dark, html.auto .sf-c-txt-whitesmoke\:30\:dark { color: hsl(0, 0%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:35\:dark, html.auto .sf-c-txt-whitesmoke\:35\:dark { color: hsl(0, 0%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40\:dark, html.auto .sf-c-txt-whitesmoke\:40\:dark { color: hsl(0, 0%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:45\:dark, html.auto .sf-c-txt-whitesmoke\:45\:dark { color: hsl(0, 0%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50\:dark, html.auto .sf-c-txt-whitesmoke\:50\:dark { color: hsl(0, 0%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:55\:dark, html.auto .sf-c-txt-whitesmoke\:55\:dark { color: hsl(0, 0%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60\:dark, html.auto .sf-c-txt-whitesmoke\:60\:dark { color: hsl(0, 0%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:65\:dark, html.auto .sf-c-txt-whitesmoke\:65\:dark { color: hsl(0, 0%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70\:dark, html.auto .sf-c-txt-whitesmoke\:70\:dark { color: hsl(0, 0%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:75\:dark, html.auto .sf-c-txt-whitesmoke\:75\:dark { color: hsl(0, 0%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80\:dark, html.auto .sf-c-txt-whitesmoke\:80\:dark { color: hsl(0, 0%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:85\:dark, html.auto .sf-c-txt-whitesmoke\:85\:dark { color: hsl(0, 0%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90\:dark, html.auto .sf-c-txt-whitesmoke\:90\:dark { color: hsl(0, 0%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:95\:dark, html.auto .sf-c-txt-whitesmoke\:95\:dark { color: hsl(0, 0%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100\:dark, html.auto .sf-c-txt-whitesmoke\:100\:dark { color: hsl(0, 0%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:dark, html.var.auto .sf-c-txt-whitesmoke\:dark { color: hsl(0, 0%, 96%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:0\:dark, html.var.auto .sf-c-txt-whitesmoke\:0\:dark { color: hsl(0, 0%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:5\:dark, html.var.auto .sf-c-txt-whitesmoke\:5\:dark { color: hsl(0, 0%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:10\:dark, html.var.auto .sf-c-txt-whitesmoke\:10\:dark { color: hsl(0, 0%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:15\:dark, html.var.auto .sf-c-txt-whitesmoke\:15\:dark { color: hsl(0, 0%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:20\:dark, html.var.auto .sf-c-txt-whitesmoke\:20\:dark { color: hsl(0, 0%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:25\:dark, html.var.auto .sf-c-txt-whitesmoke\:25\:dark { color: hsl(0, 0%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:30\:dark, html.var.auto .sf-c-txt-whitesmoke\:30\:dark { color: hsl(0, 0%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:35\:dark, html.var.auto .sf-c-txt-whitesmoke\:35\:dark { color: hsl(0, 0%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:40\:dark, html.var.auto .sf-c-txt-whitesmoke\:40\:dark { color: hsl(0, 0%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:45\:dark, html.var.auto .sf-c-txt-whitesmoke\:45\:dark { color: hsl(0, 0%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:50\:dark, html.var.auto .sf-c-txt-whitesmoke\:50\:dark { color: hsl(0, 0%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:55\:dark, html.var.auto .sf-c-txt-whitesmoke\:55\:dark { color: hsl(0, 0%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:60\:dark, html.var.auto .sf-c-txt-whitesmoke\:60\:dark { color: hsl(0, 0%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:65\:dark, html.var.auto .sf-c-txt-whitesmoke\:65\:dark { color: hsl(0, 0%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:70\:dark, html.var.auto .sf-c-txt-whitesmoke\:70\:dark { color: hsl(0, 0%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:75\:dark, html.var.auto .sf-c-txt-whitesmoke\:75\:dark { color: hsl(0, 0%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:80\:dark, html.var.auto .sf-c-txt-whitesmoke\:80\:dark { color: hsl(0, 0%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:85\:dark, html.var.auto .sf-c-txt-whitesmoke\:85\:dark { color: hsl(0, 0%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:90\:dark, html.var.auto .sf-c-txt-whitesmoke\:90\:dark { color: hsl(0, 0%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:95\:dark, html.var.auto .sf-c-txt-whitesmoke\:95\:dark { color: hsl(0, 0%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-whitesmoke\:100\:dark, html.var.auto .sf-c-txt-whitesmoke\:100\:dark { color: hsl(0, 0%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/yellow.css b/src/colors/20/yellow.css index 97f73f5..6bae763 100644 --- a/src/colors/20/yellow.css +++ b/src/colors/20/yellow.css @@ -1,4 +1,4 @@ -:root { +[class*='yellow'] { --sf-c-yellow: 60 100% 50%; --sf-c-yellow-0: 60 100% 0%; --sf-c-yellow-5: 60 100% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark, html.dark .sf-c-txt-yel html.var[data-theme='auto'] .sf-c-yellow\:95\:dark, html.var.auto .sf-c-yellow\:95\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 5%) } html.var[data-theme='auto'] .sf-c-yellow\:100\:dark, html.var.auto .sf-c-yellow\:100\:dark { color: hsl(60, 100%, 95%); background: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow, html.auto .sf-c-txt-yellow { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:0, html.auto .sf-c-txt-yellow\:0 { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:5, html.auto .sf-c-txt-yellow\:5 { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:10, html.auto .sf-c-txt-yellow\:10 { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:15, html.auto .sf-c-txt-yellow\:15 { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:20, html.auto .sf-c-txt-yellow\:20 { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:25, html.auto .sf-c-txt-yellow\:25 { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:30, html.auto .sf-c-txt-yellow\:30 { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:35, html.auto .sf-c-txt-yellow\:35 { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:40, html.auto .sf-c-txt-yellow\:40 { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:45, html.auto .sf-c-txt-yellow\:45 { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:50, html.auto .sf-c-txt-yellow\:50 { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:55, html.auto .sf-c-txt-yellow\:55 { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:60, html.auto .sf-c-txt-yellow\:60 { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:65, html.auto .sf-c-txt-yellow\:65 { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:70, html.auto .sf-c-txt-yellow\:70 { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:75, html.auto .sf-c-txt-yellow\:75 { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:80, html.auto .sf-c-txt-yellow\:80 { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:85, html.auto .sf-c-txt-yellow\:85 { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:90, html.auto .sf-c-txt-yellow\:90 { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:95, html.auto .sf-c-txt-yellow\:95 { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:100, html.auto .sf-c-txt-yellow\:100 { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellow, html.var.auto .sf-c-txt-yellow { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:0, html.var.auto .sf-c-txt-yellow\:0 { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:5, html.var.auto .sf-c-txt-yellow\:5 { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:10, html.var.auto .sf-c-txt-yellow\:10 { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:15, html.var.auto .sf-c-txt-yellow\:15 { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:20, html.var.auto .sf-c-txt-yellow\:20 { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:25, html.var.auto .sf-c-txt-yellow\:25 { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:30, html.var.auto .sf-c-txt-yellow\:30 { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:35, html.var.auto .sf-c-txt-yellow\:35 { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:40, html.var.auto .sf-c-txt-yellow\:40 { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:45, html.var.auto .sf-c-txt-yellow\:45 { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:50, html.var.auto .sf-c-txt-yellow\:50 { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:55, html.var.auto .sf-c-txt-yellow\:55 { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:60, html.var.auto .sf-c-txt-yellow\:60 { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:65, html.var.auto .sf-c-txt-yellow\:65 { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:70, html.var.auto .sf-c-txt-yellow\:70 { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:75, html.var.auto .sf-c-txt-yellow\:75 { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:80, html.var.auto .sf-c-txt-yellow\:80 { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:85, html.var.auto .sf-c-txt-yellow\:85 { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:90, html.var.auto .sf-c-txt-yellow\:90 { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:95, html.var.auto .sf-c-txt-yellow\:95 { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:100, html.var.auto .sf-c-txt-yellow\:100 { color: hsl(60, 100%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:dark, html.auto .sf-c-txt-yellow\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark, html.auto .sf-c-txt-yellow\:0\:dark { color: hsl(60, 100%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:5\:dark, html.auto .sf-c-txt-yellow\:5\:dark { color: hsl(60, 100%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark, html.auto .sf-c-txt-yellow\:10\:dark { color: hsl(60, 100%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:15\:dark, html.auto .sf-c-txt-yellow\:15\:dark { color: hsl(60, 100%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark, html.auto .sf-c-txt-yellow\:20\:dark { color: hsl(60, 100%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:25\:dark, html.auto .sf-c-txt-yellow\:25\:dark { color: hsl(60, 100%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark, html.auto .sf-c-txt-yellow\:30\:dark { color: hsl(60, 100%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:35\:dark, html.auto .sf-c-txt-yellow\:35\:dark { color: hsl(60, 100%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark, html.auto .sf-c-txt-yellow\:40\:dark { color: hsl(60, 100%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:45\:dark, html.auto .sf-c-txt-yellow\:45\:dark { color: hsl(60, 100%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark, html.auto .sf-c-txt-yellow\:50\:dark { color: hsl(60, 100%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:55\:dark, html.auto .sf-c-txt-yellow\:55\:dark { color: hsl(60, 100%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark, html.auto .sf-c-txt-yellow\:60\:dark { color: hsl(60, 100%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:65\:dark, html.auto .sf-c-txt-yellow\:65\:dark { color: hsl(60, 100%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark, html.auto .sf-c-txt-yellow\:70\:dark { color: hsl(60, 100%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:75\:dark, html.auto .sf-c-txt-yellow\:75\:dark { color: hsl(60, 100%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark, html.auto .sf-c-txt-yellow\:80\:dark { color: hsl(60, 100%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:85\:dark, html.auto .sf-c-txt-yellow\:85\:dark { color: hsl(60, 100%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark, html.auto .sf-c-txt-yellow\:90\:dark { color: hsl(60, 100%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:95\:dark, html.auto .sf-c-txt-yellow\:95\:dark { color: hsl(60, 100%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark, html.auto .sf-c-txt-yellow\:100\:dark { color: hsl(60, 100%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:dark, html.var.auto .sf-c-txt-yellow\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark, html.var.auto .sf-c-txt-yellow\:0\:dark { color: hsl(60, 100%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:5\:dark, html.var.auto .sf-c-txt-yellow\:5\:dark { color: hsl(60, 100%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark, html.var.auto .sf-c-txt-yellow\:10\:dark { color: hsl(60, 100%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:15\:dark, html.var.auto .sf-c-txt-yellow\:15\:dark { color: hsl(60, 100%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark, html.var.auto .sf-c-txt-yellow\:20\:dark { color: hsl(60, 100%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:25\:dark, html.var.auto .sf-c-txt-yellow\:25\:dark { color: hsl(60, 100%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark, html.var.auto .sf-c-txt-yellow\:30\:dark { color: hsl(60, 100%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:35\:dark, html.var.auto .sf-c-txt-yellow\:35\:dark { color: hsl(60, 100%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark, html.var.auto .sf-c-txt-yellow\:40\:dark { color: hsl(60, 100%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:45\:dark, html.var.auto .sf-c-txt-yellow\:45\:dark { color: hsl(60, 100%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark, html.var.auto .sf-c-txt-yellow\:50\:dark { color: hsl(60, 100%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:55\:dark, html.var.auto .sf-c-txt-yellow\:55\:dark { color: hsl(60, 100%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark, html.var.auto .sf-c-txt-yellow\:60\:dark { color: hsl(60, 100%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:65\:dark, html.var.auto .sf-c-txt-yellow\:65\:dark { color: hsl(60, 100%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark, html.var.auto .sf-c-txt-yellow\:70\:dark { color: hsl(60, 100%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:75\:dark, html.var.auto .sf-c-txt-yellow\:75\:dark { color: hsl(60, 100%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark, html.var.auto .sf-c-txt-yellow\:80\:dark { color: hsl(60, 100%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:85\:dark, html.var.auto .sf-c-txt-yellow\:85\:dark { color: hsl(60, 100%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark, html.var.auto .sf-c-txt-yellow\:90\:dark { color: hsl(60, 100%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:95\:dark, html.var.auto .sf-c-txt-yellow\:95\:dark { color: hsl(60, 100%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark, html.var.auto .sf-c-txt-yellow\:100\:dark { color: hsl(60, 100%, 100%) } } \ No newline at end of file diff --git a/src/colors/20/yellowgreen.css b/src/colors/20/yellowgreen.css index db8b95b..cb4f817 100644 --- a/src/colors/20/yellowgreen.css +++ b/src/colors/20/yellowgreen.css @@ -1,4 +1,4 @@ -:root { +[class*='yellowgreen'] { --sf-c-yellowgreen: 80 61% 50%; --sf-c-yellowgreen-0: 80 61% 0%; --sf-c-yellowgreen-5: 80 61% 5%; @@ -507,49 +507,49 @@ html.var[data-theme='dark'] .sf-c-txt-yellowgreen\:100\:dark, html.dark .sf-c-tx html.var[data-theme='auto'] .sf-c-yellowgreen\:95\:dark, html.var.auto .sf-c-yellowgreen\:95\:dark { color: hsl(80, 61%, 95%); background: hsl(80, 61%, 5%) } html.var[data-theme='auto'] .sf-c-yellowgreen\:100\:dark, html.var.auto .sf-c-yellowgreen\:100\:dark { color: hsl(80, 61%, 95%); background: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen, html.auto .sf-c-txt-yellowgreen { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0, html.auto .sf-c-txt-yellowgreen\:0 { color: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:5, html.auto .sf-c-txt-yellowgreen\:5 { color: hsl(80, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10, html.auto .sf-c-txt-yellowgreen\:10 { color: hsl(80, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:15, html.auto .sf-c-txt-yellowgreen\:15 { color: hsl(80, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20, html.auto .sf-c-txt-yellowgreen\:20 { color: hsl(80, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:25, html.auto .sf-c-txt-yellowgreen\:25 { color: hsl(80, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30, html.auto .sf-c-txt-yellowgreen\:30 { color: hsl(80, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:35, html.auto .sf-c-txt-yellowgreen\:35 { color: hsl(80, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40, html.auto .sf-c-txt-yellowgreen\:40 { color: hsl(80, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:45, html.auto .sf-c-txt-yellowgreen\:45 { color: hsl(80, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50, html.auto .sf-c-txt-yellowgreen\:50 { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:55, html.auto .sf-c-txt-yellowgreen\:55 { color: hsl(80, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60, html.auto .sf-c-txt-yellowgreen\:60 { color: hsl(80, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:65, html.auto .sf-c-txt-yellowgreen\:65 { color: hsl(80, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70, html.auto .sf-c-txt-yellowgreen\:70 { color: hsl(80, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:75, html.auto .sf-c-txt-yellowgreen\:75 { color: hsl(80, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80, html.auto .sf-c-txt-yellowgreen\:80 { color: hsl(80, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:85, html.auto .sf-c-txt-yellowgreen\:85 { color: hsl(80, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90, html.auto .sf-c-txt-yellowgreen\:90 { color: hsl(80, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:95, html.auto .sf-c-txt-yellowgreen\:95 { color: hsl(80, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100, html.auto .sf-c-txt-yellowgreen\:100 { color: hsl(80, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen, html.var.auto .sf-c-txt-yellowgreen { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0, html.var.auto .sf-c-txt-yellowgreen\:0 { color: hsl(80, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:5, html.var.auto .sf-c-txt-yellowgreen\:5 { color: hsl(80, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10, html.var.auto .sf-c-txt-yellowgreen\:10 { color: hsl(80, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:15, html.var.auto .sf-c-txt-yellowgreen\:15 { color: hsl(80, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20, html.var.auto .sf-c-txt-yellowgreen\:20 { color: hsl(80, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:25, html.var.auto .sf-c-txt-yellowgreen\:25 { color: hsl(80, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30, html.var.auto .sf-c-txt-yellowgreen\:30 { color: hsl(80, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:35, html.var.auto .sf-c-txt-yellowgreen\:35 { color: hsl(80, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40, html.var.auto .sf-c-txt-yellowgreen\:40 { color: hsl(80, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:45, html.var.auto .sf-c-txt-yellowgreen\:45 { color: hsl(80, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50, html.var.auto .sf-c-txt-yellowgreen\:50 { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:55, html.var.auto .sf-c-txt-yellowgreen\:55 { color: hsl(80, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60, html.var.auto .sf-c-txt-yellowgreen\:60 { color: hsl(80, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:65, html.var.auto .sf-c-txt-yellowgreen\:65 { color: hsl(80, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70, html.var.auto .sf-c-txt-yellowgreen\:70 { color: hsl(80, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:75, html.var.auto .sf-c-txt-yellowgreen\:75 { color: hsl(80, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80, html.var.auto .sf-c-txt-yellowgreen\:80 { color: hsl(80, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:85, html.var.auto .sf-c-txt-yellowgreen\:85 { color: hsl(80, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90, html.var.auto .sf-c-txt-yellowgreen\:90 { color: hsl(80, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:95, html.var.auto .sf-c-txt-yellowgreen\:95 { color: hsl(80, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100, html.var.auto .sf-c-txt-yellowgreen\:100 { color: hsl(80, 61%, 100%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:dark, html.auto .sf-c-txt-yellowgreen\:dark { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0\:dark, html.auto .sf-c-txt-yellowgreen\:0\:dark { color: hsl(80, 61%, 0%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:5\:dark, html.auto .sf-c-txt-yellowgreen\:5\:dark { color: hsl(80, 61%, 5%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10\:dark, html.auto .sf-c-txt-yellowgreen\:10\:dark { color: hsl(80, 61%, 10%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:15\:dark, html.auto .sf-c-txt-yellowgreen\:15\:dark { color: hsl(80, 61%, 15%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20\:dark, html.auto .sf-c-txt-yellowgreen\:20\:dark { color: hsl(80, 61%, 20%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:25\:dark, html.auto .sf-c-txt-yellowgreen\:25\:dark { color: hsl(80, 61%, 25%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30\:dark, html.auto .sf-c-txt-yellowgreen\:30\:dark { color: hsl(80, 61%, 30%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:35\:dark, html.auto .sf-c-txt-yellowgreen\:35\:dark { color: hsl(80, 61%, 35%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40\:dark, html.auto .sf-c-txt-yellowgreen\:40\:dark { color: hsl(80, 61%, 40%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:45\:dark, html.auto .sf-c-txt-yellowgreen\:45\:dark { color: hsl(80, 61%, 45%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50\:dark, html.auto .sf-c-txt-yellowgreen\:50\:dark { color: hsl(80, 61%, 50%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:55\:dark, html.auto .sf-c-txt-yellowgreen\:55\:dark { color: hsl(80, 61%, 55%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60\:dark, html.auto .sf-c-txt-yellowgreen\:60\:dark { color: hsl(80, 61%, 60%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:65\:dark, html.auto .sf-c-txt-yellowgreen\:65\:dark { color: hsl(80, 61%, 65%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70\:dark, html.auto .sf-c-txt-yellowgreen\:70\:dark { color: hsl(80, 61%, 70%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:75\:dark, html.auto .sf-c-txt-yellowgreen\:75\:dark { color: hsl(80, 61%, 75%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80\:dark, html.auto .sf-c-txt-yellowgreen\:80\:dark { color: hsl(80, 61%, 80%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:85\:dark, html.auto .sf-c-txt-yellowgreen\:85\:dark { color: hsl(80, 61%, 85%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90\:dark, html.auto .sf-c-txt-yellowgreen\:90\:dark { color: hsl(80, 61%, 90%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:95\:dark, html.auto .sf-c-txt-yellowgreen\:95\:dark { color: hsl(80, 61%, 95%) } - html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100\:dark, html.auto .sf-c-txt-yellowgreen\:100\:dark { color: hsl(80, 61%, 100%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:dark, html.var.auto .sf-c-txt-yellowgreen\:dark { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:0\:dark, html.var.auto .sf-c-txt-yellowgreen\:0\:dark { color: hsl(80, 61%, 0%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:5\:dark, html.var.auto .sf-c-txt-yellowgreen\:5\:dark { color: hsl(80, 61%, 5%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:10\:dark, html.var.auto .sf-c-txt-yellowgreen\:10\:dark { color: hsl(80, 61%, 10%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:15\:dark, html.var.auto .sf-c-txt-yellowgreen\:15\:dark { color: hsl(80, 61%, 15%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:20\:dark, html.var.auto .sf-c-txt-yellowgreen\:20\:dark { color: hsl(80, 61%, 20%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:25\:dark, html.var.auto .sf-c-txt-yellowgreen\:25\:dark { color: hsl(80, 61%, 25%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:30\:dark, html.var.auto .sf-c-txt-yellowgreen\:30\:dark { color: hsl(80, 61%, 30%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:35\:dark, html.var.auto .sf-c-txt-yellowgreen\:35\:dark { color: hsl(80, 61%, 35%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:40\:dark, html.var.auto .sf-c-txt-yellowgreen\:40\:dark { color: hsl(80, 61%, 40%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:45\:dark, html.var.auto .sf-c-txt-yellowgreen\:45\:dark { color: hsl(80, 61%, 45%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:50\:dark, html.var.auto .sf-c-txt-yellowgreen\:50\:dark { color: hsl(80, 61%, 50%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:55\:dark, html.var.auto .sf-c-txt-yellowgreen\:55\:dark { color: hsl(80, 61%, 55%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:60\:dark, html.var.auto .sf-c-txt-yellowgreen\:60\:dark { color: hsl(80, 61%, 60%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:65\:dark, html.var.auto .sf-c-txt-yellowgreen\:65\:dark { color: hsl(80, 61%, 65%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:70\:dark, html.var.auto .sf-c-txt-yellowgreen\:70\:dark { color: hsl(80, 61%, 70%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:75\:dark, html.var.auto .sf-c-txt-yellowgreen\:75\:dark { color: hsl(80, 61%, 75%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:80\:dark, html.var.auto .sf-c-txt-yellowgreen\:80\:dark { color: hsl(80, 61%, 80%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:85\:dark, html.var.auto .sf-c-txt-yellowgreen\:85\:dark { color: hsl(80, 61%, 85%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:90\:dark, html.var.auto .sf-c-txt-yellowgreen\:90\:dark { color: hsl(80, 61%, 90%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:95\:dark, html.var.auto .sf-c-txt-yellowgreen\:95\:dark { color: hsl(80, 61%, 95%) } + html.var[data-theme='auto'] .sf-c-txt-yellowgreen\:100\:dark, html.var.auto .sf-c-txt-yellowgreen\:100\:dark { color: hsl(80, 61%, 100%) } } \ No newline at end of file diff --git a/web.css b/web.css index 62241d9..365356d 100644 --- a/web.css +++ b/web.css @@ -1,3 +1,3 @@ -/*! style-forge.colors 2025.1.18 | MIT License | https://github.com/Style-Forge/colors */ +/*! style-forge.colors 2025.1.22 | MIT License | https://github.com/Style-Forge/colors */ -:root{--sf-c-aqua:180 100% 50%;--sf-c-aqua-0:180 100% 0%;--sf-c-aqua-10:180 100% 10%;--sf-c-aqua-20:180 100% 20%;--sf-c-aqua-30:180 100% 30%;--sf-c-aqua-40:180 100% 40%;--sf-c-aqua-50:180 100% 50%;--sf-c-aqua-60:180 100% 60%;--sf-c-aqua-70:180 100% 70%;--sf-c-aqua-80:180 100% 80%;--sf-c-aqua-90:180 100% 90%;--sf-c-aqua-100:180 100% 100%;--sf-c-txt-aqua:var(--sf-c-aqua);--sf-c-txt-aqua-0:var(--sf-c-aqua-0);--sf-c-txt-aqua-10:var(--sf-c-aqua-10);--sf-c-txt-aqua-20:var(--sf-c-aqua-20);--sf-c-txt-aqua-30:var(--sf-c-aqua-30);--sf-c-txt-aqua-40:var(--sf-c-aqua-40);--sf-c-txt-aqua-50:var(--sf-c-aqua-50);--sf-c-txt-aqua-60:var(--sf-c-aqua-60);--sf-c-txt-aqua-70:var(--sf-c-aqua-70);--sf-c-txt-aqua-80:var(--sf-c-aqua-80);--sf-c-txt-aqua-90:var(--sf-c-aqua-90);--sf-c-txt-aqua-100:var(--sf-c-aqua-100);--sf-dark-c-aqua:180 100% 50%;--sf-dark-c-aqua-0:180 100% 0%;--sf-dark-c-aqua-10:180 100% 10%;--sf-dark-c-aqua-20:180 100% 20%;--sf-dark-c-aqua-30:180 100% 30%;--sf-dark-c-aqua-40:180 100% 40%;--sf-dark-c-aqua-50:180 100% 50%;--sf-dark-c-aqua-60:180 100% 60%;--sf-dark-c-aqua-70:180 100% 70%;--sf-dark-c-aqua-80:180 100% 80%;--sf-dark-c-aqua-90:180 100% 90%;--sf-dark-c-aqua-100:180 100% 100%;--sf-dark-c-txt-aqua:var(--sf-dark-c-aqua);--sf-dark-c-txt-aqua-0:var(--sf-dark-c-aqua-0);--sf-dark-c-txt-aqua-10:var(--sf-dark-c-aqua-10);--sf-dark-c-txt-aqua-20:var(--sf-dark-c-aqua-20);--sf-dark-c-txt-aqua-30:var(--sf-dark-c-aqua-30);--sf-dark-c-txt-aqua-40:var(--sf-dark-c-aqua-40);--sf-dark-c-txt-aqua-50:var(--sf-dark-c-aqua-50);--sf-dark-c-txt-aqua-60:var(--sf-dark-c-aqua-60);--sf-dark-c-txt-aqua-70:var(--sf-dark-c-aqua-70);--sf-dark-c-txt-aqua-80:var(--sf-dark-c-aqua-80);--sf-dark-c-txt-aqua-90:var(--sf-dark-c-aqua-90);--sf-dark-c-txt-aqua-100:var(--sf-dark-c-aqua-100);--sf-c-black:0 0% 0%;--sf-c-black-0:0 0% 0%;--sf-c-black-10:0 0% 10%;--sf-c-black-20:0 0% 20%;--sf-c-black-30:0 0% 30%;--sf-c-black-40:0 0% 40%;--sf-c-black-50:0 0% 50%;--sf-c-black-60:0 0% 60%;--sf-c-black-70:0 0% 70%;--sf-c-black-80:0 0% 80%;--sf-c-black-90:0 0% 90%;--sf-c-black-100:0 0% 100%;--sf-c-txt-black:var(--sf-c-black);--sf-c-txt-black-0:var(--sf-c-black-0);--sf-c-txt-black-10:var(--sf-c-black-10);--sf-c-txt-black-20:var(--sf-c-black-20);--sf-c-txt-black-30:var(--sf-c-black-30);--sf-c-txt-black-40:var(--sf-c-black-40);--sf-c-txt-black-50:var(--sf-c-black-50);--sf-c-txt-black-60:var(--sf-c-black-60);--sf-c-txt-black-70:var(--sf-c-black-70);--sf-c-txt-black-80:var(--sf-c-black-80);--sf-c-txt-black-90:var(--sf-c-black-90);--sf-c-txt-black-100:var(--sf-c-black-100);--sf-dark-c-black:0 0% 100%;--sf-dark-c-black-0:0 0% 0%;--sf-dark-c-black-10:0 0% 10%;--sf-dark-c-black-20:0 0% 20%;--sf-dark-c-black-30:0 0% 30%;--sf-dark-c-black-40:0 0% 40%;--sf-dark-c-black-50:0 0% 50%;--sf-dark-c-black-60:0 0% 60%;--sf-dark-c-black-70:0 0% 70%;--sf-dark-c-black-80:0 0% 80%;--sf-dark-c-black-90:0 0% 90%;--sf-dark-c-black-100:0 0% 100%;--sf-dark-c-txt-black:var(--sf-dark-c-black);--sf-dark-c-txt-black-0:var(--sf-dark-c-black-0);--sf-dark-c-txt-black-10:var(--sf-dark-c-black-10);--sf-dark-c-txt-black-20:var(--sf-dark-c-black-20);--sf-dark-c-txt-black-30:var(--sf-dark-c-black-30);--sf-dark-c-txt-black-40:var(--sf-dark-c-black-40);--sf-dark-c-txt-black-50:var(--sf-dark-c-black-50);--sf-dark-c-txt-black-60:var(--sf-dark-c-black-60);--sf-dark-c-txt-black-70:var(--sf-dark-c-black-70);--sf-dark-c-txt-black-80:var(--sf-dark-c-black-80);--sf-dark-c-txt-black-90:var(--sf-dark-c-black-90);--sf-dark-c-txt-black-100:var(--sf-dark-c-black-100);--sf-c-blue:240 100% 50%;--sf-c-blue-0:240 100% 0%;--sf-c-blue-10:240 100% 10%;--sf-c-blue-20:240 100% 20%;--sf-c-blue-30:240 100% 30%;--sf-c-blue-40:240 100% 40%;--sf-c-blue-50:240 100% 50%;--sf-c-blue-60:240 100% 60%;--sf-c-blue-70:240 100% 70%;--sf-c-blue-80:240 100% 80%;--sf-c-blue-90:240 100% 90%;--sf-c-blue-100:240 100% 100%;--sf-c-txt-blue:var(--sf-c-blue);--sf-c-txt-blue-0:var(--sf-c-blue-0);--sf-c-txt-blue-10:var(--sf-c-blue-10);--sf-c-txt-blue-20:var(--sf-c-blue-20);--sf-c-txt-blue-30:var(--sf-c-blue-30);--sf-c-txt-blue-40:var(--sf-c-blue-40);--sf-c-txt-blue-50:var(--sf-c-blue-50);--sf-c-txt-blue-60:var(--sf-c-blue-60);--sf-c-txt-blue-70:var(--sf-c-blue-70);--sf-c-txt-blue-80:var(--sf-c-blue-80);--sf-c-txt-blue-90:var(--sf-c-blue-90);--sf-c-txt-blue-100:var(--sf-c-blue-100);--sf-dark-c-blue:240 100% 50%;--sf-dark-c-blue-0:240 100% 0%;--sf-dark-c-blue-10:240 100% 10%;--sf-dark-c-blue-20:240 100% 20%;--sf-dark-c-blue-30:240 100% 30%;--sf-dark-c-blue-40:240 100% 40%;--sf-dark-c-blue-50:240 100% 50%;--sf-dark-c-blue-60:240 100% 60%;--sf-dark-c-blue-70:240 100% 70%;--sf-dark-c-blue-80:240 100% 80%;--sf-dark-c-blue-90:240 100% 90%;--sf-dark-c-blue-100:240 100% 100%;--sf-dark-c-txt-blue:var(--sf-dark-c-blue);--sf-dark-c-txt-blue-0:var(--sf-dark-c-blue-0);--sf-dark-c-txt-blue-10:var(--sf-dark-c-blue-10);--sf-dark-c-txt-blue-20:var(--sf-dark-c-blue-20);--sf-dark-c-txt-blue-30:var(--sf-dark-c-blue-30);--sf-dark-c-txt-blue-40:var(--sf-dark-c-blue-40);--sf-dark-c-txt-blue-50:var(--sf-dark-c-blue-50);--sf-dark-c-txt-blue-60:var(--sf-dark-c-blue-60);--sf-dark-c-txt-blue-70:var(--sf-dark-c-blue-70);--sf-dark-c-txt-blue-80:var(--sf-dark-c-blue-80);--sf-dark-c-txt-blue-90:var(--sf-dark-c-blue-90);--sf-dark-c-txt-blue-100:var(--sf-dark-c-blue-100);--sf-c-fuchsia:300 100% 50%;--sf-c-fuchsia-0:300 100% 0%;--sf-c-fuchsia-10:300 100% 10%;--sf-c-fuchsia-20:300 100% 20%;--sf-c-fuchsia-30:300 100% 30%;--sf-c-fuchsia-40:300 100% 40%;--sf-c-fuchsia-50:300 100% 50%;--sf-c-fuchsia-60:300 100% 60%;--sf-c-fuchsia-70:300 100% 70%;--sf-c-fuchsia-80:300 100% 80%;--sf-c-fuchsia-90:300 100% 90%;--sf-c-fuchsia-100:300 100% 100%;--sf-c-txt-fuchsia:var(--sf-c-fuchsia);--sf-c-txt-fuchsia-0:var(--sf-c-fuchsia-0);--sf-c-txt-fuchsia-10:var(--sf-c-fuchsia-10);--sf-c-txt-fuchsia-20:var(--sf-c-fuchsia-20);--sf-c-txt-fuchsia-30:var(--sf-c-fuchsia-30);--sf-c-txt-fuchsia-40:var(--sf-c-fuchsia-40);--sf-c-txt-fuchsia-50:var(--sf-c-fuchsia-50);--sf-c-txt-fuchsia-60:var(--sf-c-fuchsia-60);--sf-c-txt-fuchsia-70:var(--sf-c-fuchsia-70);--sf-c-txt-fuchsia-80:var(--sf-c-fuchsia-80);--sf-c-txt-fuchsia-90:var(--sf-c-fuchsia-90);--sf-c-txt-fuchsia-100:var(--sf-c-fuchsia-100);--sf-dark-c-fuchsia:300 100% 50%;--sf-dark-c-fuchsia-0:300 100% 0%;--sf-dark-c-fuchsia-10:300 100% 10%;--sf-dark-c-fuchsia-20:300 100% 20%;--sf-dark-c-fuchsia-30:300 100% 30%;--sf-dark-c-fuchsia-40:300 100% 40%;--sf-dark-c-fuchsia-50:300 100% 50%;--sf-dark-c-fuchsia-60:300 100% 60%;--sf-dark-c-fuchsia-70:300 100% 70%;--sf-dark-c-fuchsia-80:300 100% 80%;--sf-dark-c-fuchsia-90:300 100% 90%;--sf-dark-c-fuchsia-100:300 100% 100%;--sf-dark-c-txt-fuchsia:var(--sf-dark-c-fuchsia);--sf-dark-c-txt-fuchsia-0:var(--sf-dark-c-fuchsia-0);--sf-dark-c-txt-fuchsia-10:var(--sf-dark-c-fuchsia-10);--sf-dark-c-txt-fuchsia-20:var(--sf-dark-c-fuchsia-20);--sf-dark-c-txt-fuchsia-30:var(--sf-dark-c-fuchsia-30);--sf-dark-c-txt-fuchsia-40:var(--sf-dark-c-fuchsia-40);--sf-dark-c-txt-fuchsia-50:var(--sf-dark-c-fuchsia-50);--sf-dark-c-txt-fuchsia-60:var(--sf-dark-c-fuchsia-60);--sf-dark-c-txt-fuchsia-70:var(--sf-dark-c-fuchsia-70);--sf-dark-c-txt-fuchsia-80:var(--sf-dark-c-fuchsia-80);--sf-dark-c-txt-fuchsia-90:var(--sf-dark-c-fuchsia-90);--sf-dark-c-txt-fuchsia-100:var(--sf-dark-c-fuchsia-100);--sf-c-gray:0 0% 50%;--sf-c-gray-0:0 0% 0%;--sf-c-gray-10:0 0% 10%;--sf-c-gray-20:0 0% 20%;--sf-c-gray-30:0 0% 30%;--sf-c-gray-40:0 0% 40%;--sf-c-gray-50:0 0% 50%;--sf-c-gray-60:0 0% 60%;--sf-c-gray-70:0 0% 70%;--sf-c-gray-80:0 0% 80%;--sf-c-gray-90:0 0% 90%;--sf-c-gray-100:0 0% 100%;--sf-c-txt-gray:var(--sf-c-gray);--sf-c-txt-gray-0:var(--sf-c-gray-0);--sf-c-txt-gray-10:var(--sf-c-gray-10);--sf-c-txt-gray-20:var(--sf-c-gray-20);--sf-c-txt-gray-30:var(--sf-c-gray-30);--sf-c-txt-gray-40:var(--sf-c-gray-40);--sf-c-txt-gray-50:var(--sf-c-gray-50);--sf-c-txt-gray-60:var(--sf-c-gray-60);--sf-c-txt-gray-70:var(--sf-c-gray-70);--sf-c-txt-gray-80:var(--sf-c-gray-80);--sf-c-txt-gray-90:var(--sf-c-gray-90);--sf-c-txt-gray-100:var(--sf-c-gray-100);--sf-dark-c-gray:0 0% 50%;--sf-dark-c-gray-0:0 0% 0%;--sf-dark-c-gray-10:0 0% 10%;--sf-dark-c-gray-20:0 0% 20%;--sf-dark-c-gray-30:0 0% 30%;--sf-dark-c-gray-40:0 0% 40%;--sf-dark-c-gray-50:0 0% 50%;--sf-dark-c-gray-60:0 0% 60%;--sf-dark-c-gray-70:0 0% 70%;--sf-dark-c-gray-80:0 0% 80%;--sf-dark-c-gray-90:0 0% 90%;--sf-dark-c-gray-100:0 0% 100%;--sf-dark-c-txt-gray:var(--sf-dark-c-gray);--sf-dark-c-txt-gray-0:var(--sf-dark-c-gray-0);--sf-dark-c-txt-gray-10:var(--sf-dark-c-gray-10);--sf-dark-c-txt-gray-20:var(--sf-dark-c-gray-20);--sf-dark-c-txt-gray-30:var(--sf-dark-c-gray-30);--sf-dark-c-txt-gray-40:var(--sf-dark-c-gray-40);--sf-dark-c-txt-gray-50:var(--sf-dark-c-gray-50);--sf-dark-c-txt-gray-60:var(--sf-dark-c-gray-60);--sf-dark-c-txt-gray-70:var(--sf-dark-c-gray-70);--sf-dark-c-txt-gray-80:var(--sf-dark-c-gray-80);--sf-dark-c-txt-gray-90:var(--sf-dark-c-gray-90);--sf-dark-c-txt-gray-100:var(--sf-dark-c-gray-100);--sf-c-green:120 100% 25%;--sf-c-green-0:120 100% 0%;--sf-c-green-10:120 100% 10%;--sf-c-green-20:120 100% 20%;--sf-c-green-30:120 100% 30%;--sf-c-green-40:120 100% 40%;--sf-c-green-50:120 100% 50%;--sf-c-green-60:120 100% 60%;--sf-c-green-70:120 100% 70%;--sf-c-green-80:120 100% 80%;--sf-c-green-90:120 100% 90%;--sf-c-green-100:120 100% 100%;--sf-c-txt-green:var(--sf-c-green);--sf-c-txt-green-0:var(--sf-c-green-0);--sf-c-txt-green-10:var(--sf-c-green-10);--sf-c-txt-green-20:var(--sf-c-green-20);--sf-c-txt-green-30:var(--sf-c-green-30);--sf-c-txt-green-40:var(--sf-c-green-40);--sf-c-txt-green-50:var(--sf-c-green-50);--sf-c-txt-green-60:var(--sf-c-green-60);--sf-c-txt-green-70:var(--sf-c-green-70);--sf-c-txt-green-80:var(--sf-c-green-80);--sf-c-txt-green-90:var(--sf-c-green-90);--sf-c-txt-green-100:var(--sf-c-green-100);--sf-dark-c-green:120 100% 75%;--sf-dark-c-green-0:120 100% 0%;--sf-dark-c-green-10:120 100% 10%;--sf-dark-c-green-20:120 100% 20%;--sf-dark-c-green-30:120 100% 30%;--sf-dark-c-green-40:120 100% 40%;--sf-dark-c-green-50:120 100% 50%;--sf-dark-c-green-60:120 100% 60%;--sf-dark-c-green-70:120 100% 70%;--sf-dark-c-green-80:120 100% 80%;--sf-dark-c-green-90:120 100% 90%;--sf-dark-c-green-100:120 100% 100%;--sf-dark-c-txt-green:var(--sf-dark-c-green);--sf-dark-c-txt-green-0:var(--sf-dark-c-green-0);--sf-dark-c-txt-green-10:var(--sf-dark-c-green-10);--sf-dark-c-txt-green-20:var(--sf-dark-c-green-20);--sf-dark-c-txt-green-30:var(--sf-dark-c-green-30);--sf-dark-c-txt-green-40:var(--sf-dark-c-green-40);--sf-dark-c-txt-green-50:var(--sf-dark-c-green-50);--sf-dark-c-txt-green-60:var(--sf-dark-c-green-60);--sf-dark-c-txt-green-70:var(--sf-dark-c-green-70);--sf-dark-c-txt-green-80:var(--sf-dark-c-green-80);--sf-dark-c-txt-green-90:var(--sf-dark-c-green-90);--sf-dark-c-txt-green-100:var(--sf-dark-c-green-100);--sf-c-lime:120 100% 50%;--sf-c-lime-0:120 100% 0%;--sf-c-lime-10:120 100% 10%;--sf-c-lime-20:120 100% 20%;--sf-c-lime-30:120 100% 30%;--sf-c-lime-40:120 100% 40%;--sf-c-lime-50:120 100% 50%;--sf-c-lime-60:120 100% 60%;--sf-c-lime-70:120 100% 70%;--sf-c-lime-80:120 100% 80%;--sf-c-lime-90:120 100% 90%;--sf-c-lime-100:120 100% 100%;--sf-c-txt-lime:var(--sf-c-lime);--sf-c-txt-lime-0:var(--sf-c-lime-0);--sf-c-txt-lime-10:var(--sf-c-lime-10);--sf-c-txt-lime-20:var(--sf-c-lime-20);--sf-c-txt-lime-30:var(--sf-c-lime-30);--sf-c-txt-lime-40:var(--sf-c-lime-40);--sf-c-txt-lime-50:var(--sf-c-lime-50);--sf-c-txt-lime-60:var(--sf-c-lime-60);--sf-c-txt-lime-70:var(--sf-c-lime-70);--sf-c-txt-lime-80:var(--sf-c-lime-80);--sf-c-txt-lime-90:var(--sf-c-lime-90);--sf-c-txt-lime-100:var(--sf-c-lime-100);--sf-dark-c-lime:120 100% 50%;--sf-dark-c-lime-0:120 100% 0%;--sf-dark-c-lime-10:120 100% 10%;--sf-dark-c-lime-20:120 100% 20%;--sf-dark-c-lime-30:120 100% 30%;--sf-dark-c-lime-40:120 100% 40%;--sf-dark-c-lime-50:120 100% 50%;--sf-dark-c-lime-60:120 100% 60%;--sf-dark-c-lime-70:120 100% 70%;--sf-dark-c-lime-80:120 100% 80%;--sf-dark-c-lime-90:120 100% 90%;--sf-dark-c-lime-100:120 100% 100%;--sf-dark-c-txt-lime:var(--sf-dark-c-lime);--sf-dark-c-txt-lime-0:var(--sf-dark-c-lime-0);--sf-dark-c-txt-lime-10:var(--sf-dark-c-lime-10);--sf-dark-c-txt-lime-20:var(--sf-dark-c-lime-20);--sf-dark-c-txt-lime-30:var(--sf-dark-c-lime-30);--sf-dark-c-txt-lime-40:var(--sf-dark-c-lime-40);--sf-dark-c-txt-lime-50:var(--sf-dark-c-lime-50);--sf-dark-c-txt-lime-60:var(--sf-dark-c-lime-60);--sf-dark-c-txt-lime-70:var(--sf-dark-c-lime-70);--sf-dark-c-txt-lime-80:var(--sf-dark-c-lime-80);--sf-dark-c-txt-lime-90:var(--sf-dark-c-lime-90);--sf-dark-c-txt-lime-100:var(--sf-dark-c-lime-100);--sf-c-maroon:0 100% 25%;--sf-c-maroon-0:0 100% 0%;--sf-c-maroon-10:0 100% 10%;--sf-c-maroon-20:0 100% 20%;--sf-c-maroon-30:0 100% 30%;--sf-c-maroon-40:0 100% 40%;--sf-c-maroon-50:0 100% 50%;--sf-c-maroon-60:0 100% 60%;--sf-c-maroon-70:0 100% 70%;--sf-c-maroon-80:0 100% 80%;--sf-c-maroon-90:0 100% 90%;--sf-c-maroon-100:0 100% 100%;--sf-c-txt-maroon:var(--sf-c-maroon);--sf-c-txt-maroon-0:var(--sf-c-maroon-0);--sf-c-txt-maroon-10:var(--sf-c-maroon-10);--sf-c-txt-maroon-20:var(--sf-c-maroon-20);--sf-c-txt-maroon-30:var(--sf-c-maroon-30);--sf-c-txt-maroon-40:var(--sf-c-maroon-40);--sf-c-txt-maroon-50:var(--sf-c-maroon-50);--sf-c-txt-maroon-60:var(--sf-c-maroon-60);--sf-c-txt-maroon-70:var(--sf-c-maroon-70);--sf-c-txt-maroon-80:var(--sf-c-maroon-80);--sf-c-txt-maroon-90:var(--sf-c-maroon-90);--sf-c-txt-maroon-100:var(--sf-c-maroon-100);--sf-dark-c-maroon:0 100% 75%;--sf-dark-c-maroon-0:0 100% 0%;--sf-dark-c-maroon-10:0 100% 10%;--sf-dark-c-maroon-20:0 100% 20%;--sf-dark-c-maroon-30:0 100% 30%;--sf-dark-c-maroon-40:0 100% 40%;--sf-dark-c-maroon-50:0 100% 50%;--sf-dark-c-maroon-60:0 100% 60%;--sf-dark-c-maroon-70:0 100% 70%;--sf-dark-c-maroon-80:0 100% 80%;--sf-dark-c-maroon-90:0 100% 90%;--sf-dark-c-maroon-100:0 100% 100%;--sf-dark-c-txt-maroon:var(--sf-dark-c-maroon);--sf-dark-c-txt-maroon-0:var(--sf-dark-c-maroon-0);--sf-dark-c-txt-maroon-10:var(--sf-dark-c-maroon-10);--sf-dark-c-txt-maroon-20:var(--sf-dark-c-maroon-20);--sf-dark-c-txt-maroon-30:var(--sf-dark-c-maroon-30);--sf-dark-c-txt-maroon-40:var(--sf-dark-c-maroon-40);--sf-dark-c-txt-maroon-50:var(--sf-dark-c-maroon-50);--sf-dark-c-txt-maroon-60:var(--sf-dark-c-maroon-60);--sf-dark-c-txt-maroon-70:var(--sf-dark-c-maroon-70);--sf-dark-c-txt-maroon-80:var(--sf-dark-c-maroon-80);--sf-dark-c-txt-maroon-90:var(--sf-dark-c-maroon-90);--sf-dark-c-txt-maroon-100:var(--sf-dark-c-maroon-100);--sf-c-navy:240 100% 25%;--sf-c-navy-0:240 100% 0%;--sf-c-navy-10:240 100% 10%;--sf-c-navy-20:240 100% 20%;--sf-c-navy-30:240 100% 30%;--sf-c-navy-40:240 100% 40%;--sf-c-navy-50:240 100% 50%;--sf-c-navy-60:240 100% 60%;--sf-c-navy-70:240 100% 70%;--sf-c-navy-80:240 100% 80%;--sf-c-navy-90:240 100% 90%;--sf-c-navy-100:240 100% 100%;--sf-c-txt-navy:var(--sf-c-navy);--sf-c-txt-navy-0:var(--sf-c-navy-0);--sf-c-txt-navy-10:var(--sf-c-navy-10);--sf-c-txt-navy-20:var(--sf-c-navy-20);--sf-c-txt-navy-30:var(--sf-c-navy-30);--sf-c-txt-navy-40:var(--sf-c-navy-40);--sf-c-txt-navy-50:var(--sf-c-navy-50);--sf-c-txt-navy-60:var(--sf-c-navy-60);--sf-c-txt-navy-70:var(--sf-c-navy-70);--sf-c-txt-navy-80:var(--sf-c-navy-80);--sf-c-txt-navy-90:var(--sf-c-navy-90);--sf-c-txt-navy-100:var(--sf-c-navy-100);--sf-dark-c-navy:240 100% 75%;--sf-dark-c-navy-0:240 100% 0%;--sf-dark-c-navy-10:240 100% 10%;--sf-dark-c-navy-20:240 100% 20%;--sf-dark-c-navy-30:240 100% 30%;--sf-dark-c-navy-40:240 100% 40%;--sf-dark-c-navy-50:240 100% 50%;--sf-dark-c-navy-60:240 100% 60%;--sf-dark-c-navy-70:240 100% 70%;--sf-dark-c-navy-80:240 100% 80%;--sf-dark-c-navy-90:240 100% 90%;--sf-dark-c-navy-100:240 100% 100%;--sf-dark-c-txt-navy:var(--sf-dark-c-navy);--sf-dark-c-txt-navy-0:var(--sf-dark-c-navy-0);--sf-dark-c-txt-navy-10:var(--sf-dark-c-navy-10);--sf-dark-c-txt-navy-20:var(--sf-dark-c-navy-20);--sf-dark-c-txt-navy-30:var(--sf-dark-c-navy-30);--sf-dark-c-txt-navy-40:var(--sf-dark-c-navy-40);--sf-dark-c-txt-navy-50:var(--sf-dark-c-navy-50);--sf-dark-c-txt-navy-60:var(--sf-dark-c-navy-60);--sf-dark-c-txt-navy-70:var(--sf-dark-c-navy-70);--sf-dark-c-txt-navy-80:var(--sf-dark-c-navy-80);--sf-dark-c-txt-navy-90:var(--sf-dark-c-navy-90);--sf-dark-c-txt-navy-100:var(--sf-dark-c-navy-100);--sf-c-olive:60 100% 25%;--sf-c-olive-0:60 100% 0%;--sf-c-olive-10:60 100% 10%;--sf-c-olive-20:60 100% 20%;--sf-c-olive-30:60 100% 30%;--sf-c-olive-40:60 100% 40%;--sf-c-olive-50:60 100% 50%;--sf-c-olive-60:60 100% 60%;--sf-c-olive-70:60 100% 70%;--sf-c-olive-80:60 100% 80%;--sf-c-olive-90:60 100% 90%;--sf-c-olive-100:60 100% 100%;--sf-c-txt-olive:var(--sf-c-olive);--sf-c-txt-olive-0:var(--sf-c-olive-0);--sf-c-txt-olive-10:var(--sf-c-olive-10);--sf-c-txt-olive-20:var(--sf-c-olive-20);--sf-c-txt-olive-30:var(--sf-c-olive-30);--sf-c-txt-olive-40:var(--sf-c-olive-40);--sf-c-txt-olive-50:var(--sf-c-olive-50);--sf-c-txt-olive-60:var(--sf-c-olive-60);--sf-c-txt-olive-70:var(--sf-c-olive-70);--sf-c-txt-olive-80:var(--sf-c-olive-80);--sf-c-txt-olive-90:var(--sf-c-olive-90);--sf-c-txt-olive-100:var(--sf-c-olive-100);--sf-dark-c-olive:60 100% 75%;--sf-dark-c-olive-0:60 100% 0%;--sf-dark-c-olive-10:60 100% 10%;--sf-dark-c-olive-20:60 100% 20%;--sf-dark-c-olive-30:60 100% 30%;--sf-dark-c-olive-40:60 100% 40%;--sf-dark-c-olive-50:60 100% 50%;--sf-dark-c-olive-60:60 100% 60%;--sf-dark-c-olive-70:60 100% 70%;--sf-dark-c-olive-80:60 100% 80%;--sf-dark-c-olive-90:60 100% 90%;--sf-dark-c-olive-100:60 100% 100%;--sf-dark-c-txt-olive:var(--sf-dark-c-olive);--sf-dark-c-txt-olive-0:var(--sf-dark-c-olive-0);--sf-dark-c-txt-olive-10:var(--sf-dark-c-olive-10);--sf-dark-c-txt-olive-20:var(--sf-dark-c-olive-20);--sf-dark-c-txt-olive-30:var(--sf-dark-c-olive-30);--sf-dark-c-txt-olive-40:var(--sf-dark-c-olive-40);--sf-dark-c-txt-olive-50:var(--sf-dark-c-olive-50);--sf-dark-c-txt-olive-60:var(--sf-dark-c-olive-60);--sf-dark-c-txt-olive-70:var(--sf-dark-c-olive-70);--sf-dark-c-txt-olive-80:var(--sf-dark-c-olive-80);--sf-dark-c-txt-olive-90:var(--sf-dark-c-olive-90);--sf-dark-c-txt-olive-100:var(--sf-dark-c-olive-100);--sf-c-purple:300 100% 25%;--sf-c-purple-0:300 100% 0%;--sf-c-purple-10:300 100% 10%;--sf-c-purple-20:300 100% 20%;--sf-c-purple-30:300 100% 30%;--sf-c-purple-40:300 100% 40%;--sf-c-purple-50:300 100% 50%;--sf-c-purple-60:300 100% 60%;--sf-c-purple-70:300 100% 70%;--sf-c-purple-80:300 100% 80%;--sf-c-purple-90:300 100% 90%;--sf-c-purple-100:300 100% 100%;--sf-c-txt-purple:var(--sf-c-purple);--sf-c-txt-purple-0:var(--sf-c-purple-0);--sf-c-txt-purple-10:var(--sf-c-purple-10);--sf-c-txt-purple-20:var(--sf-c-purple-20);--sf-c-txt-purple-30:var(--sf-c-purple-30);--sf-c-txt-purple-40:var(--sf-c-purple-40);--sf-c-txt-purple-50:var(--sf-c-purple-50);--sf-c-txt-purple-60:var(--sf-c-purple-60);--sf-c-txt-purple-70:var(--sf-c-purple-70);--sf-c-txt-purple-80:var(--sf-c-purple-80);--sf-c-txt-purple-90:var(--sf-c-purple-90);--sf-c-txt-purple-100:var(--sf-c-purple-100);--sf-dark-c-purple:300 100% 75%;--sf-dark-c-purple-0:300 100% 0%;--sf-dark-c-purple-10:300 100% 10%;--sf-dark-c-purple-20:300 100% 20%;--sf-dark-c-purple-30:300 100% 30%;--sf-dark-c-purple-40:300 100% 40%;--sf-dark-c-purple-50:300 100% 50%;--sf-dark-c-purple-60:300 100% 60%;--sf-dark-c-purple-70:300 100% 70%;--sf-dark-c-purple-80:300 100% 80%;--sf-dark-c-purple-90:300 100% 90%;--sf-dark-c-purple-100:300 100% 100%;--sf-dark-c-txt-purple:var(--sf-dark-c-purple);--sf-dark-c-txt-purple-0:var(--sf-dark-c-purple-0);--sf-dark-c-txt-purple-10:var(--sf-dark-c-purple-10);--sf-dark-c-txt-purple-20:var(--sf-dark-c-purple-20);--sf-dark-c-txt-purple-30:var(--sf-dark-c-purple-30);--sf-dark-c-txt-purple-40:var(--sf-dark-c-purple-40);--sf-dark-c-txt-purple-50:var(--sf-dark-c-purple-50);--sf-dark-c-txt-purple-60:var(--sf-dark-c-purple-60);--sf-dark-c-txt-purple-70:var(--sf-dark-c-purple-70);--sf-dark-c-txt-purple-80:var(--sf-dark-c-purple-80);--sf-dark-c-txt-purple-90:var(--sf-dark-c-purple-90);--sf-dark-c-txt-purple-100:var(--sf-dark-c-purple-100);--sf-c-red:0 100% 50%;--sf-c-red-0:0 100% 0%;--sf-c-red-10:0 100% 10%;--sf-c-red-20:0 100% 20%;--sf-c-red-30:0 100% 30%;--sf-c-red-40:0 100% 40%;--sf-c-red-50:0 100% 50%;--sf-c-red-60:0 100% 60%;--sf-c-red-70:0 100% 70%;--sf-c-red-80:0 100% 80%;--sf-c-red-90:0 100% 90%;--sf-c-red-100:0 100% 100%;--sf-c-txt-red:var(--sf-c-red);--sf-c-txt-red-0:var(--sf-c-red-0);--sf-c-txt-red-10:var(--sf-c-red-10);--sf-c-txt-red-20:var(--sf-c-red-20);--sf-c-txt-red-30:var(--sf-c-red-30);--sf-c-txt-red-40:var(--sf-c-red-40);--sf-c-txt-red-50:var(--sf-c-red-50);--sf-c-txt-red-60:var(--sf-c-red-60);--sf-c-txt-red-70:var(--sf-c-red-70);--sf-c-txt-red-80:var(--sf-c-red-80);--sf-c-txt-red-90:var(--sf-c-red-90);--sf-c-txt-red-100:var(--sf-c-red-100);--sf-dark-c-red:0 100% 50%;--sf-dark-c-red-0:0 100% 0%;--sf-dark-c-red-10:0 100% 10%;--sf-dark-c-red-20:0 100% 20%;--sf-dark-c-red-30:0 100% 30%;--sf-dark-c-red-40:0 100% 40%;--sf-dark-c-red-50:0 100% 50%;--sf-dark-c-red-60:0 100% 60%;--sf-dark-c-red-70:0 100% 70%;--sf-dark-c-red-80:0 100% 80%;--sf-dark-c-red-90:0 100% 90%;--sf-dark-c-red-100:0 100% 100%;--sf-dark-c-txt-red:var(--sf-dark-c-red);--sf-dark-c-txt-red-0:var(--sf-dark-c-red-0);--sf-dark-c-txt-red-10:var(--sf-dark-c-red-10);--sf-dark-c-txt-red-20:var(--sf-dark-c-red-20);--sf-dark-c-txt-red-30:var(--sf-dark-c-red-30);--sf-dark-c-txt-red-40:var(--sf-dark-c-red-40);--sf-dark-c-txt-red-50:var(--sf-dark-c-red-50);--sf-dark-c-txt-red-60:var(--sf-dark-c-red-60);--sf-dark-c-txt-red-70:var(--sf-dark-c-red-70);--sf-dark-c-txt-red-80:var(--sf-dark-c-red-80);--sf-dark-c-txt-red-90:var(--sf-dark-c-red-90);--sf-dark-c-txt-red-100:var(--sf-dark-c-red-100);--sf-c-silver:0 0% 75%;--sf-c-silver-0:0 0% 0%;--sf-c-silver-10:0 0% 10%;--sf-c-silver-20:0 0% 20%;--sf-c-silver-30:0 0% 30%;--sf-c-silver-40:0 0% 40%;--sf-c-silver-50:0 0% 50%;--sf-c-silver-60:0 0% 60%;--sf-c-silver-70:0 0% 70%;--sf-c-silver-80:0 0% 80%;--sf-c-silver-90:0 0% 90%;--sf-c-silver-100:0 0% 100%;--sf-c-txt-silver:var(--sf-c-silver);--sf-c-txt-silver-0:var(--sf-c-silver-0);--sf-c-txt-silver-10:var(--sf-c-silver-10);--sf-c-txt-silver-20:var(--sf-c-silver-20);--sf-c-txt-silver-30:var(--sf-c-silver-30);--sf-c-txt-silver-40:var(--sf-c-silver-40);--sf-c-txt-silver-50:var(--sf-c-silver-50);--sf-c-txt-silver-60:var(--sf-c-silver-60);--sf-c-txt-silver-70:var(--sf-c-silver-70);--sf-c-txt-silver-80:var(--sf-c-silver-80);--sf-c-txt-silver-90:var(--sf-c-silver-90);--sf-c-txt-silver-100:var(--sf-c-silver-100);--sf-dark-c-silver:0 0% 25%;--sf-dark-c-silver-0:0 0% 0%;--sf-dark-c-silver-10:0 0% 10%;--sf-dark-c-silver-20:0 0% 20%;--sf-dark-c-silver-30:0 0% 30%;--sf-dark-c-silver-40:0 0% 40%;--sf-dark-c-silver-50:0 0% 50%;--sf-dark-c-silver-60:0 0% 60%;--sf-dark-c-silver-70:0 0% 70%;--sf-dark-c-silver-80:0 0% 80%;--sf-dark-c-silver-90:0 0% 90%;--sf-dark-c-silver-100:0 0% 100%;--sf-dark-c-txt-silver:var(--sf-dark-c-silver);--sf-dark-c-txt-silver-0:var(--sf-dark-c-silver-0);--sf-dark-c-txt-silver-10:var(--sf-dark-c-silver-10);--sf-dark-c-txt-silver-20:var(--sf-dark-c-silver-20);--sf-dark-c-txt-silver-30:var(--sf-dark-c-silver-30);--sf-dark-c-txt-silver-40:var(--sf-dark-c-silver-40);--sf-dark-c-txt-silver-50:var(--sf-dark-c-silver-50);--sf-dark-c-txt-silver-60:var(--sf-dark-c-silver-60);--sf-dark-c-txt-silver-70:var(--sf-dark-c-silver-70);--sf-dark-c-txt-silver-80:var(--sf-dark-c-silver-80);--sf-dark-c-txt-silver-90:var(--sf-dark-c-silver-90);--sf-dark-c-txt-silver-100:var(--sf-dark-c-silver-100);--sf-c-teal:180 100% 25%;--sf-c-teal-0:180 100% 0%;--sf-c-teal-10:180 100% 10%;--sf-c-teal-20:180 100% 20%;--sf-c-teal-30:180 100% 30%;--sf-c-teal-40:180 100% 40%;--sf-c-teal-50:180 100% 50%;--sf-c-teal-60:180 100% 60%;--sf-c-teal-70:180 100% 70%;--sf-c-teal-80:180 100% 80%;--sf-c-teal-90:180 100% 90%;--sf-c-teal-100:180 100% 100%;--sf-c-txt-teal:var(--sf-c-teal);--sf-c-txt-teal-0:var(--sf-c-teal-0);--sf-c-txt-teal-10:var(--sf-c-teal-10);--sf-c-txt-teal-20:var(--sf-c-teal-20);--sf-c-txt-teal-30:var(--sf-c-teal-30);--sf-c-txt-teal-40:var(--sf-c-teal-40);--sf-c-txt-teal-50:var(--sf-c-teal-50);--sf-c-txt-teal-60:var(--sf-c-teal-60);--sf-c-txt-teal-70:var(--sf-c-teal-70);--sf-c-txt-teal-80:var(--sf-c-teal-80);--sf-c-txt-teal-90:var(--sf-c-teal-90);--sf-c-txt-teal-100:var(--sf-c-teal-100);--sf-dark-c-teal:180 100% 75%;--sf-dark-c-teal-0:180 100% 0%;--sf-dark-c-teal-10:180 100% 10%;--sf-dark-c-teal-20:180 100% 20%;--sf-dark-c-teal-30:180 100% 30%;--sf-dark-c-teal-40:180 100% 40%;--sf-dark-c-teal-50:180 100% 50%;--sf-dark-c-teal-60:180 100% 60%;--sf-dark-c-teal-70:180 100% 70%;--sf-dark-c-teal-80:180 100% 80%;--sf-dark-c-teal-90:180 100% 90%;--sf-dark-c-teal-100:180 100% 100%;--sf-dark-c-txt-teal:var(--sf-dark-c-teal);--sf-dark-c-txt-teal-0:var(--sf-dark-c-teal-0);--sf-dark-c-txt-teal-10:var(--sf-dark-c-teal-10);--sf-dark-c-txt-teal-20:var(--sf-dark-c-teal-20);--sf-dark-c-txt-teal-30:var(--sf-dark-c-teal-30);--sf-dark-c-txt-teal-40:var(--sf-dark-c-teal-40);--sf-dark-c-txt-teal-50:var(--sf-dark-c-teal-50);--sf-dark-c-txt-teal-60:var(--sf-dark-c-teal-60);--sf-dark-c-txt-teal-70:var(--sf-dark-c-teal-70);--sf-dark-c-txt-teal-80:var(--sf-dark-c-teal-80);--sf-dark-c-txt-teal-90:var(--sf-dark-c-teal-90);--sf-dark-c-txt-teal-100:var(--sf-dark-c-teal-100);--sf-c-white:0 0% 100%;--sf-c-white-0:0 0% 0%;--sf-c-white-10:0 0% 10%;--sf-c-white-20:0 0% 20%;--sf-c-white-30:0 0% 30%;--sf-c-white-40:0 0% 40%;--sf-c-white-50:0 0% 50%;--sf-c-white-60:0 0% 60%;--sf-c-white-70:0 0% 70%;--sf-c-white-80:0 0% 80%;--sf-c-white-90:0 0% 90%;--sf-c-white-100:0 0% 100%;--sf-c-txt-white:var(--sf-c-white);--sf-c-txt-white-0:var(--sf-c-white-0);--sf-c-txt-white-10:var(--sf-c-white-10);--sf-c-txt-white-20:var(--sf-c-white-20);--sf-c-txt-white-30:var(--sf-c-white-30);--sf-c-txt-white-40:var(--sf-c-white-40);--sf-c-txt-white-50:var(--sf-c-white-50);--sf-c-txt-white-60:var(--sf-c-white-60);--sf-c-txt-white-70:var(--sf-c-white-70);--sf-c-txt-white-80:var(--sf-c-white-80);--sf-c-txt-white-90:var(--sf-c-white-90);--sf-c-txt-white-100:var(--sf-c-white-100);--sf-dark-c-white:0 0% 0%;--sf-dark-c-white-0:0 0% 0%;--sf-dark-c-white-10:0 0% 10%;--sf-dark-c-white-20:0 0% 20%;--sf-dark-c-white-30:0 0% 30%;--sf-dark-c-white-40:0 0% 40%;--sf-dark-c-white-50:0 0% 50%;--sf-dark-c-white-60:0 0% 60%;--sf-dark-c-white-70:0 0% 70%;--sf-dark-c-white-80:0 0% 80%;--sf-dark-c-white-90:0 0% 90%;--sf-dark-c-white-100:0 0% 100%;--sf-dark-c-txt-white:var(--sf-dark-c-white);--sf-dark-c-txt-white-0:var(--sf-dark-c-white-0);--sf-dark-c-txt-white-10:var(--sf-dark-c-white-10);--sf-dark-c-txt-white-20:var(--sf-dark-c-white-20);--sf-dark-c-txt-white-30:var(--sf-dark-c-white-30);--sf-dark-c-txt-white-40:var(--sf-dark-c-white-40);--sf-dark-c-txt-white-50:var(--sf-dark-c-white-50);--sf-dark-c-txt-white-60:var(--sf-dark-c-white-60);--sf-dark-c-txt-white-70:var(--sf-dark-c-white-70);--sf-dark-c-txt-white-80:var(--sf-dark-c-white-80);--sf-dark-c-txt-white-90:var(--sf-dark-c-white-90);--sf-dark-c-txt-white-100:var(--sf-dark-c-white-100);--sf-c-yellow:60 100% 50%;--sf-c-yellow-0:60 100% 0%;--sf-c-yellow-10:60 100% 10%;--sf-c-yellow-20:60 100% 20%;--sf-c-yellow-30:60 100% 30%;--sf-c-yellow-40:60 100% 40%;--sf-c-yellow-50:60 100% 50%;--sf-c-yellow-60:60 100% 60%;--sf-c-yellow-70:60 100% 70%;--sf-c-yellow-80:60 100% 80%;--sf-c-yellow-90:60 100% 90%;--sf-c-yellow-100:60 100% 100%;--sf-c-txt-yellow:var(--sf-c-yellow);--sf-c-txt-yellow-0:var(--sf-c-yellow-0);--sf-c-txt-yellow-10:var(--sf-c-yellow-10);--sf-c-txt-yellow-20:var(--sf-c-yellow-20);--sf-c-txt-yellow-30:var(--sf-c-yellow-30);--sf-c-txt-yellow-40:var(--sf-c-yellow-40);--sf-c-txt-yellow-50:var(--sf-c-yellow-50);--sf-c-txt-yellow-60:var(--sf-c-yellow-60);--sf-c-txt-yellow-70:var(--sf-c-yellow-70);--sf-c-txt-yellow-80:var(--sf-c-yellow-80);--sf-c-txt-yellow-90:var(--sf-c-yellow-90);--sf-c-txt-yellow-100:var(--sf-c-yellow-100);--sf-dark-c-yellow:60 100% 50%;--sf-dark-c-yellow-0:60 100% 0%;--sf-dark-c-yellow-10:60 100% 10%;--sf-dark-c-yellow-20:60 100% 20%;--sf-dark-c-yellow-30:60 100% 30%;--sf-dark-c-yellow-40:60 100% 40%;--sf-dark-c-yellow-50:60 100% 50%;--sf-dark-c-yellow-60:60 100% 60%;--sf-dark-c-yellow-70:60 100% 70%;--sf-dark-c-yellow-80:60 100% 80%;--sf-dark-c-yellow-90:60 100% 90%;--sf-dark-c-yellow-100:60 100% 100%;--sf-dark-c-txt-yellow:var(--sf-dark-c-yellow);--sf-dark-c-txt-yellow-0:var(--sf-dark-c-yellow-0);--sf-dark-c-txt-yellow-10:var(--sf-dark-c-yellow-10);--sf-dark-c-txt-yellow-20:var(--sf-dark-c-yellow-20);--sf-dark-c-txt-yellow-30:var(--sf-dark-c-yellow-30);--sf-dark-c-txt-yellow-40:var(--sf-dark-c-yellow-40);--sf-dark-c-txt-yellow-50:var(--sf-dark-c-yellow-50);--sf-dark-c-txt-yellow-60:var(--sf-dark-c-yellow-60);--sf-dark-c-txt-yellow-70:var(--sf-dark-c-yellow-70);--sf-dark-c-txt-yellow-80:var(--sf-dark-c-yellow-80);--sf-dark-c-txt-yellow-90:var(--sf-dark-c-yellow-90);--sf-dark-c-txt-yellow-100:var(--sf-dark-c-yellow-100)}.sf-c-aqua{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}.sf-c-aqua\:0{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}.sf-c-aqua\:10{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}.sf-c-aqua\:20{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}.sf-c-aqua\:30{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-30))}.sf-c-aqua\:40{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-40))}.sf-c-aqua\:50{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}.sf-c-aqua\:60{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}.sf-c-aqua\:70{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}.sf-c-aqua\:80{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}.sf-c-aqua\:90{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}.sf-c-aqua\:100{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-100))}html.var .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var .sf-c-aqua\:10{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var .sf-c-aqua\:20{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var .sf-c-aqua\:30{color:hsl(180,100%,90%);background:hsl(180,100%,30%)}html.var .sf-c-aqua\:40{color:hsl(180,100%,90%);background:hsl(180,100%,40%)}html.var .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var .sf-c-aqua\:80{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var .sf-c-aqua\:90{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var .sf-c-aqua\:100{color:hsl(180,100%,10%);background:hsl(180,100%,100%)}.sf-c-txt-aqua{color:hsl(var(--sf-dark-c-txt-aqua))}.sf-c-txt-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-100))}.sf-c-txt-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-90))}.sf-c-txt-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-80))}.sf-c-txt-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-70))}.sf-c-txt-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-60))}.sf-c-txt-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-50))}.sf-c-txt-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-40))}.sf-c-txt-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-30))}.sf-c-txt-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-20))}.sf-c-txt-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-10))}.sf-c-txt-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-0))}html.var .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var .sf-c-txt-aqua\:0{color:hsl(180,100%,100%)}html.var .sf-c-txt-aqua\:10{color:hsl(180,100%,90%)}html.var .sf-c-txt-aqua\:20{color:hsl(180,100%,80%)}html.var .sf-c-txt-aqua\:30{color:hsl(180,100%,70%)}html.var .sf-c-txt-aqua\:40{color:hsl(180,100%,60%)}html.var .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var .sf-c-txt-aqua\:60{color:hsl(180,100%,40%)}html.var .sf-c-txt-aqua\:70{color:hsl(180,100%,30%)}html.var .sf-c-txt-aqua\:80{color:hsl(180,100%,20%)}html.var .sf-c-txt-aqua\:90{color:hsl(180,100%,10%)}html.var .sf-c-txt-aqua\:100{color:hsl(180,100%,0%)}html[data-theme='dark'] .sf-c-aqua,html.dark .sf-c-aqua{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua))}html[data-theme='dark'] .sf-c-aqua\:0,html.dark .sf-c-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-100))}html[data-theme='dark'] .sf-c-aqua\:10,html.dark .sf-c-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-90))}html[data-theme='dark'] .sf-c-aqua\:20,html.dark .sf-c-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-80))}html[data-theme='dark'] .sf-c-aqua\:30,html.dark .sf-c-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-70))}html[data-theme='dark'] .sf-c-aqua\:40,html.dark .sf-c-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-60))}html[data-theme='dark'] .sf-c-aqua\:50,html.dark .sf-c-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-50))}html[data-theme='dark'] .sf-c-aqua\:60,html.dark .sf-c-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-40))}html[data-theme='dark'] .sf-c-aqua\:70,html.dark .sf-c-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-30))}html[data-theme='dark'] .sf-c-aqua\:80,html.dark .sf-c-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-20))}html[data-theme='dark'] .sf-c-aqua\:90,html.dark .sf-c-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-10))}html[data-theme='dark'] .sf-c-aqua\:100,html.dark .sf-c-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-0))}html[data-theme='dark'] .sf-c-aqua\:dark,html.dark .sf-c-aqua\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}html[data-theme='dark'] .sf-c-aqua\:0\:dark,html.dark .sf-c-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-100))}html[data-theme='dark'] .sf-c-aqua\:10\:dark,html.dark .sf-c-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}html[data-theme='dark'] .sf-c-aqua\:20\:dark,html.dark .sf-c-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}html[data-theme='dark'] .sf-c-aqua\:30\:dark,html.dark .sf-c-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}html[data-theme='dark'] .sf-c-aqua\:40\:dark,html.dark .sf-c-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}html[data-theme='dark'] .sf-c-aqua\:50\:dark,html.dark .sf-c-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}html[data-theme='dark'] .sf-c-aqua\:60\:dark,html.dark .sf-c-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-40))}html[data-theme='dark'] .sf-c-aqua\:70\:dark,html.dark .sf-c-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-30))}html[data-theme='dark'] .sf-c-aqua\:80\:dark,html.dark .sf-c-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}html[data-theme='dark'] .sf-c-aqua\:90\:dark,html.dark .sf-c-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}html[data-theme='dark'] .sf-c-aqua\:100\:dark,html.dark .sf-c-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua,html.dark .sf-c-txt-aqua{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='dark'] .sf-c-txt-aqua\:0,html.dark .sf-c-txt-aqua\:0{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua\:10,html.dark .sf-c-txt-aqua\:10{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='dark'] .sf-c-txt-aqua\:20,html.dark .sf-c-txt-aqua\:20{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='dark'] .sf-c-txt-aqua\:30,html.dark .sf-c-txt-aqua\:30{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='dark'] .sf-c-txt-aqua\:40,html.dark .sf-c-txt-aqua\:40{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='dark'] .sf-c-txt-aqua\:50,html.dark .sf-c-txt-aqua\:50{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='dark'] .sf-c-txt-aqua\:60,html.dark .sf-c-txt-aqua\:60{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='dark'] .sf-c-txt-aqua\:70,html.dark .sf-c-txt-aqua\:70{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='dark'] .sf-c-txt-aqua\:80,html.dark .sf-c-txt-aqua\:80{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='dark'] .sf-c-txt-aqua\:90,html.dark .sf-c-txt-aqua\:90{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='dark'] .sf-c-txt-aqua\:100,html.dark .sf-c-txt-aqua\:100{color:hsl(var(--sf-c-txt-aqua-100))}html[data-theme='dark'] .sf-c-txt-aqua\:dark,html.dark .sf-c-txt-aqua\:dark{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='dark'] .sf-c-txt-aqua\:0\:dark,html.dark .sf-c-txt-aqua\:0\:dark{color:hsl(var(--sf-dark-c-txt-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua\:10\:dark,html.dark .sf-c-txt-aqua\:10\:dark{color:hsl(var(--sf-dark-c-txt-aqua-10))}html[data-theme='dark'] .sf-c-txt-aqua\:20\:dark,html.dark .sf-c-txt-aqua\:20\:dark{color:hsl(var(--sf-dark-c-txt-aqua-20))}html[data-theme='dark'] .sf-c-txt-aqua\:30\:dark,html.dark .sf-c-txt-aqua\:30\:dark{color:hsl(var(--sf-dark-c-txt-aqua-30))}html[data-theme='dark'] .sf-c-txt-aqua\:40\:dark,html.dark .sf-c-txt-aqua\:40\:dark{color:hsl(var(--sf-dark-c-txt-aqua-40))}html[data-theme='dark'] .sf-c-txt-aqua\:50\:dark,html.dark .sf-c-txt-aqua\:50\:dark{color:hsl(var(--sf-dark-c-txt-aqua-50))}html[data-theme='dark'] .sf-c-txt-aqua\:60\:dark,html.dark .sf-c-txt-aqua\:60\:dark{color:hsl(var(--sf-dark-c-txt-aqua-60))}html[data-theme='dark'] .sf-c-txt-aqua\:70\:dark,html.dark .sf-c-txt-aqua\:70\:dark{color:hsl(var(--sf-dark-c-txt-aqua-70))}html[data-theme='dark'] .sf-c-txt-aqua\:80\:dark,html.dark .sf-c-txt-aqua\:80\:dark{color:hsl(var(--sf-dark-c-txt-aqua-80))}html[data-theme='dark'] .sf-c-txt-aqua\:90\:dark,html.dark .sf-c-txt-aqua\:90\:dark{color:hsl(var(--sf-dark-c-txt-aqua-90))}html[data-theme='dark'] .sf-c-txt-aqua\:100\:dark,html.dark .sf-c-txt-aqua\:100\:dark{color:hsl(var(--sf-dark-c-txt-aqua-100))}html.var[data-theme='dark'] .sf-c-aqua,html.var.dark .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:0,html.var.dark .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-aqua\:10,html.var.dark .sf-c-aqua\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-aqua\:20,html.var.dark .sf-c-aqua\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-aqua\:30,html.var.dark .sf-c-aqua\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-aqua\:40,html.var.dark .sf-c-aqua\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-aqua\:50,html.var.dark .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:60,html.var.dark .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-aqua\:70,html.var.dark .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-aqua\:80,html.var.dark .sf-c-aqua\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-aqua\:90,html.var.dark .sf-c-aqua\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-aqua\:100,html.var.dark .sf-c-aqua\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-aqua\:dark,html.var.dark .sf-c-aqua\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:0\:dark,html.var.dark .sf-c-aqua\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-aqua\:10\:dark,html.var.dark .sf-c-aqua\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-aqua\:20\:dark,html.var.dark .sf-c-aqua\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-aqua\:30\:dark,html.var.dark .sf-c-aqua\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-aqua\:40\:dark,html.var.dark .sf-c-aqua\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-aqua\:50\:dark,html.var.dark .sf-c-aqua\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:60\:dark,html.var.dark .sf-c-aqua\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-aqua\:70\:dark,html.var.dark .sf-c-aqua\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-aqua\:80\:dark,html.var.dark .sf-c-aqua\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-aqua\:90\:dark,html.var.dark .sf-c-aqua\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-aqua\:100\:dark,html.var.dark .sf-c-aqua\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua,html.dark .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:0,html.dark .sf-c-txt-aqua\:0{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:10,html.dark .sf-c-txt-aqua\:10{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:20,html.dark .sf-c-txt-aqua\:20{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:30,html.dark .sf-c-txt-aqua\:30{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:40,html.dark .sf-c-txt-aqua\:40{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:50,html.dark .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:60,html.dark .sf-c-txt-aqua\:60{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:70,html.dark .sf-c-txt-aqua\:70{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:80,html.dark .sf-c-txt-aqua\:80{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:90,html.dark .sf-c-txt-aqua\:90{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:100,html.dark .sf-c-txt-aqua\:100{color:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:dark,html.dark .sf-c-txt-aqua\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:0\:dark,html.dark .sf-c-txt-aqua\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:10\:dark,html.dark .sf-c-txt-aqua\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:20\:dark,html.dark .sf-c-txt-aqua\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:30\:dark,html.dark .sf-c-txt-aqua\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:40\:dark,html.dark .sf-c-txt-aqua\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:50\:dark,html.dark .sf-c-txt-aqua\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:60\:dark,html.dark .sf-c-txt-aqua\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:70\:dark,html.dark .sf-c-txt-aqua\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:80\:dark,html.dark .sf-c-txt-aqua\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:90\:dark,html.dark .sf-c-txt-aqua\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:100\:dark,html.dark .sf-c-txt-aqua\:100\:dark{color:hsl(180,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-aqua,html.auto .sf-c-aqua{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua))}html[data-theme='auto'] .sf-c-aqua\:0,html.auto .sf-c-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-100))}html[data-theme='auto'] .sf-c-aqua\:10,html.auto .sf-c-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-90))}html[data-theme='auto'] .sf-c-aqua\:20,html.auto .sf-c-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-80))}html[data-theme='auto'] .sf-c-aqua\:30,html.auto .sf-c-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-70))}html[data-theme='auto'] .sf-c-aqua\:40,html.auto .sf-c-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-60))}html[data-theme='auto'] .sf-c-aqua\:50,html.auto .sf-c-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-50))}html[data-theme='auto'] .sf-c-aqua\:60,html.auto .sf-c-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-40))}html[data-theme='auto'] .sf-c-aqua\:70,html.auto .sf-c-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-30))}html[data-theme='auto'] .sf-c-aqua\:80,html.auto .sf-c-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-20))}html[data-theme='auto'] .sf-c-aqua\:90,html.auto .sf-c-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-10))}html[data-theme='auto'] .sf-c-aqua\:100,html.auto .sf-c-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-0))}html[data-theme='auto'] .sf-c-aqua\:dark,html.auto .sf-c-aqua\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}html[data-theme='auto'] .sf-c-aqua\:0\:dark,html.auto .sf-c-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-100))}html[data-theme='auto'] .sf-c-aqua\:10\:dark,html.auto .sf-c-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}html[data-theme='auto'] .sf-c-aqua\:20\:dark,html.auto .sf-c-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}html[data-theme='auto'] .sf-c-aqua\:30\:dark,html.auto .sf-c-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}html[data-theme='auto'] .sf-c-aqua\:40\:dark,html.auto .sf-c-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}html[data-theme='auto'] .sf-c-aqua\:50\:dark,html.auto .sf-c-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}html[data-theme='auto'] .sf-c-aqua\:60\:dark,html.auto .sf-c-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-40))}html[data-theme='auto'] .sf-c-aqua\:70\:dark,html.auto .sf-c-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-30))}html[data-theme='auto'] .sf-c-aqua\:80\:dark,html.auto .sf-c-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}html[data-theme='auto'] .sf-c-aqua\:90\:dark,html.auto .sf-c-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}html[data-theme='auto'] .sf-c-aqua\:100\:dark,html.auto .sf-c-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua,html.auto .sf-c-txt-aqua{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='auto'] .sf-c-txt-aqua\:0,html.auto .sf-c-txt-aqua\:0{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua\:10,html.auto .sf-c-txt-aqua\:10{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='auto'] .sf-c-txt-aqua\:20,html.auto .sf-c-txt-aqua\:20{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='auto'] .sf-c-txt-aqua\:30,html.auto .sf-c-txt-aqua\:30{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='auto'] .sf-c-txt-aqua\:40,html.auto .sf-c-txt-aqua\:40{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='auto'] .sf-c-txt-aqua\:50,html.auto .sf-c-txt-aqua\:50{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='auto'] .sf-c-txt-aqua\:60,html.auto .sf-c-txt-aqua\:60{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='auto'] .sf-c-txt-aqua\:70,html.auto .sf-c-txt-aqua\:70{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='auto'] .sf-c-txt-aqua\:80,html.auto .sf-c-txt-aqua\:80{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='auto'] .sf-c-txt-aqua\:90,html.auto .sf-c-txt-aqua\:90{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='auto'] .sf-c-txt-aqua\:100,html.auto .sf-c-txt-aqua\:100{color:hsl(var(--sf-c-txt-aqua-100))}html[data-theme='auto'] .sf-c-txt-aqua\:dark,html.auto .sf-c-txt-aqua\:dark{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='auto'] .sf-c-txt-aqua\:0\:dark,html.auto .sf-c-txt-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua\:10\:dark,html.auto .sf-c-txt-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='auto'] .sf-c-txt-aqua\:20\:dark,html.auto .sf-c-txt-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='auto'] .sf-c-txt-aqua\:30\:dark,html.auto .sf-c-txt-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='auto'] .sf-c-txt-aqua\:40\:dark,html.auto .sf-c-txt-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='auto'] .sf-c-txt-aqua\:50\:dark,html.auto .sf-c-txt-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='auto'] .sf-c-txt-aqua\:60\:dark,html.auto .sf-c-txt-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='auto'] .sf-c-txt-aqua\:70\:dark,html.auto .sf-c-txt-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='auto'] .sf-c-txt-aqua\:80\:dark,html.auto .sf-c-txt-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='auto'] .sf-c-txt-aqua\:90\:dark,html.auto .sf-c-txt-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='auto'] .sf-c-txt-aqua\:100\:dark,html.auto .sf-c-txt-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-100))}html.var[data-theme='auto'] .sf-c-aqua,html.var.auto .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:0,html.var.auto .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-aqua\:10,html.var.auto .sf-c-aqua\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-aqua\:20,html.var.auto .sf-c-aqua\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-aqua\:30,html.var.auto .sf-c-aqua\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-aqua\:40,html.var.auto .sf-c-aqua\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-aqua\:50,html.var.auto .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:60,html.var.auto .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-aqua\:70,html.var.auto .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-aqua\:80,html.var.auto .sf-c-aqua\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-aqua\:90,html.var.auto .sf-c-aqua\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-aqua\:100,html.var.auto .sf-c-aqua\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-aqua\:dark,html.var.auto .sf-c-aqua\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:0\:dark,html.var.auto .sf-c-aqua\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-aqua\:10\:dark,html.var.auto .sf-c-aqua\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-aqua\:20\:dark,html.var.auto .sf-c-aqua\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-aqua\:30\:dark,html.var.auto .sf-c-aqua\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-aqua\:40\:dark,html.var.auto .sf-c-aqua\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-aqua\:50\:dark,html.var.auto .sf-c-aqua\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:60\:dark,html.var.auto .sf-c-aqua\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-aqua\:70\:dark,html.var.auto .sf-c-aqua\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-aqua\:80\:dark,html.var.auto .sf-c-aqua\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-aqua\:90\:dark,html.var.auto .sf-c-aqua\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-aqua\:100\:dark,html.var.auto .sf-c-aqua\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua,html.auto .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:0,html.auto .sf-c-txt-aqua\:0{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:10,html.auto .sf-c-txt-aqua\:10{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:20,html.auto .sf-c-txt-aqua\:20{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:30,html.auto .sf-c-txt-aqua\:30{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:40,html.auto .sf-c-txt-aqua\:40{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:50,html.auto .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:60,html.auto .sf-c-txt-aqua\:60{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:70,html.auto .sf-c-txt-aqua\:70{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:80,html.auto .sf-c-txt-aqua\:80{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:90,html.auto .sf-c-txt-aqua\:90{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:100,html.auto .sf-c-txt-aqua\:100{color:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:dark,html.auto .sf-c-txt-aqua\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark,html.auto .sf-c-txt-aqua\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark,html.auto .sf-c-txt-aqua\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark,html.auto .sf-c-txt-aqua\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark,html.auto .sf-c-txt-aqua\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark,html.auto .sf-c-txt-aqua\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark,html.auto .sf-c-txt-aqua\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark,html.auto .sf-c-txt-aqua\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark,html.auto .sf-c-txt-aqua\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark,html.auto .sf-c-txt-aqua\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark,html.auto .sf-c-txt-aqua\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark,html.auto .sf-c-txt-aqua\:100\:dark{color:hsl(180,100%,100%)}}.sf-c-black{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black))}.sf-c-black\:0{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}.sf-c-black\:10{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}.sf-c-black\:20{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}.sf-c-black\:30{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}.sf-c-black\:40{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}.sf-c-black\:50{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-50))}.sf-c-black\:60{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-60))}.sf-c-black\:70{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}.sf-c-black\:80{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}.sf-c-black\:90{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}.sf-c-black\:100{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-100))}html.var .sf-c-black{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-black\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-black\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-black\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-black\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-black\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-black\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-black\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-black\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-black{color:hsl(var(--sf-dark-c-txt-black))}.sf-c-txt-black\:0{color:hsl(var(--sf-dark-c-txt-black-100))}.sf-c-txt-black\:10{color:hsl(var(--sf-dark-c-txt-black-90))}.sf-c-txt-black\:20{color:hsl(var(--sf-dark-c-txt-black-80))}.sf-c-txt-black\:30{color:hsl(var(--sf-dark-c-txt-black-70))}.sf-c-txt-black\:40{color:hsl(var(--sf-dark-c-txt-black-60))}.sf-c-txt-black\:50{color:hsl(var(--sf-dark-c-txt-black-50))}.sf-c-txt-black\:60{color:hsl(var(--sf-dark-c-txt-black-40))}.sf-c-txt-black\:70{color:hsl(var(--sf-dark-c-txt-black-30))}.sf-c-txt-black\:80{color:hsl(var(--sf-dark-c-txt-black-20))}.sf-c-txt-black\:90{color:hsl(var(--sf-dark-c-txt-black-10))}.sf-c-txt-black\:100{color:hsl(var(--sf-dark-c-txt-black-0))}html.var .sf-c-txt-black{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-black\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-black\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-black\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-black\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-black\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-black\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-black\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-black\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-black,html.dark .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='dark'] .sf-c-black\:0,html.dark .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='dark'] .sf-c-black\:10,html.dark .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='dark'] .sf-c-black\:20,html.dark .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='dark'] .sf-c-black\:30,html.dark .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='dark'] .sf-c-black\:40,html.dark .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='dark'] .sf-c-black\:50,html.dark .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='dark'] .sf-c-black\:60,html.dark .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='dark'] .sf-c-black\:70,html.dark .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='dark'] .sf-c-black\:80,html.dark .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='dark'] .sf-c-black\:90,html.dark .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='dark'] .sf-c-black\:100,html.dark .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='dark'] .sf-c-black\:dark,html.dark .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='dark'] .sf-c-black\:0\:dark,html.dark .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='dark'] .sf-c-black\:10\:dark,html.dark .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='dark'] .sf-c-black\:20\:dark,html.dark .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='dark'] .sf-c-black\:30\:dark,html.dark .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='dark'] .sf-c-black\:40\:dark,html.dark .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='dark'] .sf-c-black\:50\:dark,html.dark .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='dark'] .sf-c-black\:60\:dark,html.dark .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='dark'] .sf-c-black\:70\:dark,html.dark .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='dark'] .sf-c-black\:80\:dark,html.dark .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='dark'] .sf-c-black\:90\:dark,html.dark .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='dark'] .sf-c-black\:100\:dark,html.dark .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-dark-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-dark-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-dark-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-dark-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-dark-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-dark-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-dark-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-dark-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-dark-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-dark-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-dark-c-txt-black-100))}html.var[data-theme='dark'] .sf-c-black,html.var.dark .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0,html.var.dark .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10,html.var.dark .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20,html.var.dark .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30,html.var.dark .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40,html.var.dark .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50,html.var.dark .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60,html.var.dark .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70,html.var.dark .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80,html.var.dark .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90,html.var.dark .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100,html.var.dark .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-black\:dark,html.var.dark .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0\:dark,html.var.dark .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10\:dark,html.var.dark .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20\:dark,html.var.dark .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30\:dark,html.var.dark .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40\:dark,html.var.dark .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50\:dark,html.var.dark .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60\:dark,html.var.dark .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70\:dark,html.var.dark .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80\:dark,html.var.dark .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90\:dark,html.var.dark .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100\:dark,html.var.dark .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-black,html.auto .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='auto'] .sf-c-black\:0,html.auto .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='auto'] .sf-c-black\:10,html.auto .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='auto'] .sf-c-black\:20,html.auto .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='auto'] .sf-c-black\:30,html.auto .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='auto'] .sf-c-black\:40,html.auto .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='auto'] .sf-c-black\:50,html.auto .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='auto'] .sf-c-black\:60,html.auto .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='auto'] .sf-c-black\:70,html.auto .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='auto'] .sf-c-black\:80,html.auto .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='auto'] .sf-c-black\:90,html.auto .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='auto'] .sf-c-black\:100,html.auto .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='auto'] .sf-c-black\:dark,html.auto .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='auto'] .sf-c-black\:0\:dark,html.auto .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='auto'] .sf-c-black\:10\:dark,html.auto .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='auto'] .sf-c-black\:20\:dark,html.auto .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='auto'] .sf-c-black\:30\:dark,html.auto .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='auto'] .sf-c-black\:40\:dark,html.auto .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='auto'] .sf-c-black\:50\:dark,html.auto .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='auto'] .sf-c-black\:60\:dark,html.auto .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='auto'] .sf-c-black\:70\:dark,html.auto .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='auto'] .sf-c-black\:80\:dark,html.auto .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='auto'] .sf-c-black\:90\:dark,html.auto .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='auto'] .sf-c-black\:100\:dark,html.auto .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-c-txt-black-100))}html.var[data-theme='auto'] .sf-c-black,html.var.auto .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0,html.var.auto .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10,html.var.auto .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20,html.var.auto .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30,html.var.auto .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40,html.var.auto .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50,html.var.auto .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60,html.var.auto .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70,html.var.auto .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80,html.var.auto .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90,html.var.auto .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100,html.var.auto .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-black\:dark,html.var.auto .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0\:dark,html.var.auto .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10\:dark,html.var.auto .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20\:dark,html.var.auto .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30\:dark,html.var.auto .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40\:dark,html.var.auto .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50\:dark,html.var.auto .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60\:dark,html.var.auto .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70\:dark,html.var.auto .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80\:dark,html.var.auto .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90\:dark,html.var.auto .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100\:dark,html.var.auto .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}}.sf-c-blue{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}.sf-c-blue\:0{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}.sf-c-blue\:10{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}.sf-c-blue\:20{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}.sf-c-blue\:30{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}.sf-c-blue\:40{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}.sf-c-blue\:50{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}.sf-c-blue\:60{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}.sf-c-blue\:70{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-70))}.sf-c-blue\:80{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-80))}.sf-c-blue\:90{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}.sf-c-blue\:100{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-100))}html.var .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-blue\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-blue\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-blue\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-blue\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-blue\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-blue{color:hsl(var(--sf-dark-c-txt-blue))}.sf-c-txt-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-100))}.sf-c-txt-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-90))}.sf-c-txt-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-80))}.sf-c-txt-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-70))}.sf-c-txt-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-60))}.sf-c-txt-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-50))}.sf-c-txt-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-40))}.sf-c-txt-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-30))}.sf-c-txt-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-20))}.sf-c-txt-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-10))}.sf-c-txt-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-0))}html.var .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-blue\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-blue\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-blue\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-blue\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-blue\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-blue\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-blue\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-blue\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-blue,html.dark .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='dark'] .sf-c-blue\:0,html.dark .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10,html.dark .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20,html.dark .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30,html.dark .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40,html.dark .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50,html.dark .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60,html.dark .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70,html.dark .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80,html.dark .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90,html.dark .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100,html.dark .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='dark'] .sf-c-blue\:dark,html.dark .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='dark'] .sf-c-blue\:0\:dark,html.dark .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10\:dark,html.dark .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20\:dark,html.dark .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30\:dark,html.dark .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40\:dark,html.dark .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50\:dark,html.dark .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60\:dark,html.dark .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70\:dark,html.dark .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80\:dark,html.dark .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90\:dark,html.dark .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100\:dark,html.dark .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-dark-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-dark-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-dark-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-dark-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-dark-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-dark-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-dark-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-dark-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-dark-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-dark-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-dark-c-txt-blue-100))}html.var[data-theme='dark'] .sf-c-blue,html.var.dark .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0,html.var.dark .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10,html.var.dark .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20,html.var.dark .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30,html.var.dark .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40,html.var.dark .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50,html.var.dark .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60,html.var.dark .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70,html.var.dark .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80,html.var.dark .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90,html.var.dark .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100,html.var.dark .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-blue\:dark,html.var.dark .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0\:dark,html.var.dark .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10\:dark,html.var.dark .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20\:dark,html.var.dark .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30\:dark,html.var.dark .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40\:dark,html.var.dark .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50\:dark,html.var.dark .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60\:dark,html.var.dark .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70\:dark,html.var.dark .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80\:dark,html.var.dark .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90\:dark,html.var.dark .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100\:dark,html.var.dark .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-blue,html.auto .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='auto'] .sf-c-blue\:0,html.auto .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10,html.auto .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20,html.auto .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30,html.auto .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40,html.auto .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50,html.auto .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60,html.auto .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70,html.auto .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80,html.auto .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90,html.auto .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100,html.auto .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='auto'] .sf-c-blue\:dark,html.auto .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='auto'] .sf-c-blue\:0\:dark,html.auto .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10\:dark,html.auto .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20\:dark,html.auto .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30\:dark,html.auto .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40\:dark,html.auto .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50\:dark,html.auto .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60\:dark,html.auto .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70\:dark,html.auto .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80\:dark,html.auto .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90\:dark,html.auto .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100\:dark,html.auto .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-100))}html.var[data-theme='auto'] .sf-c-blue,html.var.auto .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0,html.var.auto .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10,html.var.auto .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20,html.var.auto .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30,html.var.auto .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40,html.var.auto .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50,html.var.auto .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60,html.var.auto .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70,html.var.auto .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80,html.var.auto .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90,html.var.auto .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100,html.var.auto .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-blue\:dark,html.var.auto .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0\:dark,html.var.auto .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10\:dark,html.var.auto .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20\:dark,html.var.auto .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30\:dark,html.var.auto .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40\:dark,html.var.auto .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50\:dark,html.var.auto .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60\:dark,html.var.auto .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70\:dark,html.var.auto .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80\:dark,html.var.auto .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90\:dark,html.var.auto .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100\:dark,html.var.auto .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}}.sf-c-fuchsia{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}.sf-c-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}.sf-c-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}.sf-c-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}.sf-c-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}.sf-c-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}.sf-c-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-50))}.sf-c-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-60))}.sf-c-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}.sf-c-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}.sf-c-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}.sf-c-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-100))}html.var .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var .sf-c-fuchsia\:10{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var .sf-c-fuchsia\:20{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var .sf-c-fuchsia\:30{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var .sf-c-fuchsia\:40{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var .sf-c-fuchsia\:50{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,60%)}html.var .sf-c-fuchsia\:70{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var .sf-c-fuchsia\:80{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var .sf-c-fuchsia\:90{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var .sf-c-fuchsia\:100{color:hsl(300,100%,10%);background:hsl(300,100%,100%)}.sf-c-txt-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia))}.sf-c-txt-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-100))}.sf-c-txt-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-90))}.sf-c-txt-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-80))}.sf-c-txt-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-70))}.sf-c-txt-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-60))}.sf-c-txt-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-50))}.sf-c-txt-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-40))}.sf-c-txt-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-30))}.sf-c-txt-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-20))}.sf-c-txt-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-10))}.sf-c-txt-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-0))}html.var .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var .sf-c-txt-fuchsia\:0{color:hsl(300,100%,100%)}html.var .sf-c-txt-fuchsia\:10{color:hsl(300,100%,90%)}html.var .sf-c-txt-fuchsia\:20{color:hsl(300,100%,80%)}html.var .sf-c-txt-fuchsia\:30{color:hsl(300,100%,70%)}html.var .sf-c-txt-fuchsia\:40{color:hsl(300,100%,60%)}html.var .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var .sf-c-txt-fuchsia\:60{color:hsl(300,100%,40%)}html.var .sf-c-txt-fuchsia\:70{color:hsl(300,100%,30%)}html.var .sf-c-txt-fuchsia\:80{color:hsl(300,100%,20%)}html.var .sf-c-txt-fuchsia\:90{color:hsl(300,100%,10%)}html.var .sf-c-txt-fuchsia\:100{color:hsl(300,100%,0%)}html[data-theme='dark'] .sf-c-fuchsia,html.dark .sf-c-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia))}html[data-theme='dark'] .sf-c-fuchsia\:0,html.dark .sf-c-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-100))}html[data-theme='dark'] .sf-c-fuchsia\:10,html.dark .sf-c-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-90))}html[data-theme='dark'] .sf-c-fuchsia\:20,html.dark .sf-c-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-80))}html[data-theme='dark'] .sf-c-fuchsia\:30,html.dark .sf-c-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-70))}html[data-theme='dark'] .sf-c-fuchsia\:40,html.dark .sf-c-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-60))}html[data-theme='dark'] .sf-c-fuchsia\:50,html.dark .sf-c-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-50))}html[data-theme='dark'] .sf-c-fuchsia\:60,html.dark .sf-c-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-40))}html[data-theme='dark'] .sf-c-fuchsia\:70,html.dark .sf-c-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-30))}html[data-theme='dark'] .sf-c-fuchsia\:80,html.dark .sf-c-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-20))}html[data-theme='dark'] .sf-c-fuchsia\:90,html.dark .sf-c-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-10))}html[data-theme='dark'] .sf-c-fuchsia\:100,html.dark .sf-c-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-0))}html[data-theme='dark'] .sf-c-fuchsia\:dark,html.dark .sf-c-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}html[data-theme='dark'] .sf-c-fuchsia\:0\:dark,html.dark .sf-c-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-100))}html[data-theme='dark'] .sf-c-fuchsia\:10\:dark,html.dark .sf-c-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}html[data-theme='dark'] .sf-c-fuchsia\:20\:dark,html.dark .sf-c-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}html[data-theme='dark'] .sf-c-fuchsia\:30\:dark,html.dark .sf-c-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}html[data-theme='dark'] .sf-c-fuchsia\:40\:dark,html.dark .sf-c-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-60))}html[data-theme='dark'] .sf-c-fuchsia\:50\:dark,html.dark .sf-c-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-50))}html[data-theme='dark'] .sf-c-fuchsia\:60\:dark,html.dark .sf-c-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}html[data-theme='dark'] .sf-c-fuchsia\:70\:dark,html.dark .sf-c-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}html[data-theme='dark'] .sf-c-fuchsia\:80\:dark,html.dark .sf-c-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}html[data-theme='dark'] .sf-c-fuchsia\:90\:dark,html.dark .sf-c-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}html[data-theme='dark'] .sf-c-fuchsia\:100\:dark,html.dark .sf-c-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia,html.dark .sf-c-txt-fuchsia{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='dark'] .sf-c-txt-fuchsia\:0,html.dark .sf-c-txt-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia\:10,html.dark .sf-c-txt-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='dark'] .sf-c-txt-fuchsia\:20,html.dark .sf-c-txt-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='dark'] .sf-c-txt-fuchsia\:30,html.dark .sf-c-txt-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='dark'] .sf-c-txt-fuchsia\:40,html.dark .sf-c-txt-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='dark'] .sf-c-txt-fuchsia\:50,html.dark .sf-c-txt-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='dark'] .sf-c-txt-fuchsia\:60,html.dark .sf-c-txt-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='dark'] .sf-c-txt-fuchsia\:70,html.dark .sf-c-txt-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='dark'] .sf-c-txt-fuchsia\:80,html.dark .sf-c-txt-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='dark'] .sf-c-txt-fuchsia\:90,html.dark .sf-c-txt-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='dark'] .sf-c-txt-fuchsia\:100,html.dark .sf-c-txt-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-100))}html[data-theme='dark'] .sf-c-txt-fuchsia\:dark,html.dark .sf-c-txt-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='dark'] .sf-c-txt-fuchsia\:0\:dark,html.dark .sf-c-txt-fuchsia\:0\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia\:10\:dark,html.dark .sf-c-txt-fuchsia\:10\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-10))}html[data-theme='dark'] .sf-c-txt-fuchsia\:20\:dark,html.dark .sf-c-txt-fuchsia\:20\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-20))}html[data-theme='dark'] .sf-c-txt-fuchsia\:30\:dark,html.dark .sf-c-txt-fuchsia\:30\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-30))}html[data-theme='dark'] .sf-c-txt-fuchsia\:40\:dark,html.dark .sf-c-txt-fuchsia\:40\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-40))}html[data-theme='dark'] .sf-c-txt-fuchsia\:50\:dark,html.dark .sf-c-txt-fuchsia\:50\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-50))}html[data-theme='dark'] .sf-c-txt-fuchsia\:60\:dark,html.dark .sf-c-txt-fuchsia\:60\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-60))}html[data-theme='dark'] .sf-c-txt-fuchsia\:70\:dark,html.dark .sf-c-txt-fuchsia\:70\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-70))}html[data-theme='dark'] .sf-c-txt-fuchsia\:80\:dark,html.dark .sf-c-txt-fuchsia\:80\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-80))}html[data-theme='dark'] .sf-c-txt-fuchsia\:90\:dark,html.dark .sf-c-txt-fuchsia\:90\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-90))}html[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark,html.dark .sf-c-txt-fuchsia\:100\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-100))}html.var[data-theme='dark'] .sf-c-fuchsia,html.var.dark .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:0,html.var.dark .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-fuchsia\:10,html.var.dark .sf-c-fuchsia\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-fuchsia\:20,html.var.dark .sf-c-fuchsia\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-fuchsia\:30,html.var.dark .sf-c-fuchsia\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-fuchsia\:40,html.var.dark .sf-c-fuchsia\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-fuchsia\:50,html.var.dark .sf-c-fuchsia\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:60,html.var.dark .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-fuchsia\:70,html.var.dark .sf-c-fuchsia\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-fuchsia\:80,html.var.dark .sf-c-fuchsia\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-fuchsia\:90,html.var.dark .sf-c-fuchsia\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-fuchsia\:100,html.var.dark .sf-c-fuchsia\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-fuchsia\:dark,html.var.dark .sf-c-fuchsia\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:0\:dark,html.var.dark .sf-c-fuchsia\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-fuchsia\:10\:dark,html.var.dark .sf-c-fuchsia\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-fuchsia\:20\:dark,html.var.dark .sf-c-fuchsia\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-fuchsia\:30\:dark,html.var.dark .sf-c-fuchsia\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-fuchsia\:40\:dark,html.var.dark .sf-c-fuchsia\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-fuchsia\:50\:dark,html.var.dark .sf-c-fuchsia\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:60\:dark,html.var.dark .sf-c-fuchsia\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-fuchsia\:70\:dark,html.var.dark .sf-c-fuchsia\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-fuchsia\:80\:dark,html.var.dark .sf-c-fuchsia\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-fuchsia\:90\:dark,html.var.dark .sf-c-fuchsia\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-fuchsia\:100\:dark,html.var.dark .sf-c-fuchsia\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia,html.dark .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:0,html.dark .sf-c-txt-fuchsia\:0{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:10,html.dark .sf-c-txt-fuchsia\:10{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:20,html.dark .sf-c-txt-fuchsia\:20{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:30,html.dark .sf-c-txt-fuchsia\:30{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:40,html.dark .sf-c-txt-fuchsia\:40{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:50,html.dark .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:60,html.dark .sf-c-txt-fuchsia\:60{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:70,html.dark .sf-c-txt-fuchsia\:70{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:80,html.dark .sf-c-txt-fuchsia\:80{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:90,html.dark .sf-c-txt-fuchsia\:90{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100,html.dark .sf-c-txt-fuchsia\:100{color:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:dark,html.dark .sf-c-txt-fuchsia\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:0\:dark,html.dark .sf-c-txt-fuchsia\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:10\:dark,html.dark .sf-c-txt-fuchsia\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:20\:dark,html.dark .sf-c-txt-fuchsia\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:30\:dark,html.dark .sf-c-txt-fuchsia\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:40\:dark,html.dark .sf-c-txt-fuchsia\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:50\:dark,html.dark .sf-c-txt-fuchsia\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:60\:dark,html.dark .sf-c-txt-fuchsia\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:70\:dark,html.dark .sf-c-txt-fuchsia\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:80\:dark,html.dark .sf-c-txt-fuchsia\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:90\:dark,html.dark .sf-c-txt-fuchsia\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark,html.dark .sf-c-txt-fuchsia\:100\:dark{color:hsl(300,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-fuchsia,html.auto .sf-c-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia))}html[data-theme='auto'] .sf-c-fuchsia\:0,html.auto .sf-c-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-100))}html[data-theme='auto'] .sf-c-fuchsia\:10,html.auto .sf-c-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-90))}html[data-theme='auto'] .sf-c-fuchsia\:20,html.auto .sf-c-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-80))}html[data-theme='auto'] .sf-c-fuchsia\:30,html.auto .sf-c-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-70))}html[data-theme='auto'] .sf-c-fuchsia\:40,html.auto .sf-c-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-60))}html[data-theme='auto'] .sf-c-fuchsia\:50,html.auto .sf-c-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-50))}html[data-theme='auto'] .sf-c-fuchsia\:60,html.auto .sf-c-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-40))}html[data-theme='auto'] .sf-c-fuchsia\:70,html.auto .sf-c-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-30))}html[data-theme='auto'] .sf-c-fuchsia\:80,html.auto .sf-c-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-20))}html[data-theme='auto'] .sf-c-fuchsia\:90,html.auto .sf-c-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-10))}html[data-theme='auto'] .sf-c-fuchsia\:100,html.auto .sf-c-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-0))}html[data-theme='auto'] .sf-c-fuchsia\:dark,html.auto .sf-c-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}html[data-theme='auto'] .sf-c-fuchsia\:0\:dark,html.auto .sf-c-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-100))}html[data-theme='auto'] .sf-c-fuchsia\:10\:dark,html.auto .sf-c-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}html[data-theme='auto'] .sf-c-fuchsia\:20\:dark,html.auto .sf-c-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}html[data-theme='auto'] .sf-c-fuchsia\:30\:dark,html.auto .sf-c-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}html[data-theme='auto'] .sf-c-fuchsia\:40\:dark,html.auto .sf-c-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-60))}html[data-theme='auto'] .sf-c-fuchsia\:50\:dark,html.auto .sf-c-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-50))}html[data-theme='auto'] .sf-c-fuchsia\:60\:dark,html.auto .sf-c-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}html[data-theme='auto'] .sf-c-fuchsia\:70\:dark,html.auto .sf-c-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}html[data-theme='auto'] .sf-c-fuchsia\:80\:dark,html.auto .sf-c-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}html[data-theme='auto'] .sf-c-fuchsia\:90\:dark,html.auto .sf-c-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}html[data-theme='auto'] .sf-c-fuchsia\:100\:dark,html.auto .sf-c-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia,html.auto .sf-c-txt-fuchsia{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='auto'] .sf-c-txt-fuchsia\:0,html.auto .sf-c-txt-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia\:10,html.auto .sf-c-txt-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='auto'] .sf-c-txt-fuchsia\:20,html.auto .sf-c-txt-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='auto'] .sf-c-txt-fuchsia\:30,html.auto .sf-c-txt-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='auto'] .sf-c-txt-fuchsia\:40,html.auto .sf-c-txt-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='auto'] .sf-c-txt-fuchsia\:50,html.auto .sf-c-txt-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='auto'] .sf-c-txt-fuchsia\:60,html.auto .sf-c-txt-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='auto'] .sf-c-txt-fuchsia\:70,html.auto .sf-c-txt-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='auto'] .sf-c-txt-fuchsia\:80,html.auto .sf-c-txt-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='auto'] .sf-c-txt-fuchsia\:90,html.auto .sf-c-txt-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='auto'] .sf-c-txt-fuchsia\:100,html.auto .sf-c-txt-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-100))}html[data-theme='auto'] .sf-c-txt-fuchsia\:dark,html.auto .sf-c-txt-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark,html.auto .sf-c-txt-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark,html.auto .sf-c-txt-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark,html.auto .sf-c-txt-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark,html.auto .sf-c-txt-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark,html.auto .sf-c-txt-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark,html.auto .sf-c-txt-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark,html.auto .sf-c-txt-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark,html.auto .sf-c-txt-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark,html.auto .sf-c-txt-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark,html.auto .sf-c-txt-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark,html.auto .sf-c-txt-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-100))}html.var[data-theme='auto'] .sf-c-fuchsia,html.var.auto .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:0,html.var.auto .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-fuchsia\:10,html.var.auto .sf-c-fuchsia\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-fuchsia\:20,html.var.auto .sf-c-fuchsia\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-fuchsia\:30,html.var.auto .sf-c-fuchsia\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-fuchsia\:40,html.var.auto .sf-c-fuchsia\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-fuchsia\:50,html.var.auto .sf-c-fuchsia\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:60,html.var.auto .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-fuchsia\:70,html.var.auto .sf-c-fuchsia\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-fuchsia\:80,html.var.auto .sf-c-fuchsia\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-fuchsia\:90,html.var.auto .sf-c-fuchsia\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-fuchsia\:100,html.var.auto .sf-c-fuchsia\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-fuchsia\:dark,html.var.auto .sf-c-fuchsia\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:0\:dark,html.var.auto .sf-c-fuchsia\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-fuchsia\:10\:dark,html.var.auto .sf-c-fuchsia\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-fuchsia\:20\:dark,html.var.auto .sf-c-fuchsia\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-fuchsia\:30\:dark,html.var.auto .sf-c-fuchsia\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-fuchsia\:40\:dark,html.var.auto .sf-c-fuchsia\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-fuchsia\:50\:dark,html.var.auto .sf-c-fuchsia\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:60\:dark,html.var.auto .sf-c-fuchsia\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-fuchsia\:70\:dark,html.var.auto .sf-c-fuchsia\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-fuchsia\:80\:dark,html.var.auto .sf-c-fuchsia\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-fuchsia\:90\:dark,html.var.auto .sf-c-fuchsia\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-fuchsia\:100\:dark,html.var.auto .sf-c-fuchsia\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia,html.auto .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0,html.auto .sf-c-txt-fuchsia\:0{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10,html.auto .sf-c-txt-fuchsia\:10{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20,html.auto .sf-c-txt-fuchsia\:20{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30,html.auto .sf-c-txt-fuchsia\:30{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40,html.auto .sf-c-txt-fuchsia\:40{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50,html.auto .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60,html.auto .sf-c-txt-fuchsia\:60{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70,html.auto .sf-c-txt-fuchsia\:70{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80,html.auto .sf-c-txt-fuchsia\:80{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90,html.auto .sf-c-txt-fuchsia\:90{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100,html.auto .sf-c-txt-fuchsia\:100{color:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark,html.auto .sf-c-txt-fuchsia\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark,html.auto .sf-c-txt-fuchsia\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark,html.auto .sf-c-txt-fuchsia\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark,html.auto .sf-c-txt-fuchsia\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark,html.auto .sf-c-txt-fuchsia\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark,html.auto .sf-c-txt-fuchsia\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark,html.auto .sf-c-txt-fuchsia\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark,html.auto .sf-c-txt-fuchsia\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark,html.auto .sf-c-txt-fuchsia\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark,html.auto .sf-c-txt-fuchsia\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark,html.auto .sf-c-txt-fuchsia\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark,html.auto .sf-c-txt-fuchsia\:100\:dark{color:hsl(300,100%,100%)}}.sf-c-gray{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}.sf-c-gray\:0{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}.sf-c-gray\:10{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}.sf-c-gray\:20{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}.sf-c-gray\:30{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}.sf-c-gray\:40{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}.sf-c-gray\:50{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-50))}.sf-c-gray\:60{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-60))}.sf-c-gray\:70{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}.sf-c-gray\:80{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}.sf-c-gray\:90{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}.sf-c-gray\:100{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-100))}html.var .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-gray\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-gray\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-gray\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-gray\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-gray\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-gray\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-gray\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-gray\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-gray\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-gray{color:hsl(var(--sf-dark-c-txt-gray))}.sf-c-txt-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-100))}.sf-c-txt-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-90))}.sf-c-txt-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-80))}.sf-c-txt-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-70))}.sf-c-txt-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-60))}.sf-c-txt-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-50))}.sf-c-txt-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-40))}.sf-c-txt-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-30))}.sf-c-txt-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-20))}.sf-c-txt-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-10))}.sf-c-txt-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-0))}html.var .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var .sf-c-txt-gray\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-gray\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-gray\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-gray\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-gray\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-gray\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-gray\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-gray\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-gray\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-gray\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-gray,html.dark .sf-c-gray{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray))}html[data-theme='dark'] .sf-c-gray\:0,html.dark .sf-c-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-100))}html[data-theme='dark'] .sf-c-gray\:10,html.dark .sf-c-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-90))}html[data-theme='dark'] .sf-c-gray\:20,html.dark .sf-c-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-80))}html[data-theme='dark'] .sf-c-gray\:30,html.dark .sf-c-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-70))}html[data-theme='dark'] .sf-c-gray\:40,html.dark .sf-c-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-60))}html[data-theme='dark'] .sf-c-gray\:50,html.dark .sf-c-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-50))}html[data-theme='dark'] .sf-c-gray\:60,html.dark .sf-c-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-40))}html[data-theme='dark'] .sf-c-gray\:70,html.dark .sf-c-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-30))}html[data-theme='dark'] .sf-c-gray\:80,html.dark .sf-c-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-20))}html[data-theme='dark'] .sf-c-gray\:90,html.dark .sf-c-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-10))}html[data-theme='dark'] .sf-c-gray\:100,html.dark .sf-c-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-0))}html[data-theme='dark'] .sf-c-gray\:dark,html.dark .sf-c-gray\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}html[data-theme='dark'] .sf-c-gray\:0\:dark,html.dark .sf-c-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-100))}html[data-theme='dark'] .sf-c-gray\:10\:dark,html.dark .sf-c-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}html[data-theme='dark'] .sf-c-gray\:20\:dark,html.dark .sf-c-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}html[data-theme='dark'] .sf-c-gray\:30\:dark,html.dark .sf-c-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}html[data-theme='dark'] .sf-c-gray\:40\:dark,html.dark .sf-c-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-60))}html[data-theme='dark'] .sf-c-gray\:50\:dark,html.dark .sf-c-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-50))}html[data-theme='dark'] .sf-c-gray\:60\:dark,html.dark .sf-c-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}html[data-theme='dark'] .sf-c-gray\:70\:dark,html.dark .sf-c-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}html[data-theme='dark'] .sf-c-gray\:80\:dark,html.dark .sf-c-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}html[data-theme='dark'] .sf-c-gray\:90\:dark,html.dark .sf-c-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}html[data-theme='dark'] .sf-c-gray\:100\:dark,html.dark .sf-c-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}html[data-theme='dark'] .sf-c-txt-gray,html.dark .sf-c-txt-gray{color:hsl(var(--sf-c-txt-gray))}html[data-theme='dark'] .sf-c-txt-gray\:0,html.dark .sf-c-txt-gray\:0{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='dark'] .sf-c-txt-gray\:10,html.dark .sf-c-txt-gray\:10{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='dark'] .sf-c-txt-gray\:20,html.dark .sf-c-txt-gray\:20{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='dark'] .sf-c-txt-gray\:30,html.dark .sf-c-txt-gray\:30{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='dark'] .sf-c-txt-gray\:40,html.dark .sf-c-txt-gray\:40{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='dark'] .sf-c-txt-gray\:50,html.dark .sf-c-txt-gray\:50{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='dark'] .sf-c-txt-gray\:60,html.dark .sf-c-txt-gray\:60{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='dark'] .sf-c-txt-gray\:70,html.dark .sf-c-txt-gray\:70{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='dark'] .sf-c-txt-gray\:80,html.dark .sf-c-txt-gray\:80{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='dark'] .sf-c-txt-gray\:90,html.dark .sf-c-txt-gray\:90{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='dark'] .sf-c-txt-gray\:100,html.dark .sf-c-txt-gray\:100{color:hsl(var(--sf-c-txt-gray-100))}html[data-theme='dark'] .sf-c-txt-gray\:dark,html.dark .sf-c-txt-gray\:dark{color:hsl(var(--sf-c-txt-gray))}html[data-theme='dark'] .sf-c-txt-gray\:0\:dark,html.dark .sf-c-txt-gray\:0\:dark{color:hsl(var(--sf-dark-c-txt-gray-0))}html[data-theme='dark'] .sf-c-txt-gray\:10\:dark,html.dark .sf-c-txt-gray\:10\:dark{color:hsl(var(--sf-dark-c-txt-gray-10))}html[data-theme='dark'] .sf-c-txt-gray\:20\:dark,html.dark .sf-c-txt-gray\:20\:dark{color:hsl(var(--sf-dark-c-txt-gray-20))}html[data-theme='dark'] .sf-c-txt-gray\:30\:dark,html.dark .sf-c-txt-gray\:30\:dark{color:hsl(var(--sf-dark-c-txt-gray-30))}html[data-theme='dark'] .sf-c-txt-gray\:40\:dark,html.dark .sf-c-txt-gray\:40\:dark{color:hsl(var(--sf-dark-c-txt-gray-40))}html[data-theme='dark'] .sf-c-txt-gray\:50\:dark,html.dark .sf-c-txt-gray\:50\:dark{color:hsl(var(--sf-dark-c-txt-gray-50))}html[data-theme='dark'] .sf-c-txt-gray\:60\:dark,html.dark .sf-c-txt-gray\:60\:dark{color:hsl(var(--sf-dark-c-txt-gray-60))}html[data-theme='dark'] .sf-c-txt-gray\:70\:dark,html.dark .sf-c-txt-gray\:70\:dark{color:hsl(var(--sf-dark-c-txt-gray-70))}html[data-theme='dark'] .sf-c-txt-gray\:80\:dark,html.dark .sf-c-txt-gray\:80\:dark{color:hsl(var(--sf-dark-c-txt-gray-80))}html[data-theme='dark'] .sf-c-txt-gray\:90\:dark,html.dark .sf-c-txt-gray\:90\:dark{color:hsl(var(--sf-dark-c-txt-gray-90))}html[data-theme='dark'] .sf-c-txt-gray\:100\:dark,html.dark .sf-c-txt-gray\:100\:dark{color:hsl(var(--sf-dark-c-txt-gray-100))}html.var[data-theme='dark'] .sf-c-gray,html.var.dark .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:0,html.var.dark .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-gray\:10,html.var.dark .sf-c-gray\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-gray\:20,html.var.dark .sf-c-gray\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-gray\:30,html.var.dark .sf-c-gray\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-gray\:40,html.var.dark .sf-c-gray\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-gray\:50,html.var.dark .sf-c-gray\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:60,html.var.dark .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-gray\:70,html.var.dark .sf-c-gray\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-gray\:80,html.var.dark .sf-c-gray\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-gray\:90,html.var.dark .sf-c-gray\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-gray\:100,html.var.dark .sf-c-gray\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-gray\:dark,html.var.dark .sf-c-gray\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:0\:dark,html.var.dark .sf-c-gray\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-gray\:10\:dark,html.var.dark .sf-c-gray\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-gray\:20\:dark,html.var.dark .sf-c-gray\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-gray\:30\:dark,html.var.dark .sf-c-gray\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-gray\:40\:dark,html.var.dark .sf-c-gray\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-gray\:50\:dark,html.var.dark .sf-c-gray\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:60\:dark,html.var.dark .sf-c-gray\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-gray\:70\:dark,html.var.dark .sf-c-gray\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-gray\:80\:dark,html.var.dark .sf-c-gray\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-gray\:90\:dark,html.var.dark .sf-c-gray\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-gray\:100\:dark,html.var.dark .sf-c-gray\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray,html.dark .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:0,html.dark .sf-c-txt-gray\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray\:10,html.dark .sf-c-txt-gray\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-gray\:20,html.dark .sf-c-txt-gray\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-gray\:30,html.dark .sf-c-txt-gray\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-gray\:40,html.dark .sf-c-txt-gray\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-gray\:50,html.dark .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:60,html.dark .sf-c-txt-gray\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-gray\:70,html.dark .sf-c-txt-gray\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-gray\:80,html.dark .sf-c-txt-gray\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-gray\:90,html.dark .sf-c-txt-gray\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-gray\:100,html.dark .sf-c-txt-gray\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-gray\:dark,html.dark .sf-c-txt-gray\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:0\:dark,html.dark .sf-c-txt-gray\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray\:10\:dark,html.dark .sf-c-txt-gray\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-gray\:20\:dark,html.dark .sf-c-txt-gray\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-gray\:30\:dark,html.dark .sf-c-txt-gray\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-gray\:40\:dark,html.dark .sf-c-txt-gray\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-gray\:50\:dark,html.dark .sf-c-txt-gray\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:60\:dark,html.dark .sf-c-txt-gray\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-gray\:70\:dark,html.dark .sf-c-txt-gray\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-gray\:80\:dark,html.dark .sf-c-txt-gray\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-gray\:90\:dark,html.dark .sf-c-txt-gray\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-gray\:100\:dark,html.dark .sf-c-txt-gray\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-gray,html.auto .sf-c-gray{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray))}html[data-theme='auto'] .sf-c-gray\:0,html.auto .sf-c-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-100))}html[data-theme='auto'] .sf-c-gray\:10,html.auto .sf-c-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-90))}html[data-theme='auto'] .sf-c-gray\:20,html.auto .sf-c-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-80))}html[data-theme='auto'] .sf-c-gray\:30,html.auto .sf-c-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-70))}html[data-theme='auto'] .sf-c-gray\:40,html.auto .sf-c-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-60))}html[data-theme='auto'] .sf-c-gray\:50,html.auto .sf-c-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-50))}html[data-theme='auto'] .sf-c-gray\:60,html.auto .sf-c-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-40))}html[data-theme='auto'] .sf-c-gray\:70,html.auto .sf-c-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-30))}html[data-theme='auto'] .sf-c-gray\:80,html.auto .sf-c-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-20))}html[data-theme='auto'] .sf-c-gray\:90,html.auto .sf-c-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-10))}html[data-theme='auto'] .sf-c-gray\:100,html.auto .sf-c-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-0))}html[data-theme='auto'] .sf-c-gray\:dark,html.auto .sf-c-gray\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}html[data-theme='auto'] .sf-c-gray\:0\:dark,html.auto .sf-c-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-100))}html[data-theme='auto'] .sf-c-gray\:10\:dark,html.auto .sf-c-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}html[data-theme='auto'] .sf-c-gray\:20\:dark,html.auto .sf-c-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}html[data-theme='auto'] .sf-c-gray\:30\:dark,html.auto .sf-c-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}html[data-theme='auto'] .sf-c-gray\:40\:dark,html.auto .sf-c-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-60))}html[data-theme='auto'] .sf-c-gray\:50\:dark,html.auto .sf-c-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-50))}html[data-theme='auto'] .sf-c-gray\:60\:dark,html.auto .sf-c-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}html[data-theme='auto'] .sf-c-gray\:70\:dark,html.auto .sf-c-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}html[data-theme='auto'] .sf-c-gray\:80\:dark,html.auto .sf-c-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}html[data-theme='auto'] .sf-c-gray\:90\:dark,html.auto .sf-c-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}html[data-theme='auto'] .sf-c-gray\:100\:dark,html.auto .sf-c-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}html[data-theme='auto'] .sf-c-txt-gray,html.auto .sf-c-txt-gray{color:hsl(var(--sf-c-txt-gray))}html[data-theme='auto'] .sf-c-txt-gray\:0,html.auto .sf-c-txt-gray\:0{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='auto'] .sf-c-txt-gray\:10,html.auto .sf-c-txt-gray\:10{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='auto'] .sf-c-txt-gray\:20,html.auto .sf-c-txt-gray\:20{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='auto'] .sf-c-txt-gray\:30,html.auto .sf-c-txt-gray\:30{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='auto'] .sf-c-txt-gray\:40,html.auto .sf-c-txt-gray\:40{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='auto'] .sf-c-txt-gray\:50,html.auto .sf-c-txt-gray\:50{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='auto'] .sf-c-txt-gray\:60,html.auto .sf-c-txt-gray\:60{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='auto'] .sf-c-txt-gray\:70,html.auto .sf-c-txt-gray\:70{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='auto'] .sf-c-txt-gray\:80,html.auto .sf-c-txt-gray\:80{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='auto'] .sf-c-txt-gray\:90,html.auto .sf-c-txt-gray\:90{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='auto'] .sf-c-txt-gray\:100,html.auto .sf-c-txt-gray\:100{color:hsl(var(--sf-c-txt-gray-100))}html[data-theme='auto'] .sf-c-txt-gray\:dark,html.auto .sf-c-txt-gray\:dark{color:hsl(var(--sf-c-txt-gray))}html[data-theme='auto'] .sf-c-txt-gray\:0\:dark,html.auto .sf-c-txt-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='auto'] .sf-c-txt-gray\:10\:dark,html.auto .sf-c-txt-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='auto'] .sf-c-txt-gray\:20\:dark,html.auto .sf-c-txt-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='auto'] .sf-c-txt-gray\:30\:dark,html.auto .sf-c-txt-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='auto'] .sf-c-txt-gray\:40\:dark,html.auto .sf-c-txt-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='auto'] .sf-c-txt-gray\:50\:dark,html.auto .sf-c-txt-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='auto'] .sf-c-txt-gray\:60\:dark,html.auto .sf-c-txt-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='auto'] .sf-c-txt-gray\:70\:dark,html.auto .sf-c-txt-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='auto'] .sf-c-txt-gray\:80\:dark,html.auto .sf-c-txt-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='auto'] .sf-c-txt-gray\:90\:dark,html.auto .sf-c-txt-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='auto'] .sf-c-txt-gray\:100\:dark,html.auto .sf-c-txt-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-100))}html.var[data-theme='auto'] .sf-c-gray,html.var.auto .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:0,html.var.auto .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-gray\:10,html.var.auto .sf-c-gray\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-gray\:20,html.var.auto .sf-c-gray\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-gray\:30,html.var.auto .sf-c-gray\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-gray\:40,html.var.auto .sf-c-gray\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-gray\:50,html.var.auto .sf-c-gray\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:60,html.var.auto .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-gray\:70,html.var.auto .sf-c-gray\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-gray\:80,html.var.auto .sf-c-gray\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-gray\:90,html.var.auto .sf-c-gray\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-gray\:100,html.var.auto .sf-c-gray\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-gray\:dark,html.var.auto .sf-c-gray\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:0\:dark,html.var.auto .sf-c-gray\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-gray\:10\:dark,html.var.auto .sf-c-gray\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-gray\:20\:dark,html.var.auto .sf-c-gray\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-gray\:30\:dark,html.var.auto .sf-c-gray\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-gray\:40\:dark,html.var.auto .sf-c-gray\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-gray\:50\:dark,html.var.auto .sf-c-gray\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:60\:dark,html.var.auto .sf-c-gray\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-gray\:70\:dark,html.var.auto .sf-c-gray\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-gray\:80\:dark,html.var.auto .sf-c-gray\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-gray\:90\:dark,html.var.auto .sf-c-gray\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-gray\:100\:dark,html.var.auto .sf-c-gray\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray,html.auto .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:0,html.auto .sf-c-txt-gray\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray\:10,html.auto .sf-c-txt-gray\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-gray\:20,html.auto .sf-c-txt-gray\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-gray\:30,html.auto .sf-c-txt-gray\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-gray\:40,html.auto .sf-c-txt-gray\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-gray\:50,html.auto .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:60,html.auto .sf-c-txt-gray\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-gray\:70,html.auto .sf-c-txt-gray\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-gray\:80,html.auto .sf-c-txt-gray\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-gray\:90,html.auto .sf-c-txt-gray\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-gray\:100,html.auto .sf-c-txt-gray\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-gray\:dark,html.auto .sf-c-txt-gray\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark,html.auto .sf-c-txt-gray\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark,html.auto .sf-c-txt-gray\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark,html.auto .sf-c-txt-gray\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark,html.auto .sf-c-txt-gray\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark,html.auto .sf-c-txt-gray\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark,html.auto .sf-c-txt-gray\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark,html.auto .sf-c-txt-gray\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark,html.auto .sf-c-txt-gray\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark,html.auto .sf-c-txt-gray\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark,html.auto .sf-c-txt-gray\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark,html.auto .sf-c-txt-gray\:100\:dark{color:hsl(0,0%,100%)}}.sf-c-green{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green))}.sf-c-green\:0{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}.sf-c-green\:10{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}.sf-c-green\:20{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}.sf-c-green\:30{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-30))}.sf-c-green\:40{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-40))}.sf-c-green\:50{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}.sf-c-green\:60{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}.sf-c-green\:70{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}.sf-c-green\:80{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}.sf-c-green\:90{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}.sf-c-green\:100{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-100))}html.var .sf-c-green{color:hsl(120,100%,90%);background:hsl(120,100%,25%)}html.var .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-green\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-green\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-green\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-green\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-green\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-green\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-green\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-green{color:hsl(var(--sf-dark-c-txt-green))}.sf-c-txt-green\:0{color:hsl(var(--sf-dark-c-txt-green-100))}.sf-c-txt-green\:10{color:hsl(var(--sf-dark-c-txt-green-90))}.sf-c-txt-green\:20{color:hsl(var(--sf-dark-c-txt-green-80))}.sf-c-txt-green\:30{color:hsl(var(--sf-dark-c-txt-green-70))}.sf-c-txt-green\:40{color:hsl(var(--sf-dark-c-txt-green-60))}.sf-c-txt-green\:50{color:hsl(var(--sf-dark-c-txt-green-50))}.sf-c-txt-green\:60{color:hsl(var(--sf-dark-c-txt-green-40))}.sf-c-txt-green\:70{color:hsl(var(--sf-dark-c-txt-green-30))}.sf-c-txt-green\:80{color:hsl(var(--sf-dark-c-txt-green-20))}.sf-c-txt-green\:90{color:hsl(var(--sf-dark-c-txt-green-10))}.sf-c-txt-green\:100{color:hsl(var(--sf-dark-c-txt-green-0))}html.var .sf-c-txt-green{color:hsl(120,100%,75%)}html.var .sf-c-txt-green\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-green\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-green\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-green\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-green\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-green\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-green\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-green\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-green\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-green\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-green,html.dark .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='dark'] .sf-c-green\:0,html.dark .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='dark'] .sf-c-green\:10,html.dark .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='dark'] .sf-c-green\:20,html.dark .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='dark'] .sf-c-green\:30,html.dark .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='dark'] .sf-c-green\:40,html.dark .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='dark'] .sf-c-green\:50,html.dark .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='dark'] .sf-c-green\:60,html.dark .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='dark'] .sf-c-green\:70,html.dark .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='dark'] .sf-c-green\:80,html.dark .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='dark'] .sf-c-green\:90,html.dark .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='dark'] .sf-c-green\:100,html.dark .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='dark'] .sf-c-green\:dark,html.dark .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='dark'] .sf-c-green\:0\:dark,html.dark .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='dark'] .sf-c-green\:10\:dark,html.dark .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='dark'] .sf-c-green\:20\:dark,html.dark .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='dark'] .sf-c-green\:30\:dark,html.dark .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='dark'] .sf-c-green\:40\:dark,html.dark .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='dark'] .sf-c-green\:50\:dark,html.dark .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='dark'] .sf-c-green\:60\:dark,html.dark .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='dark'] .sf-c-green\:70\:dark,html.dark .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='dark'] .sf-c-green\:80\:dark,html.dark .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='dark'] .sf-c-green\:90\:dark,html.dark .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='dark'] .sf-c-green\:100\:dark,html.dark .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-dark-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-dark-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-dark-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-dark-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-dark-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-dark-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-dark-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-dark-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-dark-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-dark-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-dark-c-txt-green-100))}html.var[data-theme='dark'] .sf-c-green,html.var.dark .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0,html.var.dark .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10,html.var.dark .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20,html.var.dark .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30,html.var.dark .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40,html.var.dark .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50,html.var.dark .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60,html.var.dark .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70,html.var.dark .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80,html.var.dark .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90,html.var.dark .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100,html.var.dark .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-green\:dark,html.var.dark .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0\:dark,html.var.dark .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10\:dark,html.var.dark .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20\:dark,html.var.dark .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30\:dark,html.var.dark .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40\:dark,html.var.dark .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50\:dark,html.var.dark .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60\:dark,html.var.dark .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70\:dark,html.var.dark .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80\:dark,html.var.dark .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90\:dark,html.var.dark .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100\:dark,html.var.dark .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-green,html.auto .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='auto'] .sf-c-green\:0,html.auto .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='auto'] .sf-c-green\:10,html.auto .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='auto'] .sf-c-green\:20,html.auto .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='auto'] .sf-c-green\:30,html.auto .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='auto'] .sf-c-green\:40,html.auto .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='auto'] .sf-c-green\:50,html.auto .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='auto'] .sf-c-green\:60,html.auto .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='auto'] .sf-c-green\:70,html.auto .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='auto'] .sf-c-green\:80,html.auto .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='auto'] .sf-c-green\:90,html.auto .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='auto'] .sf-c-green\:100,html.auto .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='auto'] .sf-c-green\:dark,html.auto .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='auto'] .sf-c-green\:0\:dark,html.auto .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='auto'] .sf-c-green\:10\:dark,html.auto .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='auto'] .sf-c-green\:20\:dark,html.auto .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='auto'] .sf-c-green\:30\:dark,html.auto .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='auto'] .sf-c-green\:40\:dark,html.auto .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='auto'] .sf-c-green\:50\:dark,html.auto .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='auto'] .sf-c-green\:60\:dark,html.auto .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='auto'] .sf-c-green\:70\:dark,html.auto .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='auto'] .sf-c-green\:80\:dark,html.auto .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='auto'] .sf-c-green\:90\:dark,html.auto .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='auto'] .sf-c-green\:100\:dark,html.auto .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-c-txt-green-100))}html.var[data-theme='auto'] .sf-c-green,html.var.auto .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0,html.var.auto .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10,html.var.auto .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20,html.var.auto .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30,html.var.auto .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40,html.var.auto .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50,html.var.auto .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60,html.var.auto .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70,html.var.auto .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80,html.var.auto .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90,html.var.auto .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100,html.var.auto .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-green\:dark,html.var.auto .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0\:dark,html.var.auto .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10\:dark,html.var.auto .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20\:dark,html.var.auto .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30\:dark,html.var.auto .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40\:dark,html.var.auto .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50\:dark,html.var.auto .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60\:dark,html.var.auto .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70\:dark,html.var.auto .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80\:dark,html.var.auto .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90\:dark,html.var.auto .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100\:dark,html.var.auto .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}}.sf-c-lime{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}.sf-c-lime\:0{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}.sf-c-lime\:10{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}.sf-c-lime\:20{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}.sf-c-lime\:30{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-30))}.sf-c-lime\:40{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-40))}.sf-c-lime\:50{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}.sf-c-lime\:60{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}.sf-c-lime\:70{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}.sf-c-lime\:80{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}.sf-c-lime\:90{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}.sf-c-lime\:100{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-100))}html.var .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-lime\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-lime\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-lime\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-lime\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-lime\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-lime\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-lime\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-lime{color:hsl(var(--sf-dark-c-txt-lime))}.sf-c-txt-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-100))}.sf-c-txt-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-90))}.sf-c-txt-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-80))}.sf-c-txt-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-70))}.sf-c-txt-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-60))}.sf-c-txt-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-50))}.sf-c-txt-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-40))}.sf-c-txt-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-30))}.sf-c-txt-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-20))}.sf-c-txt-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-10))}.sf-c-txt-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-0))}html.var .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var .sf-c-txt-lime\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-lime\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-lime\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-lime\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-lime\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-lime\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-lime\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-lime\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-lime\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-lime\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-lime,html.dark .sf-c-lime{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime))}html[data-theme='dark'] .sf-c-lime\:0,html.dark .sf-c-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-100))}html[data-theme='dark'] .sf-c-lime\:10,html.dark .sf-c-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-90))}html[data-theme='dark'] .sf-c-lime\:20,html.dark .sf-c-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-80))}html[data-theme='dark'] .sf-c-lime\:30,html.dark .sf-c-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-70))}html[data-theme='dark'] .sf-c-lime\:40,html.dark .sf-c-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-60))}html[data-theme='dark'] .sf-c-lime\:50,html.dark .sf-c-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-50))}html[data-theme='dark'] .sf-c-lime\:60,html.dark .sf-c-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-40))}html[data-theme='dark'] .sf-c-lime\:70,html.dark .sf-c-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-30))}html[data-theme='dark'] .sf-c-lime\:80,html.dark .sf-c-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-20))}html[data-theme='dark'] .sf-c-lime\:90,html.dark .sf-c-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-10))}html[data-theme='dark'] .sf-c-lime\:100,html.dark .sf-c-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-0))}html[data-theme='dark'] .sf-c-lime\:dark,html.dark .sf-c-lime\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}html[data-theme='dark'] .sf-c-lime\:0\:dark,html.dark .sf-c-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-100))}html[data-theme='dark'] .sf-c-lime\:10\:dark,html.dark .sf-c-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}html[data-theme='dark'] .sf-c-lime\:20\:dark,html.dark .sf-c-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}html[data-theme='dark'] .sf-c-lime\:30\:dark,html.dark .sf-c-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}html[data-theme='dark'] .sf-c-lime\:40\:dark,html.dark .sf-c-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}html[data-theme='dark'] .sf-c-lime\:50\:dark,html.dark .sf-c-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}html[data-theme='dark'] .sf-c-lime\:60\:dark,html.dark .sf-c-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-40))}html[data-theme='dark'] .sf-c-lime\:70\:dark,html.dark .sf-c-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-30))}html[data-theme='dark'] .sf-c-lime\:80\:dark,html.dark .sf-c-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}html[data-theme='dark'] .sf-c-lime\:90\:dark,html.dark .sf-c-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}html[data-theme='dark'] .sf-c-lime\:100\:dark,html.dark .sf-c-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}html[data-theme='dark'] .sf-c-txt-lime,html.dark .sf-c-txt-lime{color:hsl(var(--sf-c-txt-lime))}html[data-theme='dark'] .sf-c-txt-lime\:0,html.dark .sf-c-txt-lime\:0{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='dark'] .sf-c-txt-lime\:10,html.dark .sf-c-txt-lime\:10{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='dark'] .sf-c-txt-lime\:20,html.dark .sf-c-txt-lime\:20{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='dark'] .sf-c-txt-lime\:30,html.dark .sf-c-txt-lime\:30{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='dark'] .sf-c-txt-lime\:40,html.dark .sf-c-txt-lime\:40{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='dark'] .sf-c-txt-lime\:50,html.dark .sf-c-txt-lime\:50{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='dark'] .sf-c-txt-lime\:60,html.dark .sf-c-txt-lime\:60{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='dark'] .sf-c-txt-lime\:70,html.dark .sf-c-txt-lime\:70{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='dark'] .sf-c-txt-lime\:80,html.dark .sf-c-txt-lime\:80{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='dark'] .sf-c-txt-lime\:90,html.dark .sf-c-txt-lime\:90{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='dark'] .sf-c-txt-lime\:100,html.dark .sf-c-txt-lime\:100{color:hsl(var(--sf-c-txt-lime-100))}html[data-theme='dark'] .sf-c-txt-lime\:dark,html.dark .sf-c-txt-lime\:dark{color:hsl(var(--sf-c-txt-lime))}html[data-theme='dark'] .sf-c-txt-lime\:0\:dark,html.dark .sf-c-txt-lime\:0\:dark{color:hsl(var(--sf-dark-c-txt-lime-0))}html[data-theme='dark'] .sf-c-txt-lime\:10\:dark,html.dark .sf-c-txt-lime\:10\:dark{color:hsl(var(--sf-dark-c-txt-lime-10))}html[data-theme='dark'] .sf-c-txt-lime\:20\:dark,html.dark .sf-c-txt-lime\:20\:dark{color:hsl(var(--sf-dark-c-txt-lime-20))}html[data-theme='dark'] .sf-c-txt-lime\:30\:dark,html.dark .sf-c-txt-lime\:30\:dark{color:hsl(var(--sf-dark-c-txt-lime-30))}html[data-theme='dark'] .sf-c-txt-lime\:40\:dark,html.dark .sf-c-txt-lime\:40\:dark{color:hsl(var(--sf-dark-c-txt-lime-40))}html[data-theme='dark'] .sf-c-txt-lime\:50\:dark,html.dark .sf-c-txt-lime\:50\:dark{color:hsl(var(--sf-dark-c-txt-lime-50))}html[data-theme='dark'] .sf-c-txt-lime\:60\:dark,html.dark .sf-c-txt-lime\:60\:dark{color:hsl(var(--sf-dark-c-txt-lime-60))}html[data-theme='dark'] .sf-c-txt-lime\:70\:dark,html.dark .sf-c-txt-lime\:70\:dark{color:hsl(var(--sf-dark-c-txt-lime-70))}html[data-theme='dark'] .sf-c-txt-lime\:80\:dark,html.dark .sf-c-txt-lime\:80\:dark{color:hsl(var(--sf-dark-c-txt-lime-80))}html[data-theme='dark'] .sf-c-txt-lime\:90\:dark,html.dark .sf-c-txt-lime\:90\:dark{color:hsl(var(--sf-dark-c-txt-lime-90))}html[data-theme='dark'] .sf-c-txt-lime\:100\:dark,html.dark .sf-c-txt-lime\:100\:dark{color:hsl(var(--sf-dark-c-txt-lime-100))}html.var[data-theme='dark'] .sf-c-lime,html.var.dark .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:0,html.var.dark .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-lime\:10,html.var.dark .sf-c-lime\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-lime\:20,html.var.dark .sf-c-lime\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-lime\:30,html.var.dark .sf-c-lime\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-lime\:40,html.var.dark .sf-c-lime\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-lime\:50,html.var.dark .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:60,html.var.dark .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-lime\:70,html.var.dark .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-lime\:80,html.var.dark .sf-c-lime\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-lime\:90,html.var.dark .sf-c-lime\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-lime\:100,html.var.dark .sf-c-lime\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-lime\:dark,html.var.dark .sf-c-lime\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:0\:dark,html.var.dark .sf-c-lime\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-lime\:10\:dark,html.var.dark .sf-c-lime\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-lime\:20\:dark,html.var.dark .sf-c-lime\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-lime\:30\:dark,html.var.dark .sf-c-lime\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-lime\:40\:dark,html.var.dark .sf-c-lime\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-lime\:50\:dark,html.var.dark .sf-c-lime\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:60\:dark,html.var.dark .sf-c-lime\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-lime\:70\:dark,html.var.dark .sf-c-lime\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-lime\:80\:dark,html.var.dark .sf-c-lime\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-lime\:90\:dark,html.var.dark .sf-c-lime\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-lime\:100\:dark,html.var.dark .sf-c-lime\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime,html.dark .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:0,html.dark .sf-c-txt-lime\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime\:10,html.dark .sf-c-txt-lime\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-lime\:20,html.dark .sf-c-txt-lime\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-lime\:30,html.dark .sf-c-txt-lime\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-lime\:40,html.dark .sf-c-txt-lime\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-lime\:50,html.dark .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:60,html.dark .sf-c-txt-lime\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-lime\:70,html.dark .sf-c-txt-lime\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-lime\:80,html.dark .sf-c-txt-lime\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-lime\:90,html.dark .sf-c-txt-lime\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-lime\:100,html.dark .sf-c-txt-lime\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-lime\:dark,html.dark .sf-c-txt-lime\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:0\:dark,html.dark .sf-c-txt-lime\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime\:10\:dark,html.dark .sf-c-txt-lime\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-lime\:20\:dark,html.dark .sf-c-txt-lime\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-lime\:30\:dark,html.dark .sf-c-txt-lime\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-lime\:40\:dark,html.dark .sf-c-txt-lime\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-lime\:50\:dark,html.dark .sf-c-txt-lime\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:60\:dark,html.dark .sf-c-txt-lime\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-lime\:70\:dark,html.dark .sf-c-txt-lime\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-lime\:80\:dark,html.dark .sf-c-txt-lime\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-lime\:90\:dark,html.dark .sf-c-txt-lime\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-lime\:100\:dark,html.dark .sf-c-txt-lime\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-lime,html.auto .sf-c-lime{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime))}html[data-theme='auto'] .sf-c-lime\:0,html.auto .sf-c-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-100))}html[data-theme='auto'] .sf-c-lime\:10,html.auto .sf-c-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-90))}html[data-theme='auto'] .sf-c-lime\:20,html.auto .sf-c-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-80))}html[data-theme='auto'] .sf-c-lime\:30,html.auto .sf-c-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-70))}html[data-theme='auto'] .sf-c-lime\:40,html.auto .sf-c-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-60))}html[data-theme='auto'] .sf-c-lime\:50,html.auto .sf-c-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-50))}html[data-theme='auto'] .sf-c-lime\:60,html.auto .sf-c-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-40))}html[data-theme='auto'] .sf-c-lime\:70,html.auto .sf-c-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-30))}html[data-theme='auto'] .sf-c-lime\:80,html.auto .sf-c-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-20))}html[data-theme='auto'] .sf-c-lime\:90,html.auto .sf-c-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-10))}html[data-theme='auto'] .sf-c-lime\:100,html.auto .sf-c-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-0))}html[data-theme='auto'] .sf-c-lime\:dark,html.auto .sf-c-lime\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}html[data-theme='auto'] .sf-c-lime\:0\:dark,html.auto .sf-c-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-100))}html[data-theme='auto'] .sf-c-lime\:10\:dark,html.auto .sf-c-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}html[data-theme='auto'] .sf-c-lime\:20\:dark,html.auto .sf-c-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}html[data-theme='auto'] .sf-c-lime\:30\:dark,html.auto .sf-c-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}html[data-theme='auto'] .sf-c-lime\:40\:dark,html.auto .sf-c-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}html[data-theme='auto'] .sf-c-lime\:50\:dark,html.auto .sf-c-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}html[data-theme='auto'] .sf-c-lime\:60\:dark,html.auto .sf-c-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-40))}html[data-theme='auto'] .sf-c-lime\:70\:dark,html.auto .sf-c-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-30))}html[data-theme='auto'] .sf-c-lime\:80\:dark,html.auto .sf-c-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}html[data-theme='auto'] .sf-c-lime\:90\:dark,html.auto .sf-c-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}html[data-theme='auto'] .sf-c-lime\:100\:dark,html.auto .sf-c-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}html[data-theme='auto'] .sf-c-txt-lime,html.auto .sf-c-txt-lime{color:hsl(var(--sf-c-txt-lime))}html[data-theme='auto'] .sf-c-txt-lime\:0,html.auto .sf-c-txt-lime\:0{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='auto'] .sf-c-txt-lime\:10,html.auto .sf-c-txt-lime\:10{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='auto'] .sf-c-txt-lime\:20,html.auto .sf-c-txt-lime\:20{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='auto'] .sf-c-txt-lime\:30,html.auto .sf-c-txt-lime\:30{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='auto'] .sf-c-txt-lime\:40,html.auto .sf-c-txt-lime\:40{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='auto'] .sf-c-txt-lime\:50,html.auto .sf-c-txt-lime\:50{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='auto'] .sf-c-txt-lime\:60,html.auto .sf-c-txt-lime\:60{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='auto'] .sf-c-txt-lime\:70,html.auto .sf-c-txt-lime\:70{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='auto'] .sf-c-txt-lime\:80,html.auto .sf-c-txt-lime\:80{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='auto'] .sf-c-txt-lime\:90,html.auto .sf-c-txt-lime\:90{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='auto'] .sf-c-txt-lime\:100,html.auto .sf-c-txt-lime\:100{color:hsl(var(--sf-c-txt-lime-100))}html[data-theme='auto'] .sf-c-txt-lime\:dark,html.auto .sf-c-txt-lime\:dark{color:hsl(var(--sf-c-txt-lime))}html[data-theme='auto'] .sf-c-txt-lime\:0\:dark,html.auto .sf-c-txt-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='auto'] .sf-c-txt-lime\:10\:dark,html.auto .sf-c-txt-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='auto'] .sf-c-txt-lime\:20\:dark,html.auto .sf-c-txt-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='auto'] .sf-c-txt-lime\:30\:dark,html.auto .sf-c-txt-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='auto'] .sf-c-txt-lime\:40\:dark,html.auto .sf-c-txt-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='auto'] .sf-c-txt-lime\:50\:dark,html.auto .sf-c-txt-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='auto'] .sf-c-txt-lime\:60\:dark,html.auto .sf-c-txt-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='auto'] .sf-c-txt-lime\:70\:dark,html.auto .sf-c-txt-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='auto'] .sf-c-txt-lime\:80\:dark,html.auto .sf-c-txt-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='auto'] .sf-c-txt-lime\:90\:dark,html.auto .sf-c-txt-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='auto'] .sf-c-txt-lime\:100\:dark,html.auto .sf-c-txt-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-100))}html.var[data-theme='auto'] .sf-c-lime,html.var.auto .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:0,html.var.auto .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-lime\:10,html.var.auto .sf-c-lime\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-lime\:20,html.var.auto .sf-c-lime\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-lime\:30,html.var.auto .sf-c-lime\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-lime\:40,html.var.auto .sf-c-lime\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-lime\:50,html.var.auto .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:60,html.var.auto .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-lime\:70,html.var.auto .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-lime\:80,html.var.auto .sf-c-lime\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-lime\:90,html.var.auto .sf-c-lime\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-lime\:100,html.var.auto .sf-c-lime\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-lime\:dark,html.var.auto .sf-c-lime\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:0\:dark,html.var.auto .sf-c-lime\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-lime\:10\:dark,html.var.auto .sf-c-lime\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-lime\:20\:dark,html.var.auto .sf-c-lime\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-lime\:30\:dark,html.var.auto .sf-c-lime\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-lime\:40\:dark,html.var.auto .sf-c-lime\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-lime\:50\:dark,html.var.auto .sf-c-lime\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:60\:dark,html.var.auto .sf-c-lime\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-lime\:70\:dark,html.var.auto .sf-c-lime\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-lime\:80\:dark,html.var.auto .sf-c-lime\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-lime\:90\:dark,html.var.auto .sf-c-lime\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-lime\:100\:dark,html.var.auto .sf-c-lime\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime,html.auto .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:0,html.auto .sf-c-txt-lime\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime\:10,html.auto .sf-c-txt-lime\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-lime\:20,html.auto .sf-c-txt-lime\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-lime\:30,html.auto .sf-c-txt-lime\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-lime\:40,html.auto .sf-c-txt-lime\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-lime\:50,html.auto .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:60,html.auto .sf-c-txt-lime\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-lime\:70,html.auto .sf-c-txt-lime\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-lime\:80,html.auto .sf-c-txt-lime\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-lime\:90,html.auto .sf-c-txt-lime\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-lime\:100,html.auto .sf-c-txt-lime\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-lime\:dark,html.auto .sf-c-txt-lime\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark,html.auto .sf-c-txt-lime\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark,html.auto .sf-c-txt-lime\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark,html.auto .sf-c-txt-lime\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark,html.auto .sf-c-txt-lime\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark,html.auto .sf-c-txt-lime\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark,html.auto .sf-c-txt-lime\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark,html.auto .sf-c-txt-lime\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark,html.auto .sf-c-txt-lime\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark,html.auto .sf-c-txt-lime\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark,html.auto .sf-c-txt-lime\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark,html.auto .sf-c-txt-lime\:100\:dark{color:hsl(120,100%,100%)}}.sf-c-maroon{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon))}.sf-c-maroon\:0{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}.sf-c-maroon\:10{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}.sf-c-maroon\:20{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}.sf-c-maroon\:30{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}.sf-c-maroon\:40{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}.sf-c-maroon\:50{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}.sf-c-maroon\:60{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-60))}.sf-c-maroon\:70{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-70))}.sf-c-maroon\:80{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}.sf-c-maroon\:90{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}.sf-c-maroon\:100{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-100))}html.var .sf-c-maroon{color:hsl(0,100%,90%);background:hsl(0,100%,25%)}html.var .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-maroon\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-maroon\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-maroon\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-maroon\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-maroon\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-maroon\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-maroon\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-maroon{color:hsl(var(--sf-dark-c-txt-maroon))}.sf-c-txt-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-100))}.sf-c-txt-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-90))}.sf-c-txt-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-80))}.sf-c-txt-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-70))}.sf-c-txt-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-60))}.sf-c-txt-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-50))}.sf-c-txt-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-40))}.sf-c-txt-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-30))}.sf-c-txt-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-20))}.sf-c-txt-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-10))}.sf-c-txt-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-0))}html.var .sf-c-txt-maroon{color:hsl(0,100%,75%)}html.var .sf-c-txt-maroon\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-maroon\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-maroon\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-maroon\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-maroon\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-maroon\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-maroon\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-maroon\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-maroon\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-maroon\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-maroon,html.dark .sf-c-maroon{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon))}html[data-theme='dark'] .sf-c-maroon\:0,html.dark .sf-c-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-100))}html[data-theme='dark'] .sf-c-maroon\:10,html.dark .sf-c-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-90))}html[data-theme='dark'] .sf-c-maroon\:20,html.dark .sf-c-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-80))}html[data-theme='dark'] .sf-c-maroon\:30,html.dark .sf-c-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-70))}html[data-theme='dark'] .sf-c-maroon\:40,html.dark .sf-c-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-60))}html[data-theme='dark'] .sf-c-maroon\:50,html.dark .sf-c-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-50))}html[data-theme='dark'] .sf-c-maroon\:60,html.dark .sf-c-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-40))}html[data-theme='dark'] .sf-c-maroon\:70,html.dark .sf-c-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-30))}html[data-theme='dark'] .sf-c-maroon\:80,html.dark .sf-c-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-20))}html[data-theme='dark'] .sf-c-maroon\:90,html.dark .sf-c-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-10))}html[data-theme='dark'] .sf-c-maroon\:100,html.dark .sf-c-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-0))}html[data-theme='dark'] .sf-c-maroon\:dark,html.dark .sf-c-maroon\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon))}html[data-theme='dark'] .sf-c-maroon\:0\:dark,html.dark .sf-c-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-100))}html[data-theme='dark'] .sf-c-maroon\:10\:dark,html.dark .sf-c-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}html[data-theme='dark'] .sf-c-maroon\:20\:dark,html.dark .sf-c-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}html[data-theme='dark'] .sf-c-maroon\:30\:dark,html.dark .sf-c-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-70))}html[data-theme='dark'] .sf-c-maroon\:40\:dark,html.dark .sf-c-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-60))}html[data-theme='dark'] .sf-c-maroon\:50\:dark,html.dark .sf-c-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}html[data-theme='dark'] .sf-c-maroon\:60\:dark,html.dark .sf-c-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}html[data-theme='dark'] .sf-c-maroon\:70\:dark,html.dark .sf-c-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}html[data-theme='dark'] .sf-c-maroon\:80\:dark,html.dark .sf-c-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}html[data-theme='dark'] .sf-c-maroon\:90\:dark,html.dark .sf-c-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}html[data-theme='dark'] .sf-c-maroon\:100\:dark,html.dark .sf-c-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon,html.dark .sf-c-txt-maroon{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='dark'] .sf-c-txt-maroon\:0,html.dark .sf-c-txt-maroon\:0{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon\:10,html.dark .sf-c-txt-maroon\:10{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='dark'] .sf-c-txt-maroon\:20,html.dark .sf-c-txt-maroon\:20{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='dark'] .sf-c-txt-maroon\:30,html.dark .sf-c-txt-maroon\:30{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='dark'] .sf-c-txt-maroon\:40,html.dark .sf-c-txt-maroon\:40{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='dark'] .sf-c-txt-maroon\:50,html.dark .sf-c-txt-maroon\:50{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='dark'] .sf-c-txt-maroon\:60,html.dark .sf-c-txt-maroon\:60{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='dark'] .sf-c-txt-maroon\:70,html.dark .sf-c-txt-maroon\:70{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='dark'] .sf-c-txt-maroon\:80,html.dark .sf-c-txt-maroon\:80{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='dark'] .sf-c-txt-maroon\:90,html.dark .sf-c-txt-maroon\:90{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='dark'] .sf-c-txt-maroon\:100,html.dark .sf-c-txt-maroon\:100{color:hsl(var(--sf-c-txt-maroon-100))}html[data-theme='dark'] .sf-c-txt-maroon\:dark,html.dark .sf-c-txt-maroon\:dark{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='dark'] .sf-c-txt-maroon\:0\:dark,html.dark .sf-c-txt-maroon\:0\:dark{color:hsl(var(--sf-dark-c-txt-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon\:10\:dark,html.dark .sf-c-txt-maroon\:10\:dark{color:hsl(var(--sf-dark-c-txt-maroon-10))}html[data-theme='dark'] .sf-c-txt-maroon\:20\:dark,html.dark .sf-c-txt-maroon\:20\:dark{color:hsl(var(--sf-dark-c-txt-maroon-20))}html[data-theme='dark'] .sf-c-txt-maroon\:30\:dark,html.dark .sf-c-txt-maroon\:30\:dark{color:hsl(var(--sf-dark-c-txt-maroon-30))}html[data-theme='dark'] .sf-c-txt-maroon\:40\:dark,html.dark .sf-c-txt-maroon\:40\:dark{color:hsl(var(--sf-dark-c-txt-maroon-40))}html[data-theme='dark'] .sf-c-txt-maroon\:50\:dark,html.dark .sf-c-txt-maroon\:50\:dark{color:hsl(var(--sf-dark-c-txt-maroon-50))}html[data-theme='dark'] .sf-c-txt-maroon\:60\:dark,html.dark .sf-c-txt-maroon\:60\:dark{color:hsl(var(--sf-dark-c-txt-maroon-60))}html[data-theme='dark'] .sf-c-txt-maroon\:70\:dark,html.dark .sf-c-txt-maroon\:70\:dark{color:hsl(var(--sf-dark-c-txt-maroon-70))}html[data-theme='dark'] .sf-c-txt-maroon\:80\:dark,html.dark .sf-c-txt-maroon\:80\:dark{color:hsl(var(--sf-dark-c-txt-maroon-80))}html[data-theme='dark'] .sf-c-txt-maroon\:90\:dark,html.dark .sf-c-txt-maroon\:90\:dark{color:hsl(var(--sf-dark-c-txt-maroon-90))}html[data-theme='dark'] .sf-c-txt-maroon\:100\:dark,html.dark .sf-c-txt-maroon\:100\:dark{color:hsl(var(--sf-dark-c-txt-maroon-100))}html.var[data-theme='dark'] .sf-c-maroon,html.var.dark .sf-c-maroon{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='dark'] .sf-c-maroon\:0,html.var.dark .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-maroon\:10,html.var.dark .sf-c-maroon\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-maroon\:20,html.var.dark .sf-c-maroon\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-maroon\:30,html.var.dark .sf-c-maroon\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-maroon\:40,html.var.dark .sf-c-maroon\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-maroon\:50,html.var.dark .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-maroon\:60,html.var.dark .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-maroon\:70,html.var.dark .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-maroon\:80,html.var.dark .sf-c-maroon\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-maroon\:90,html.var.dark .sf-c-maroon\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-maroon\:100,html.var.dark .sf-c-maroon\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-maroon\:dark,html.var.dark .sf-c-maroon\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='dark'] .sf-c-maroon\:0\:dark,html.var.dark .sf-c-maroon\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-maroon\:10\:dark,html.var.dark .sf-c-maroon\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-maroon\:20\:dark,html.var.dark .sf-c-maroon\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-maroon\:30\:dark,html.var.dark .sf-c-maroon\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-maroon\:40\:dark,html.var.dark .sf-c-maroon\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-maroon\:50\:dark,html.var.dark .sf-c-maroon\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-maroon\:60\:dark,html.var.dark .sf-c-maroon\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-maroon\:70\:dark,html.var.dark .sf-c-maroon\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-maroon\:80\:dark,html.var.dark .sf-c-maroon\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-maroon\:90\:dark,html.var.dark .sf-c-maroon\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-maroon\:100\:dark,html.var.dark .sf-c-maroon\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon,html.dark .sf-c-txt-maroon{color:hsl(0,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:0,html.dark .sf-c-txt-maroon\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:10,html.dark .sf-c-txt-maroon\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:20,html.dark .sf-c-txt-maroon\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:30,html.dark .sf-c-txt-maroon\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:40,html.dark .sf-c-txt-maroon\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:50,html.dark .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:60,html.dark .sf-c-txt-maroon\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:70,html.dark .sf-c-txt-maroon\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:80,html.dark .sf-c-txt-maroon\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:90,html.dark .sf-c-txt-maroon\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:100,html.dark .sf-c-txt-maroon\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:dark,html.dark .sf-c-txt-maroon\:dark{color:hsl(0,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:0\:dark,html.dark .sf-c-txt-maroon\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:10\:dark,html.dark .sf-c-txt-maroon\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:20\:dark,html.dark .sf-c-txt-maroon\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:30\:dark,html.dark .sf-c-txt-maroon\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:40\:dark,html.dark .sf-c-txt-maroon\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:50\:dark,html.dark .sf-c-txt-maroon\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:60\:dark,html.dark .sf-c-txt-maroon\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:70\:dark,html.dark .sf-c-txt-maroon\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:80\:dark,html.dark .sf-c-txt-maroon\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:90\:dark,html.dark .sf-c-txt-maroon\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:100\:dark,html.dark .sf-c-txt-maroon\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-maroon,html.auto .sf-c-maroon{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon))}html[data-theme='auto'] .sf-c-maroon\:0,html.auto .sf-c-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-100))}html[data-theme='auto'] .sf-c-maroon\:10,html.auto .sf-c-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-90))}html[data-theme='auto'] .sf-c-maroon\:20,html.auto .sf-c-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-80))}html[data-theme='auto'] .sf-c-maroon\:30,html.auto .sf-c-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-70))}html[data-theme='auto'] .sf-c-maroon\:40,html.auto .sf-c-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-60))}html[data-theme='auto'] .sf-c-maroon\:50,html.auto .sf-c-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-50))}html[data-theme='auto'] .sf-c-maroon\:60,html.auto .sf-c-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-40))}html[data-theme='auto'] .sf-c-maroon\:70,html.auto .sf-c-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-30))}html[data-theme='auto'] .sf-c-maroon\:80,html.auto .sf-c-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-20))}html[data-theme='auto'] .sf-c-maroon\:90,html.auto .sf-c-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-10))}html[data-theme='auto'] .sf-c-maroon\:100,html.auto .sf-c-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-0))}html[data-theme='auto'] .sf-c-maroon\:dark,html.auto .sf-c-maroon\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon))}html[data-theme='auto'] .sf-c-maroon\:0\:dark,html.auto .sf-c-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-100))}html[data-theme='auto'] .sf-c-maroon\:10\:dark,html.auto .sf-c-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}html[data-theme='auto'] .sf-c-maroon\:20\:dark,html.auto .sf-c-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}html[data-theme='auto'] .sf-c-maroon\:30\:dark,html.auto .sf-c-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-70))}html[data-theme='auto'] .sf-c-maroon\:40\:dark,html.auto .sf-c-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-60))}html[data-theme='auto'] .sf-c-maroon\:50\:dark,html.auto .sf-c-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}html[data-theme='auto'] .sf-c-maroon\:60\:dark,html.auto .sf-c-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}html[data-theme='auto'] .sf-c-maroon\:70\:dark,html.auto .sf-c-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}html[data-theme='auto'] .sf-c-maroon\:80\:dark,html.auto .sf-c-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}html[data-theme='auto'] .sf-c-maroon\:90\:dark,html.auto .sf-c-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}html[data-theme='auto'] .sf-c-maroon\:100\:dark,html.auto .sf-c-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon,html.auto .sf-c-txt-maroon{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='auto'] .sf-c-txt-maroon\:0,html.auto .sf-c-txt-maroon\:0{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon\:10,html.auto .sf-c-txt-maroon\:10{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='auto'] .sf-c-txt-maroon\:20,html.auto .sf-c-txt-maroon\:20{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='auto'] .sf-c-txt-maroon\:30,html.auto .sf-c-txt-maroon\:30{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='auto'] .sf-c-txt-maroon\:40,html.auto .sf-c-txt-maroon\:40{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='auto'] .sf-c-txt-maroon\:50,html.auto .sf-c-txt-maroon\:50{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='auto'] .sf-c-txt-maroon\:60,html.auto .sf-c-txt-maroon\:60{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='auto'] .sf-c-txt-maroon\:70,html.auto .sf-c-txt-maroon\:70{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='auto'] .sf-c-txt-maroon\:80,html.auto .sf-c-txt-maroon\:80{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='auto'] .sf-c-txt-maroon\:90,html.auto .sf-c-txt-maroon\:90{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='auto'] .sf-c-txt-maroon\:100,html.auto .sf-c-txt-maroon\:100{color:hsl(var(--sf-c-txt-maroon-100))}html[data-theme='auto'] .sf-c-txt-maroon\:dark,html.auto .sf-c-txt-maroon\:dark{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='auto'] .sf-c-txt-maroon\:0\:dark,html.auto .sf-c-txt-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon\:10\:dark,html.auto .sf-c-txt-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='auto'] .sf-c-txt-maroon\:20\:dark,html.auto .sf-c-txt-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='auto'] .sf-c-txt-maroon\:30\:dark,html.auto .sf-c-txt-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='auto'] .sf-c-txt-maroon\:40\:dark,html.auto .sf-c-txt-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='auto'] .sf-c-txt-maroon\:50\:dark,html.auto .sf-c-txt-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='auto'] .sf-c-txt-maroon\:60\:dark,html.auto .sf-c-txt-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='auto'] .sf-c-txt-maroon\:70\:dark,html.auto .sf-c-txt-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='auto'] .sf-c-txt-maroon\:80\:dark,html.auto .sf-c-txt-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='auto'] .sf-c-txt-maroon\:90\:dark,html.auto .sf-c-txt-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='auto'] .sf-c-txt-maroon\:100\:dark,html.auto .sf-c-txt-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-100))}html.var[data-theme='auto'] .sf-c-maroon,html.var.auto .sf-c-maroon{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='auto'] .sf-c-maroon\:0,html.var.auto .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-maroon\:10,html.var.auto .sf-c-maroon\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-maroon\:20,html.var.auto .sf-c-maroon\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-maroon\:30,html.var.auto .sf-c-maroon\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-maroon\:40,html.var.auto .sf-c-maroon\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-maroon\:50,html.var.auto .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-maroon\:60,html.var.auto .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-maroon\:70,html.var.auto .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-maroon\:80,html.var.auto .sf-c-maroon\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-maroon\:90,html.var.auto .sf-c-maroon\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-maroon\:100,html.var.auto .sf-c-maroon\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-maroon\:dark,html.var.auto .sf-c-maroon\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='auto'] .sf-c-maroon\:0\:dark,html.var.auto .sf-c-maroon\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-maroon\:10\:dark,html.var.auto .sf-c-maroon\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-maroon\:20\:dark,html.var.auto .sf-c-maroon\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-maroon\:30\:dark,html.var.auto .sf-c-maroon\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-maroon\:40\:dark,html.var.auto .sf-c-maroon\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-maroon\:50\:dark,html.var.auto .sf-c-maroon\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-maroon\:60\:dark,html.var.auto .sf-c-maroon\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-maroon\:70\:dark,html.var.auto .sf-c-maroon\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-maroon\:80\:dark,html.var.auto .sf-c-maroon\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-maroon\:90\:dark,html.var.auto .sf-c-maroon\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-maroon\:100\:dark,html.var.auto .sf-c-maroon\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon,html.auto .sf-c-txt-maroon{color:hsl(0,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:0,html.auto .sf-c-txt-maroon\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:10,html.auto .sf-c-txt-maroon\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:20,html.auto .sf-c-txt-maroon\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:30,html.auto .sf-c-txt-maroon\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:40,html.auto .sf-c-txt-maroon\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:50,html.auto .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:60,html.auto .sf-c-txt-maroon\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:70,html.auto .sf-c-txt-maroon\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:80,html.auto .sf-c-txt-maroon\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:90,html.auto .sf-c-txt-maroon\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:100,html.auto .sf-c-txt-maroon\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:dark,html.auto .sf-c-txt-maroon\:dark{color:hsl(0,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark,html.auto .sf-c-txt-maroon\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark,html.auto .sf-c-txt-maroon\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark,html.auto .sf-c-txt-maroon\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark,html.auto .sf-c-txt-maroon\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark,html.auto .sf-c-txt-maroon\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark,html.auto .sf-c-txt-maroon\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark,html.auto .sf-c-txt-maroon\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark,html.auto .sf-c-txt-maroon\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark,html.auto .sf-c-txt-maroon\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark,html.auto .sf-c-txt-maroon\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark,html.auto .sf-c-txt-maroon\:100\:dark{color:hsl(0,100%,100%)}}.sf-c-navy{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}.sf-c-navy\:0{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}.sf-c-navy\:10{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}.sf-c-navy\:20{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}.sf-c-navy\:30{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}.sf-c-navy\:40{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}.sf-c-navy\:50{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}.sf-c-navy\:60{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}.sf-c-navy\:70{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-70))}.sf-c-navy\:80{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-80))}.sf-c-navy\:90{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}.sf-c-navy\:100{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-100))}html.var .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,25%)}html.var .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-navy\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-navy\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-navy\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-navy\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-navy\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-navy{color:hsl(var(--sf-dark-c-txt-navy))}.sf-c-txt-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-100))}.sf-c-txt-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-90))}.sf-c-txt-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-80))}.sf-c-txt-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-70))}.sf-c-txt-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-60))}.sf-c-txt-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-50))}.sf-c-txt-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-40))}.sf-c-txt-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-30))}.sf-c-txt-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-20))}.sf-c-txt-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-10))}.sf-c-txt-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-0))}html.var .sf-c-txt-navy{color:hsl(240,100%,75%)}html.var .sf-c-txt-navy\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-navy\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-navy\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-navy\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-navy\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-navy\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-navy\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-navy\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-navy\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-navy\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-navy,html.dark .sf-c-navy{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy))}html[data-theme='dark'] .sf-c-navy\:0,html.dark .sf-c-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-100))}html[data-theme='dark'] .sf-c-navy\:10,html.dark .sf-c-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-90))}html[data-theme='dark'] .sf-c-navy\:20,html.dark .sf-c-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-80))}html[data-theme='dark'] .sf-c-navy\:30,html.dark .sf-c-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-70))}html[data-theme='dark'] .sf-c-navy\:40,html.dark .sf-c-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-60))}html[data-theme='dark'] .sf-c-navy\:50,html.dark .sf-c-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-50))}html[data-theme='dark'] .sf-c-navy\:60,html.dark .sf-c-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-40))}html[data-theme='dark'] .sf-c-navy\:70,html.dark .sf-c-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-30))}html[data-theme='dark'] .sf-c-navy\:80,html.dark .sf-c-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-20))}html[data-theme='dark'] .sf-c-navy\:90,html.dark .sf-c-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-10))}html[data-theme='dark'] .sf-c-navy\:100,html.dark .sf-c-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-0))}html[data-theme='dark'] .sf-c-navy\:dark,html.dark .sf-c-navy\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}html[data-theme='dark'] .sf-c-navy\:0\:dark,html.dark .sf-c-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-100))}html[data-theme='dark'] .sf-c-navy\:10\:dark,html.dark .sf-c-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}html[data-theme='dark'] .sf-c-navy\:20\:dark,html.dark .sf-c-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-80))}html[data-theme='dark'] .sf-c-navy\:30\:dark,html.dark .sf-c-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-70))}html[data-theme='dark'] .sf-c-navy\:40\:dark,html.dark .sf-c-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}html[data-theme='dark'] .sf-c-navy\:50\:dark,html.dark .sf-c-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}html[data-theme='dark'] .sf-c-navy\:60\:dark,html.dark .sf-c-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}html[data-theme='dark'] .sf-c-navy\:70\:dark,html.dark .sf-c-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}html[data-theme='dark'] .sf-c-navy\:80\:dark,html.dark .sf-c-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}html[data-theme='dark'] .sf-c-navy\:90\:dark,html.dark .sf-c-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}html[data-theme='dark'] .sf-c-navy\:100\:dark,html.dark .sf-c-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}html[data-theme='dark'] .sf-c-txt-navy,html.dark .sf-c-txt-navy{color:hsl(var(--sf-c-txt-navy))}html[data-theme='dark'] .sf-c-txt-navy\:0,html.dark .sf-c-txt-navy\:0{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='dark'] .sf-c-txt-navy\:10,html.dark .sf-c-txt-navy\:10{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='dark'] .sf-c-txt-navy\:20,html.dark .sf-c-txt-navy\:20{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='dark'] .sf-c-txt-navy\:30,html.dark .sf-c-txt-navy\:30{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='dark'] .sf-c-txt-navy\:40,html.dark .sf-c-txt-navy\:40{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='dark'] .sf-c-txt-navy\:50,html.dark .sf-c-txt-navy\:50{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='dark'] .sf-c-txt-navy\:60,html.dark .sf-c-txt-navy\:60{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='dark'] .sf-c-txt-navy\:70,html.dark .sf-c-txt-navy\:70{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='dark'] .sf-c-txt-navy\:80,html.dark .sf-c-txt-navy\:80{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='dark'] .sf-c-txt-navy\:90,html.dark .sf-c-txt-navy\:90{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='dark'] .sf-c-txt-navy\:100,html.dark .sf-c-txt-navy\:100{color:hsl(var(--sf-c-txt-navy-100))}html[data-theme='dark'] .sf-c-txt-navy\:dark,html.dark .sf-c-txt-navy\:dark{color:hsl(var(--sf-c-txt-navy))}html[data-theme='dark'] .sf-c-txt-navy\:0\:dark,html.dark .sf-c-txt-navy\:0\:dark{color:hsl(var(--sf-dark-c-txt-navy-0))}html[data-theme='dark'] .sf-c-txt-navy\:10\:dark,html.dark .sf-c-txt-navy\:10\:dark{color:hsl(var(--sf-dark-c-txt-navy-10))}html[data-theme='dark'] .sf-c-txt-navy\:20\:dark,html.dark .sf-c-txt-navy\:20\:dark{color:hsl(var(--sf-dark-c-txt-navy-20))}html[data-theme='dark'] .sf-c-txt-navy\:30\:dark,html.dark .sf-c-txt-navy\:30\:dark{color:hsl(var(--sf-dark-c-txt-navy-30))}html[data-theme='dark'] .sf-c-txt-navy\:40\:dark,html.dark .sf-c-txt-navy\:40\:dark{color:hsl(var(--sf-dark-c-txt-navy-40))}html[data-theme='dark'] .sf-c-txt-navy\:50\:dark,html.dark .sf-c-txt-navy\:50\:dark{color:hsl(var(--sf-dark-c-txt-navy-50))}html[data-theme='dark'] .sf-c-txt-navy\:60\:dark,html.dark .sf-c-txt-navy\:60\:dark{color:hsl(var(--sf-dark-c-txt-navy-60))}html[data-theme='dark'] .sf-c-txt-navy\:70\:dark,html.dark .sf-c-txt-navy\:70\:dark{color:hsl(var(--sf-dark-c-txt-navy-70))}html[data-theme='dark'] .sf-c-txt-navy\:80\:dark,html.dark .sf-c-txt-navy\:80\:dark{color:hsl(var(--sf-dark-c-txt-navy-80))}html[data-theme='dark'] .sf-c-txt-navy\:90\:dark,html.dark .sf-c-txt-navy\:90\:dark{color:hsl(var(--sf-dark-c-txt-navy-90))}html[data-theme='dark'] .sf-c-txt-navy\:100\:dark,html.dark .sf-c-txt-navy\:100\:dark{color:hsl(var(--sf-dark-c-txt-navy-100))}html.var[data-theme='dark'] .sf-c-navy,html.var.dark .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='dark'] .sf-c-navy\:0,html.var.dark .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-navy\:10,html.var.dark .sf-c-navy\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-navy\:20,html.var.dark .sf-c-navy\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-navy\:30,html.var.dark .sf-c-navy\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-navy\:40,html.var.dark .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-navy\:50,html.var.dark .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-navy\:60,html.var.dark .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-navy\:70,html.var.dark .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-navy\:80,html.var.dark .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-navy\:90,html.var.dark .sf-c-navy\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-navy\:100,html.var.dark .sf-c-navy\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-navy\:dark,html.var.dark .sf-c-navy\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='dark'] .sf-c-navy\:0\:dark,html.var.dark .sf-c-navy\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-navy\:10\:dark,html.var.dark .sf-c-navy\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-navy\:20\:dark,html.var.dark .sf-c-navy\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-navy\:30\:dark,html.var.dark .sf-c-navy\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-navy\:40\:dark,html.var.dark .sf-c-navy\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-navy\:50\:dark,html.var.dark .sf-c-navy\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-navy\:60\:dark,html.var.dark .sf-c-navy\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-navy\:70\:dark,html.var.dark .sf-c-navy\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-navy\:80\:dark,html.var.dark .sf-c-navy\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-navy\:90\:dark,html.var.dark .sf-c-navy\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-navy\:100\:dark,html.var.dark .sf-c-navy\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy,html.dark .sf-c-txt-navy{color:hsl(240,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-navy\:0,html.dark .sf-c-txt-navy\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy\:10,html.dark .sf-c-txt-navy\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-navy\:20,html.dark .sf-c-txt-navy\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-navy\:30,html.dark .sf-c-txt-navy\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-navy\:40,html.dark .sf-c-txt-navy\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-navy\:50,html.dark .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-navy\:60,html.dark .sf-c-txt-navy\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-navy\:70,html.dark .sf-c-txt-navy\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-navy\:80,html.dark .sf-c-txt-navy\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-navy\:90,html.dark .sf-c-txt-navy\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-navy\:100,html.dark .sf-c-txt-navy\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-navy\:dark,html.dark .sf-c-txt-navy\:dark{color:hsl(240,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-navy\:0\:dark,html.dark .sf-c-txt-navy\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy\:10\:dark,html.dark .sf-c-txt-navy\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-navy\:20\:dark,html.dark .sf-c-txt-navy\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-navy\:30\:dark,html.dark .sf-c-txt-navy\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-navy\:40\:dark,html.dark .sf-c-txt-navy\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-navy\:50\:dark,html.dark .sf-c-txt-navy\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-navy\:60\:dark,html.dark .sf-c-txt-navy\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-navy\:70\:dark,html.dark .sf-c-txt-navy\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-navy\:80\:dark,html.dark .sf-c-txt-navy\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-navy\:90\:dark,html.dark .sf-c-txt-navy\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-navy\:100\:dark,html.dark .sf-c-txt-navy\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-navy,html.auto .sf-c-navy{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy))}html[data-theme='auto'] .sf-c-navy\:0,html.auto .sf-c-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-100))}html[data-theme='auto'] .sf-c-navy\:10,html.auto .sf-c-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-90))}html[data-theme='auto'] .sf-c-navy\:20,html.auto .sf-c-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-80))}html[data-theme='auto'] .sf-c-navy\:30,html.auto .sf-c-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-70))}html[data-theme='auto'] .sf-c-navy\:40,html.auto .sf-c-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-60))}html[data-theme='auto'] .sf-c-navy\:50,html.auto .sf-c-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-50))}html[data-theme='auto'] .sf-c-navy\:60,html.auto .sf-c-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-40))}html[data-theme='auto'] .sf-c-navy\:70,html.auto .sf-c-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-30))}html[data-theme='auto'] .sf-c-navy\:80,html.auto .sf-c-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-20))}html[data-theme='auto'] .sf-c-navy\:90,html.auto .sf-c-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-10))}html[data-theme='auto'] .sf-c-navy\:100,html.auto .sf-c-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-0))}html[data-theme='auto'] .sf-c-navy\:dark,html.auto .sf-c-navy\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}html[data-theme='auto'] .sf-c-navy\:0\:dark,html.auto .sf-c-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-100))}html[data-theme='auto'] .sf-c-navy\:10\:dark,html.auto .sf-c-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}html[data-theme='auto'] .sf-c-navy\:20\:dark,html.auto .sf-c-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-80))}html[data-theme='auto'] .sf-c-navy\:30\:dark,html.auto .sf-c-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-70))}html[data-theme='auto'] .sf-c-navy\:40\:dark,html.auto .sf-c-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}html[data-theme='auto'] .sf-c-navy\:50\:dark,html.auto .sf-c-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}html[data-theme='auto'] .sf-c-navy\:60\:dark,html.auto .sf-c-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}html[data-theme='auto'] .sf-c-navy\:70\:dark,html.auto .sf-c-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}html[data-theme='auto'] .sf-c-navy\:80\:dark,html.auto .sf-c-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}html[data-theme='auto'] .sf-c-navy\:90\:dark,html.auto .sf-c-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}html[data-theme='auto'] .sf-c-navy\:100\:dark,html.auto .sf-c-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}html[data-theme='auto'] .sf-c-txt-navy,html.auto .sf-c-txt-navy{color:hsl(var(--sf-c-txt-navy))}html[data-theme='auto'] .sf-c-txt-navy\:0,html.auto .sf-c-txt-navy\:0{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='auto'] .sf-c-txt-navy\:10,html.auto .sf-c-txt-navy\:10{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='auto'] .sf-c-txt-navy\:20,html.auto .sf-c-txt-navy\:20{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='auto'] .sf-c-txt-navy\:30,html.auto .sf-c-txt-navy\:30{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='auto'] .sf-c-txt-navy\:40,html.auto .sf-c-txt-navy\:40{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='auto'] .sf-c-txt-navy\:50,html.auto .sf-c-txt-navy\:50{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='auto'] .sf-c-txt-navy\:60,html.auto .sf-c-txt-navy\:60{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='auto'] .sf-c-txt-navy\:70,html.auto .sf-c-txt-navy\:70{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='auto'] .sf-c-txt-navy\:80,html.auto .sf-c-txt-navy\:80{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='auto'] .sf-c-txt-navy\:90,html.auto .sf-c-txt-navy\:90{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='auto'] .sf-c-txt-navy\:100,html.auto .sf-c-txt-navy\:100{color:hsl(var(--sf-c-txt-navy-100))}html[data-theme='auto'] .sf-c-txt-navy\:dark,html.auto .sf-c-txt-navy\:dark{color:hsl(var(--sf-c-txt-navy))}html[data-theme='auto'] .sf-c-txt-navy\:0\:dark,html.auto .sf-c-txt-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='auto'] .sf-c-txt-navy\:10\:dark,html.auto .sf-c-txt-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='auto'] .sf-c-txt-navy\:20\:dark,html.auto .sf-c-txt-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='auto'] .sf-c-txt-navy\:30\:dark,html.auto .sf-c-txt-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='auto'] .sf-c-txt-navy\:40\:dark,html.auto .sf-c-txt-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='auto'] .sf-c-txt-navy\:50\:dark,html.auto .sf-c-txt-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='auto'] .sf-c-txt-navy\:60\:dark,html.auto .sf-c-txt-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='auto'] .sf-c-txt-navy\:70\:dark,html.auto .sf-c-txt-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='auto'] .sf-c-txt-navy\:80\:dark,html.auto .sf-c-txt-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='auto'] .sf-c-txt-navy\:90\:dark,html.auto .sf-c-txt-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='auto'] .sf-c-txt-navy\:100\:dark,html.auto .sf-c-txt-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-100))}html.var[data-theme='auto'] .sf-c-navy,html.var.auto .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='auto'] .sf-c-navy\:0,html.var.auto .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-navy\:10,html.var.auto .sf-c-navy\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-navy\:20,html.var.auto .sf-c-navy\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-navy\:30,html.var.auto .sf-c-navy\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-navy\:40,html.var.auto .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-navy\:50,html.var.auto .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-navy\:60,html.var.auto .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-navy\:70,html.var.auto .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-navy\:80,html.var.auto .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-navy\:90,html.var.auto .sf-c-navy\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-navy\:100,html.var.auto .sf-c-navy\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-navy\:dark,html.var.auto .sf-c-navy\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='auto'] .sf-c-navy\:0\:dark,html.var.auto .sf-c-navy\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-navy\:10\:dark,html.var.auto .sf-c-navy\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-navy\:20\:dark,html.var.auto .sf-c-navy\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-navy\:30\:dark,html.var.auto .sf-c-navy\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-navy\:40\:dark,html.var.auto .sf-c-navy\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-navy\:50\:dark,html.var.auto .sf-c-navy\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-navy\:60\:dark,html.var.auto .sf-c-navy\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-navy\:70\:dark,html.var.auto .sf-c-navy\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-navy\:80\:dark,html.var.auto .sf-c-navy\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-navy\:90\:dark,html.var.auto .sf-c-navy\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-navy\:100\:dark,html.var.auto .sf-c-navy\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy,html.auto .sf-c-txt-navy{color:hsl(240,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-navy\:0,html.auto .sf-c-txt-navy\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy\:10,html.auto .sf-c-txt-navy\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-navy\:20,html.auto .sf-c-txt-navy\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-navy\:30,html.auto .sf-c-txt-navy\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-navy\:40,html.auto .sf-c-txt-navy\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-navy\:50,html.auto .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-navy\:60,html.auto .sf-c-txt-navy\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-navy\:70,html.auto .sf-c-txt-navy\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-navy\:80,html.auto .sf-c-txt-navy\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-navy\:90,html.auto .sf-c-txt-navy\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-navy\:100,html.auto .sf-c-txt-navy\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-navy\:dark,html.auto .sf-c-txt-navy\:dark{color:hsl(240,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark,html.auto .sf-c-txt-navy\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark,html.auto .sf-c-txt-navy\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark,html.auto .sf-c-txt-navy\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark,html.auto .sf-c-txt-navy\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark,html.auto .sf-c-txt-navy\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark,html.auto .sf-c-txt-navy\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark,html.auto .sf-c-txt-navy\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark,html.auto .sf-c-txt-navy\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark,html.auto .sf-c-txt-navy\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark,html.auto .sf-c-txt-navy\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark,html.auto .sf-c-txt-navy\:100\:dark{color:hsl(240,100%,100%)}}.sf-c-olive{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive))}.sf-c-olive\:0{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}.sf-c-olive\:10{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}.sf-c-olive\:20{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}.sf-c-olive\:30{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-30))}.sf-c-olive\:40{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-40))}.sf-c-olive\:50{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}.sf-c-olive\:60{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}.sf-c-olive\:70{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}.sf-c-olive\:80{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}.sf-c-olive\:90{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}.sf-c-olive\:100{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-100))}html.var .sf-c-olive{color:hsl(60,100%,90%);background:hsl(60,100%,25%)}html.var .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-olive\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-olive\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-olive\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-olive\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-olive\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-olive\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-olive\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-olive{color:hsl(var(--sf-dark-c-txt-olive))}.sf-c-txt-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-100))}.sf-c-txt-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-90))}.sf-c-txt-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-80))}.sf-c-txt-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-70))}.sf-c-txt-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-60))}.sf-c-txt-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-50))}.sf-c-txt-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-40))}.sf-c-txt-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-30))}.sf-c-txt-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-20))}.sf-c-txt-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-10))}.sf-c-txt-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-0))}html.var .sf-c-txt-olive{color:hsl(60,100%,75%)}html.var .sf-c-txt-olive\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-olive\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-olive\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-olive\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-olive\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-olive\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-olive\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-olive\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-olive\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-olive\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-olive,html.dark .sf-c-olive{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive))}html[data-theme='dark'] .sf-c-olive\:0,html.dark .sf-c-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-100))}html[data-theme='dark'] .sf-c-olive\:10,html.dark .sf-c-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-90))}html[data-theme='dark'] .sf-c-olive\:20,html.dark .sf-c-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-80))}html[data-theme='dark'] .sf-c-olive\:30,html.dark .sf-c-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-70))}html[data-theme='dark'] .sf-c-olive\:40,html.dark .sf-c-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-60))}html[data-theme='dark'] .sf-c-olive\:50,html.dark .sf-c-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-50))}html[data-theme='dark'] .sf-c-olive\:60,html.dark .sf-c-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-40))}html[data-theme='dark'] .sf-c-olive\:70,html.dark .sf-c-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-30))}html[data-theme='dark'] .sf-c-olive\:80,html.dark .sf-c-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-20))}html[data-theme='dark'] .sf-c-olive\:90,html.dark .sf-c-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-10))}html[data-theme='dark'] .sf-c-olive\:100,html.dark .sf-c-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-0))}html[data-theme='dark'] .sf-c-olive\:dark,html.dark .sf-c-olive\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive))}html[data-theme='dark'] .sf-c-olive\:0\:dark,html.dark .sf-c-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-100))}html[data-theme='dark'] .sf-c-olive\:10\:dark,html.dark .sf-c-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}html[data-theme='dark'] .sf-c-olive\:20\:dark,html.dark .sf-c-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}html[data-theme='dark'] .sf-c-olive\:30\:dark,html.dark .sf-c-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}html[data-theme='dark'] .sf-c-olive\:40\:dark,html.dark .sf-c-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}html[data-theme='dark'] .sf-c-olive\:50\:dark,html.dark .sf-c-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}html[data-theme='dark'] .sf-c-olive\:60\:dark,html.dark .sf-c-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-40))}html[data-theme='dark'] .sf-c-olive\:70\:dark,html.dark .sf-c-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-30))}html[data-theme='dark'] .sf-c-olive\:80\:dark,html.dark .sf-c-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}html[data-theme='dark'] .sf-c-olive\:90\:dark,html.dark .sf-c-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}html[data-theme='dark'] .sf-c-olive\:100\:dark,html.dark .sf-c-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}html[data-theme='dark'] .sf-c-txt-olive,html.dark .sf-c-txt-olive{color:hsl(var(--sf-c-txt-olive))}html[data-theme='dark'] .sf-c-txt-olive\:0,html.dark .sf-c-txt-olive\:0{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='dark'] .sf-c-txt-olive\:10,html.dark .sf-c-txt-olive\:10{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='dark'] .sf-c-txt-olive\:20,html.dark .sf-c-txt-olive\:20{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='dark'] .sf-c-txt-olive\:30,html.dark .sf-c-txt-olive\:30{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='dark'] .sf-c-txt-olive\:40,html.dark .sf-c-txt-olive\:40{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='dark'] .sf-c-txt-olive\:50,html.dark .sf-c-txt-olive\:50{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='dark'] .sf-c-txt-olive\:60,html.dark .sf-c-txt-olive\:60{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='dark'] .sf-c-txt-olive\:70,html.dark .sf-c-txt-olive\:70{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='dark'] .sf-c-txt-olive\:80,html.dark .sf-c-txt-olive\:80{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='dark'] .sf-c-txt-olive\:90,html.dark .sf-c-txt-olive\:90{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='dark'] .sf-c-txt-olive\:100,html.dark .sf-c-txt-olive\:100{color:hsl(var(--sf-c-txt-olive-100))}html[data-theme='dark'] .sf-c-txt-olive\:dark,html.dark .sf-c-txt-olive\:dark{color:hsl(var(--sf-c-txt-olive))}html[data-theme='dark'] .sf-c-txt-olive\:0\:dark,html.dark .sf-c-txt-olive\:0\:dark{color:hsl(var(--sf-dark-c-txt-olive-0))}html[data-theme='dark'] .sf-c-txt-olive\:10\:dark,html.dark .sf-c-txt-olive\:10\:dark{color:hsl(var(--sf-dark-c-txt-olive-10))}html[data-theme='dark'] .sf-c-txt-olive\:20\:dark,html.dark .sf-c-txt-olive\:20\:dark{color:hsl(var(--sf-dark-c-txt-olive-20))}html[data-theme='dark'] .sf-c-txt-olive\:30\:dark,html.dark .sf-c-txt-olive\:30\:dark{color:hsl(var(--sf-dark-c-txt-olive-30))}html[data-theme='dark'] .sf-c-txt-olive\:40\:dark,html.dark .sf-c-txt-olive\:40\:dark{color:hsl(var(--sf-dark-c-txt-olive-40))}html[data-theme='dark'] .sf-c-txt-olive\:50\:dark,html.dark .sf-c-txt-olive\:50\:dark{color:hsl(var(--sf-dark-c-txt-olive-50))}html[data-theme='dark'] .sf-c-txt-olive\:60\:dark,html.dark .sf-c-txt-olive\:60\:dark{color:hsl(var(--sf-dark-c-txt-olive-60))}html[data-theme='dark'] .sf-c-txt-olive\:70\:dark,html.dark .sf-c-txt-olive\:70\:dark{color:hsl(var(--sf-dark-c-txt-olive-70))}html[data-theme='dark'] .sf-c-txt-olive\:80\:dark,html.dark .sf-c-txt-olive\:80\:dark{color:hsl(var(--sf-dark-c-txt-olive-80))}html[data-theme='dark'] .sf-c-txt-olive\:90\:dark,html.dark .sf-c-txt-olive\:90\:dark{color:hsl(var(--sf-dark-c-txt-olive-90))}html[data-theme='dark'] .sf-c-txt-olive\:100\:dark,html.dark .sf-c-txt-olive\:100\:dark{color:hsl(var(--sf-dark-c-txt-olive-100))}html.var[data-theme='dark'] .sf-c-olive,html.var.dark .sf-c-olive{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='dark'] .sf-c-olive\:0,html.var.dark .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-olive\:10,html.var.dark .sf-c-olive\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-olive\:20,html.var.dark .sf-c-olive\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-olive\:30,html.var.dark .sf-c-olive\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-olive\:40,html.var.dark .sf-c-olive\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-olive\:50,html.var.dark .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-olive\:60,html.var.dark .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-olive\:70,html.var.dark .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-olive\:80,html.var.dark .sf-c-olive\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-olive\:90,html.var.dark .sf-c-olive\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-olive\:100,html.var.dark .sf-c-olive\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-olive\:dark,html.var.dark .sf-c-olive\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='dark'] .sf-c-olive\:0\:dark,html.var.dark .sf-c-olive\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-olive\:10\:dark,html.var.dark .sf-c-olive\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-olive\:20\:dark,html.var.dark .sf-c-olive\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-olive\:30\:dark,html.var.dark .sf-c-olive\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-olive\:40\:dark,html.var.dark .sf-c-olive\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-olive\:50\:dark,html.var.dark .sf-c-olive\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-olive\:60\:dark,html.var.dark .sf-c-olive\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-olive\:70\:dark,html.var.dark .sf-c-olive\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-olive\:80\:dark,html.var.dark .sf-c-olive\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-olive\:90\:dark,html.var.dark .sf-c-olive\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-olive\:100\:dark,html.var.dark .sf-c-olive\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive,html.dark .sf-c-txt-olive{color:hsl(60,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-olive\:0,html.dark .sf-c-txt-olive\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive\:10,html.dark .sf-c-txt-olive\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-olive\:20,html.dark .sf-c-txt-olive\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-olive\:30,html.dark .sf-c-txt-olive\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-olive\:40,html.dark .sf-c-txt-olive\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-olive\:50,html.dark .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-olive\:60,html.dark .sf-c-txt-olive\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-olive\:70,html.dark .sf-c-txt-olive\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-olive\:80,html.dark .sf-c-txt-olive\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-olive\:90,html.dark .sf-c-txt-olive\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-olive\:100,html.dark .sf-c-txt-olive\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-olive\:dark,html.dark .sf-c-txt-olive\:dark{color:hsl(60,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-olive\:0\:dark,html.dark .sf-c-txt-olive\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive\:10\:dark,html.dark .sf-c-txt-olive\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-olive\:20\:dark,html.dark .sf-c-txt-olive\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-olive\:30\:dark,html.dark .sf-c-txt-olive\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-olive\:40\:dark,html.dark .sf-c-txt-olive\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-olive\:50\:dark,html.dark .sf-c-txt-olive\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-olive\:60\:dark,html.dark .sf-c-txt-olive\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-olive\:70\:dark,html.dark .sf-c-txt-olive\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-olive\:80\:dark,html.dark .sf-c-txt-olive\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-olive\:90\:dark,html.dark .sf-c-txt-olive\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-olive\:100\:dark,html.dark .sf-c-txt-olive\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-olive,html.auto .sf-c-olive{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive))}html[data-theme='auto'] .sf-c-olive\:0,html.auto .sf-c-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-100))}html[data-theme='auto'] .sf-c-olive\:10,html.auto .sf-c-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-90))}html[data-theme='auto'] .sf-c-olive\:20,html.auto .sf-c-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-80))}html[data-theme='auto'] .sf-c-olive\:30,html.auto .sf-c-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-70))}html[data-theme='auto'] .sf-c-olive\:40,html.auto .sf-c-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-60))}html[data-theme='auto'] .sf-c-olive\:50,html.auto .sf-c-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-50))}html[data-theme='auto'] .sf-c-olive\:60,html.auto .sf-c-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-40))}html[data-theme='auto'] .sf-c-olive\:70,html.auto .sf-c-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-30))}html[data-theme='auto'] .sf-c-olive\:80,html.auto .sf-c-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-20))}html[data-theme='auto'] .sf-c-olive\:90,html.auto .sf-c-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-10))}html[data-theme='auto'] .sf-c-olive\:100,html.auto .sf-c-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-0))}html[data-theme='auto'] .sf-c-olive\:dark,html.auto .sf-c-olive\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive))}html[data-theme='auto'] .sf-c-olive\:0\:dark,html.auto .sf-c-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-100))}html[data-theme='auto'] .sf-c-olive\:10\:dark,html.auto .sf-c-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}html[data-theme='auto'] .sf-c-olive\:20\:dark,html.auto .sf-c-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}html[data-theme='auto'] .sf-c-olive\:30\:dark,html.auto .sf-c-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}html[data-theme='auto'] .sf-c-olive\:40\:dark,html.auto .sf-c-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}html[data-theme='auto'] .sf-c-olive\:50\:dark,html.auto .sf-c-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}html[data-theme='auto'] .sf-c-olive\:60\:dark,html.auto .sf-c-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-40))}html[data-theme='auto'] .sf-c-olive\:70\:dark,html.auto .sf-c-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-30))}html[data-theme='auto'] .sf-c-olive\:80\:dark,html.auto .sf-c-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}html[data-theme='auto'] .sf-c-olive\:90\:dark,html.auto .sf-c-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}html[data-theme='auto'] .sf-c-olive\:100\:dark,html.auto .sf-c-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}html[data-theme='auto'] .sf-c-txt-olive,html.auto .sf-c-txt-olive{color:hsl(var(--sf-c-txt-olive))}html[data-theme='auto'] .sf-c-txt-olive\:0,html.auto .sf-c-txt-olive\:0{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='auto'] .sf-c-txt-olive\:10,html.auto .sf-c-txt-olive\:10{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='auto'] .sf-c-txt-olive\:20,html.auto .sf-c-txt-olive\:20{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='auto'] .sf-c-txt-olive\:30,html.auto .sf-c-txt-olive\:30{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='auto'] .sf-c-txt-olive\:40,html.auto .sf-c-txt-olive\:40{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='auto'] .sf-c-txt-olive\:50,html.auto .sf-c-txt-olive\:50{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='auto'] .sf-c-txt-olive\:60,html.auto .sf-c-txt-olive\:60{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='auto'] .sf-c-txt-olive\:70,html.auto .sf-c-txt-olive\:70{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='auto'] .sf-c-txt-olive\:80,html.auto .sf-c-txt-olive\:80{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='auto'] .sf-c-txt-olive\:90,html.auto .sf-c-txt-olive\:90{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='auto'] .sf-c-txt-olive\:100,html.auto .sf-c-txt-olive\:100{color:hsl(var(--sf-c-txt-olive-100))}html[data-theme='auto'] .sf-c-txt-olive\:dark,html.auto .sf-c-txt-olive\:dark{color:hsl(var(--sf-c-txt-olive))}html[data-theme='auto'] .sf-c-txt-olive\:0\:dark,html.auto .sf-c-txt-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='auto'] .sf-c-txt-olive\:10\:dark,html.auto .sf-c-txt-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='auto'] .sf-c-txt-olive\:20\:dark,html.auto .sf-c-txt-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='auto'] .sf-c-txt-olive\:30\:dark,html.auto .sf-c-txt-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='auto'] .sf-c-txt-olive\:40\:dark,html.auto .sf-c-txt-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='auto'] .sf-c-txt-olive\:50\:dark,html.auto .sf-c-txt-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='auto'] .sf-c-txt-olive\:60\:dark,html.auto .sf-c-txt-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='auto'] .sf-c-txt-olive\:70\:dark,html.auto .sf-c-txt-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='auto'] .sf-c-txt-olive\:80\:dark,html.auto .sf-c-txt-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='auto'] .sf-c-txt-olive\:90\:dark,html.auto .sf-c-txt-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='auto'] .sf-c-txt-olive\:100\:dark,html.auto .sf-c-txt-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-100))}html.var[data-theme='auto'] .sf-c-olive,html.var.auto .sf-c-olive{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='auto'] .sf-c-olive\:0,html.var.auto .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-olive\:10,html.var.auto .sf-c-olive\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-olive\:20,html.var.auto .sf-c-olive\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-olive\:30,html.var.auto .sf-c-olive\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-olive\:40,html.var.auto .sf-c-olive\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-olive\:50,html.var.auto .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-olive\:60,html.var.auto .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-olive\:70,html.var.auto .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-olive\:80,html.var.auto .sf-c-olive\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-olive\:90,html.var.auto .sf-c-olive\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-olive\:100,html.var.auto .sf-c-olive\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-olive\:dark,html.var.auto .sf-c-olive\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='auto'] .sf-c-olive\:0\:dark,html.var.auto .sf-c-olive\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-olive\:10\:dark,html.var.auto .sf-c-olive\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-olive\:20\:dark,html.var.auto .sf-c-olive\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-olive\:30\:dark,html.var.auto .sf-c-olive\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-olive\:40\:dark,html.var.auto .sf-c-olive\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-olive\:50\:dark,html.var.auto .sf-c-olive\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-olive\:60\:dark,html.var.auto .sf-c-olive\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-olive\:70\:dark,html.var.auto .sf-c-olive\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-olive\:80\:dark,html.var.auto .sf-c-olive\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-olive\:90\:dark,html.var.auto .sf-c-olive\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-olive\:100\:dark,html.var.auto .sf-c-olive\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive,html.auto .sf-c-txt-olive{color:hsl(60,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-olive\:0,html.auto .sf-c-txt-olive\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive\:10,html.auto .sf-c-txt-olive\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-olive\:20,html.auto .sf-c-txt-olive\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-olive\:30,html.auto .sf-c-txt-olive\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-olive\:40,html.auto .sf-c-txt-olive\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-olive\:50,html.auto .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-olive\:60,html.auto .sf-c-txt-olive\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-olive\:70,html.auto .sf-c-txt-olive\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-olive\:80,html.auto .sf-c-txt-olive\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-olive\:90,html.auto .sf-c-txt-olive\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-olive\:100,html.auto .sf-c-txt-olive\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-olive\:dark,html.auto .sf-c-txt-olive\:dark{color:hsl(60,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark,html.auto .sf-c-txt-olive\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark,html.auto .sf-c-txt-olive\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark,html.auto .sf-c-txt-olive\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark,html.auto .sf-c-txt-olive\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark,html.auto .sf-c-txt-olive\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark,html.auto .sf-c-txt-olive\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark,html.auto .sf-c-txt-olive\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark,html.auto .sf-c-txt-olive\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark,html.auto .sf-c-txt-olive\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark,html.auto .sf-c-txt-olive\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark,html.auto .sf-c-txt-olive\:100\:dark{color:hsl(60,100%,100%)}}.sf-c-purple{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple))}.sf-c-purple\:0{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}.sf-c-purple\:10{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}.sf-c-purple\:20{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}.sf-c-purple\:30{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}.sf-c-purple\:40{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}.sf-c-purple\:50{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-50))}.sf-c-purple\:60{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-60))}.sf-c-purple\:70{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}.sf-c-purple\:80{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}.sf-c-purple\:90{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}.sf-c-purple\:100{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-100))}html.var .sf-c-purple{color:hsl(300,100%,90%);background:hsl(300,100%,25%)}html.var .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var .sf-c-purple\:10{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var .sf-c-purple\:20{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var .sf-c-purple\:30{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var .sf-c-purple\:40{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var .sf-c-purple\:50{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,60%)}html.var .sf-c-purple\:70{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var .sf-c-purple\:80{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var .sf-c-purple\:90{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var .sf-c-purple\:100{color:hsl(300,100%,10%);background:hsl(300,100%,100%)}.sf-c-txt-purple{color:hsl(var(--sf-dark-c-txt-purple))}.sf-c-txt-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-100))}.sf-c-txt-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-90))}.sf-c-txt-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-80))}.sf-c-txt-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-70))}.sf-c-txt-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-60))}.sf-c-txt-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-50))}.sf-c-txt-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-40))}.sf-c-txt-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-30))}.sf-c-txt-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-20))}.sf-c-txt-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-10))}.sf-c-txt-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-0))}html.var .sf-c-txt-purple{color:hsl(300,100%,75%)}html.var .sf-c-txt-purple\:0{color:hsl(300,100%,100%)}html.var .sf-c-txt-purple\:10{color:hsl(300,100%,90%)}html.var .sf-c-txt-purple\:20{color:hsl(300,100%,80%)}html.var .sf-c-txt-purple\:30{color:hsl(300,100%,70%)}html.var .sf-c-txt-purple\:40{color:hsl(300,100%,60%)}html.var .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var .sf-c-txt-purple\:60{color:hsl(300,100%,40%)}html.var .sf-c-txt-purple\:70{color:hsl(300,100%,30%)}html.var .sf-c-txt-purple\:80{color:hsl(300,100%,20%)}html.var .sf-c-txt-purple\:90{color:hsl(300,100%,10%)}html.var .sf-c-txt-purple\:100{color:hsl(300,100%,0%)}html[data-theme='dark'] .sf-c-purple,html.dark .sf-c-purple{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple))}html[data-theme='dark'] .sf-c-purple\:0,html.dark .sf-c-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-100))}html[data-theme='dark'] .sf-c-purple\:10,html.dark .sf-c-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-90))}html[data-theme='dark'] .sf-c-purple\:20,html.dark .sf-c-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-80))}html[data-theme='dark'] .sf-c-purple\:30,html.dark .sf-c-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-70))}html[data-theme='dark'] .sf-c-purple\:40,html.dark .sf-c-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-60))}html[data-theme='dark'] .sf-c-purple\:50,html.dark .sf-c-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-50))}html[data-theme='dark'] .sf-c-purple\:60,html.dark .sf-c-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-40))}html[data-theme='dark'] .sf-c-purple\:70,html.dark .sf-c-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-30))}html[data-theme='dark'] .sf-c-purple\:80,html.dark .sf-c-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-20))}html[data-theme='dark'] .sf-c-purple\:90,html.dark .sf-c-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-10))}html[data-theme='dark'] .sf-c-purple\:100,html.dark .sf-c-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-0))}html[data-theme='dark'] .sf-c-purple\:dark,html.dark .sf-c-purple\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple))}html[data-theme='dark'] .sf-c-purple\:0\:dark,html.dark .sf-c-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-100))}html[data-theme='dark'] .sf-c-purple\:10\:dark,html.dark .sf-c-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}html[data-theme='dark'] .sf-c-purple\:20\:dark,html.dark .sf-c-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}html[data-theme='dark'] .sf-c-purple\:30\:dark,html.dark .sf-c-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}html[data-theme='dark'] .sf-c-purple\:40\:dark,html.dark .sf-c-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-60))}html[data-theme='dark'] .sf-c-purple\:50\:dark,html.dark .sf-c-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-50))}html[data-theme='dark'] .sf-c-purple\:60\:dark,html.dark .sf-c-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}html[data-theme='dark'] .sf-c-purple\:70\:dark,html.dark .sf-c-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}html[data-theme='dark'] .sf-c-purple\:80\:dark,html.dark .sf-c-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}html[data-theme='dark'] .sf-c-purple\:90\:dark,html.dark .sf-c-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}html[data-theme='dark'] .sf-c-purple\:100\:dark,html.dark .sf-c-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}html[data-theme='dark'] .sf-c-txt-purple,html.dark .sf-c-txt-purple{color:hsl(var(--sf-c-txt-purple))}html[data-theme='dark'] .sf-c-txt-purple\:0,html.dark .sf-c-txt-purple\:0{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='dark'] .sf-c-txt-purple\:10,html.dark .sf-c-txt-purple\:10{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='dark'] .sf-c-txt-purple\:20,html.dark .sf-c-txt-purple\:20{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='dark'] .sf-c-txt-purple\:30,html.dark .sf-c-txt-purple\:30{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='dark'] .sf-c-txt-purple\:40,html.dark .sf-c-txt-purple\:40{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='dark'] .sf-c-txt-purple\:50,html.dark .sf-c-txt-purple\:50{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='dark'] .sf-c-txt-purple\:60,html.dark .sf-c-txt-purple\:60{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='dark'] .sf-c-txt-purple\:70,html.dark .sf-c-txt-purple\:70{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='dark'] .sf-c-txt-purple\:80,html.dark .sf-c-txt-purple\:80{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='dark'] .sf-c-txt-purple\:90,html.dark .sf-c-txt-purple\:90{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='dark'] .sf-c-txt-purple\:100,html.dark .sf-c-txt-purple\:100{color:hsl(var(--sf-c-txt-purple-100))}html[data-theme='dark'] .sf-c-txt-purple\:dark,html.dark .sf-c-txt-purple\:dark{color:hsl(var(--sf-c-txt-purple))}html[data-theme='dark'] .sf-c-txt-purple\:0\:dark,html.dark .sf-c-txt-purple\:0\:dark{color:hsl(var(--sf-dark-c-txt-purple-0))}html[data-theme='dark'] .sf-c-txt-purple\:10\:dark,html.dark .sf-c-txt-purple\:10\:dark{color:hsl(var(--sf-dark-c-txt-purple-10))}html[data-theme='dark'] .sf-c-txt-purple\:20\:dark,html.dark .sf-c-txt-purple\:20\:dark{color:hsl(var(--sf-dark-c-txt-purple-20))}html[data-theme='dark'] .sf-c-txt-purple\:30\:dark,html.dark .sf-c-txt-purple\:30\:dark{color:hsl(var(--sf-dark-c-txt-purple-30))}html[data-theme='dark'] .sf-c-txt-purple\:40\:dark,html.dark .sf-c-txt-purple\:40\:dark{color:hsl(var(--sf-dark-c-txt-purple-40))}html[data-theme='dark'] .sf-c-txt-purple\:50\:dark,html.dark .sf-c-txt-purple\:50\:dark{color:hsl(var(--sf-dark-c-txt-purple-50))}html[data-theme='dark'] .sf-c-txt-purple\:60\:dark,html.dark .sf-c-txt-purple\:60\:dark{color:hsl(var(--sf-dark-c-txt-purple-60))}html[data-theme='dark'] .sf-c-txt-purple\:70\:dark,html.dark .sf-c-txt-purple\:70\:dark{color:hsl(var(--sf-dark-c-txt-purple-70))}html[data-theme='dark'] .sf-c-txt-purple\:80\:dark,html.dark .sf-c-txt-purple\:80\:dark{color:hsl(var(--sf-dark-c-txt-purple-80))}html[data-theme='dark'] .sf-c-txt-purple\:90\:dark,html.dark .sf-c-txt-purple\:90\:dark{color:hsl(var(--sf-dark-c-txt-purple-90))}html[data-theme='dark'] .sf-c-txt-purple\:100\:dark,html.dark .sf-c-txt-purple\:100\:dark{color:hsl(var(--sf-dark-c-txt-purple-100))}html.var[data-theme='dark'] .sf-c-purple,html.var.dark .sf-c-purple{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='dark'] .sf-c-purple\:0,html.var.dark .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-purple\:10,html.var.dark .sf-c-purple\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-purple\:20,html.var.dark .sf-c-purple\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-purple\:30,html.var.dark .sf-c-purple\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-purple\:40,html.var.dark .sf-c-purple\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-purple\:50,html.var.dark .sf-c-purple\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-purple\:60,html.var.dark .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-purple\:70,html.var.dark .sf-c-purple\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-purple\:80,html.var.dark .sf-c-purple\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-purple\:90,html.var.dark .sf-c-purple\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-purple\:100,html.var.dark .sf-c-purple\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-purple\:dark,html.var.dark .sf-c-purple\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='dark'] .sf-c-purple\:0\:dark,html.var.dark .sf-c-purple\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-purple\:10\:dark,html.var.dark .sf-c-purple\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-purple\:20\:dark,html.var.dark .sf-c-purple\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-purple\:30\:dark,html.var.dark .sf-c-purple\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-purple\:40\:dark,html.var.dark .sf-c-purple\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-purple\:50\:dark,html.var.dark .sf-c-purple\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-purple\:60\:dark,html.var.dark .sf-c-purple\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-purple\:70\:dark,html.var.dark .sf-c-purple\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-purple\:80\:dark,html.var.dark .sf-c-purple\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-purple\:90\:dark,html.var.dark .sf-c-purple\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-purple\:100\:dark,html.var.dark .sf-c-purple\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple,html.dark .sf-c-txt-purple{color:hsl(300,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-purple\:0,html.dark .sf-c-txt-purple\:0{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple\:10,html.dark .sf-c-txt-purple\:10{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-purple\:20,html.dark .sf-c-txt-purple\:20{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-purple\:30,html.dark .sf-c-txt-purple\:30{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-purple\:40,html.dark .sf-c-txt-purple\:40{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-purple\:50,html.dark .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-purple\:60,html.dark .sf-c-txt-purple\:60{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-purple\:70,html.dark .sf-c-txt-purple\:70{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-purple\:80,html.dark .sf-c-txt-purple\:80{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-purple\:90,html.dark .sf-c-txt-purple\:90{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-purple\:100,html.dark .sf-c-txt-purple\:100{color:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-purple\:dark,html.dark .sf-c-txt-purple\:dark{color:hsl(300,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-purple\:0\:dark,html.dark .sf-c-txt-purple\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple\:10\:dark,html.dark .sf-c-txt-purple\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-purple\:20\:dark,html.dark .sf-c-txt-purple\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-purple\:30\:dark,html.dark .sf-c-txt-purple\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-purple\:40\:dark,html.dark .sf-c-txt-purple\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-purple\:50\:dark,html.dark .sf-c-txt-purple\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-purple\:60\:dark,html.dark .sf-c-txt-purple\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-purple\:70\:dark,html.dark .sf-c-txt-purple\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-purple\:80\:dark,html.dark .sf-c-txt-purple\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-purple\:90\:dark,html.dark .sf-c-txt-purple\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-purple\:100\:dark,html.dark .sf-c-txt-purple\:100\:dark{color:hsl(300,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-purple,html.auto .sf-c-purple{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple))}html[data-theme='auto'] .sf-c-purple\:0,html.auto .sf-c-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-100))}html[data-theme='auto'] .sf-c-purple\:10,html.auto .sf-c-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-90))}html[data-theme='auto'] .sf-c-purple\:20,html.auto .sf-c-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-80))}html[data-theme='auto'] .sf-c-purple\:30,html.auto .sf-c-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-70))}html[data-theme='auto'] .sf-c-purple\:40,html.auto .sf-c-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-60))}html[data-theme='auto'] .sf-c-purple\:50,html.auto .sf-c-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-50))}html[data-theme='auto'] .sf-c-purple\:60,html.auto .sf-c-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-40))}html[data-theme='auto'] .sf-c-purple\:70,html.auto .sf-c-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-30))}html[data-theme='auto'] .sf-c-purple\:80,html.auto .sf-c-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-20))}html[data-theme='auto'] .sf-c-purple\:90,html.auto .sf-c-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-10))}html[data-theme='auto'] .sf-c-purple\:100,html.auto .sf-c-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-0))}html[data-theme='auto'] .sf-c-purple\:dark,html.auto .sf-c-purple\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple))}html[data-theme='auto'] .sf-c-purple\:0\:dark,html.auto .sf-c-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-100))}html[data-theme='auto'] .sf-c-purple\:10\:dark,html.auto .sf-c-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}html[data-theme='auto'] .sf-c-purple\:20\:dark,html.auto .sf-c-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}html[data-theme='auto'] .sf-c-purple\:30\:dark,html.auto .sf-c-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}html[data-theme='auto'] .sf-c-purple\:40\:dark,html.auto .sf-c-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-60))}html[data-theme='auto'] .sf-c-purple\:50\:dark,html.auto .sf-c-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-50))}html[data-theme='auto'] .sf-c-purple\:60\:dark,html.auto .sf-c-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}html[data-theme='auto'] .sf-c-purple\:70\:dark,html.auto .sf-c-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}html[data-theme='auto'] .sf-c-purple\:80\:dark,html.auto .sf-c-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}html[data-theme='auto'] .sf-c-purple\:90\:dark,html.auto .sf-c-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}html[data-theme='auto'] .sf-c-purple\:100\:dark,html.auto .sf-c-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}html[data-theme='auto'] .sf-c-txt-purple,html.auto .sf-c-txt-purple{color:hsl(var(--sf-c-txt-purple))}html[data-theme='auto'] .sf-c-txt-purple\:0,html.auto .sf-c-txt-purple\:0{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='auto'] .sf-c-txt-purple\:10,html.auto .sf-c-txt-purple\:10{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='auto'] .sf-c-txt-purple\:20,html.auto .sf-c-txt-purple\:20{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='auto'] .sf-c-txt-purple\:30,html.auto .sf-c-txt-purple\:30{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='auto'] .sf-c-txt-purple\:40,html.auto .sf-c-txt-purple\:40{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='auto'] .sf-c-txt-purple\:50,html.auto .sf-c-txt-purple\:50{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='auto'] .sf-c-txt-purple\:60,html.auto .sf-c-txt-purple\:60{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='auto'] .sf-c-txt-purple\:70,html.auto .sf-c-txt-purple\:70{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='auto'] .sf-c-txt-purple\:80,html.auto .sf-c-txt-purple\:80{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='auto'] .sf-c-txt-purple\:90,html.auto .sf-c-txt-purple\:90{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='auto'] .sf-c-txt-purple\:100,html.auto .sf-c-txt-purple\:100{color:hsl(var(--sf-c-txt-purple-100))}html[data-theme='auto'] .sf-c-txt-purple\:dark,html.auto .sf-c-txt-purple\:dark{color:hsl(var(--sf-c-txt-purple))}html[data-theme='auto'] .sf-c-txt-purple\:0\:dark,html.auto .sf-c-txt-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='auto'] .sf-c-txt-purple\:10\:dark,html.auto .sf-c-txt-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='auto'] .sf-c-txt-purple\:20\:dark,html.auto .sf-c-txt-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='auto'] .sf-c-txt-purple\:30\:dark,html.auto .sf-c-txt-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='auto'] .sf-c-txt-purple\:40\:dark,html.auto .sf-c-txt-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='auto'] .sf-c-txt-purple\:50\:dark,html.auto .sf-c-txt-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='auto'] .sf-c-txt-purple\:60\:dark,html.auto .sf-c-txt-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='auto'] .sf-c-txt-purple\:70\:dark,html.auto .sf-c-txt-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='auto'] .sf-c-txt-purple\:80\:dark,html.auto .sf-c-txt-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='auto'] .sf-c-txt-purple\:90\:dark,html.auto .sf-c-txt-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='auto'] .sf-c-txt-purple\:100\:dark,html.auto .sf-c-txt-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-100))}html.var[data-theme='auto'] .sf-c-purple,html.var.auto .sf-c-purple{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='auto'] .sf-c-purple\:0,html.var.auto .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-purple\:10,html.var.auto .sf-c-purple\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-purple\:20,html.var.auto .sf-c-purple\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-purple\:30,html.var.auto .sf-c-purple\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-purple\:40,html.var.auto .sf-c-purple\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-purple\:50,html.var.auto .sf-c-purple\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-purple\:60,html.var.auto .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-purple\:70,html.var.auto .sf-c-purple\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-purple\:80,html.var.auto .sf-c-purple\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-purple\:90,html.var.auto .sf-c-purple\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-purple\:100,html.var.auto .sf-c-purple\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-purple\:dark,html.var.auto .sf-c-purple\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='auto'] .sf-c-purple\:0\:dark,html.var.auto .sf-c-purple\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-purple\:10\:dark,html.var.auto .sf-c-purple\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-purple\:20\:dark,html.var.auto .sf-c-purple\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-purple\:30\:dark,html.var.auto .sf-c-purple\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-purple\:40\:dark,html.var.auto .sf-c-purple\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-purple\:50\:dark,html.var.auto .sf-c-purple\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-purple\:60\:dark,html.var.auto .sf-c-purple\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-purple\:70\:dark,html.var.auto .sf-c-purple\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-purple\:80\:dark,html.var.auto .sf-c-purple\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-purple\:90\:dark,html.var.auto .sf-c-purple\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-purple\:100\:dark,html.var.auto .sf-c-purple\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple,html.auto .sf-c-txt-purple{color:hsl(300,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-purple\:0,html.auto .sf-c-txt-purple\:0{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple\:10,html.auto .sf-c-txt-purple\:10{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-purple\:20,html.auto .sf-c-txt-purple\:20{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-purple\:30,html.auto .sf-c-txt-purple\:30{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-purple\:40,html.auto .sf-c-txt-purple\:40{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-purple\:50,html.auto .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-purple\:60,html.auto .sf-c-txt-purple\:60{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-purple\:70,html.auto .sf-c-txt-purple\:70{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-purple\:80,html.auto .sf-c-txt-purple\:80{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-purple\:90,html.auto .sf-c-txt-purple\:90{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-purple\:100,html.auto .sf-c-txt-purple\:100{color:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-purple\:dark,html.auto .sf-c-txt-purple\:dark{color:hsl(300,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark,html.auto .sf-c-txt-purple\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark,html.auto .sf-c-txt-purple\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark,html.auto .sf-c-txt-purple\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark,html.auto .sf-c-txt-purple\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark,html.auto .sf-c-txt-purple\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark,html.auto .sf-c-txt-purple\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark,html.auto .sf-c-txt-purple\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark,html.auto .sf-c-txt-purple\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark,html.auto .sf-c-txt-purple\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark,html.auto .sf-c-txt-purple\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark,html.auto .sf-c-txt-purple\:100\:dark{color:hsl(300,100%,100%)}}.sf-c-red{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}.sf-c-red\:0{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}.sf-c-red\:10{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}.sf-c-red\:20{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}.sf-c-red\:30{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}.sf-c-red\:40{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}.sf-c-red\:50{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}.sf-c-red\:60{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-60))}.sf-c-red\:70{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-70))}.sf-c-red\:80{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}.sf-c-red\:90{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}.sf-c-red\:100{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-100))}html.var .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-red\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-red\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-red\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-red\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-red\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-red\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-red\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-red{color:hsl(var(--sf-dark-c-txt-red))}.sf-c-txt-red\:0{color:hsl(var(--sf-dark-c-txt-red-100))}.sf-c-txt-red\:10{color:hsl(var(--sf-dark-c-txt-red-90))}.sf-c-txt-red\:20{color:hsl(var(--sf-dark-c-txt-red-80))}.sf-c-txt-red\:30{color:hsl(var(--sf-dark-c-txt-red-70))}.sf-c-txt-red\:40{color:hsl(var(--sf-dark-c-txt-red-60))}.sf-c-txt-red\:50{color:hsl(var(--sf-dark-c-txt-red-50))}.sf-c-txt-red\:60{color:hsl(var(--sf-dark-c-txt-red-40))}.sf-c-txt-red\:70{color:hsl(var(--sf-dark-c-txt-red-30))}.sf-c-txt-red\:80{color:hsl(var(--sf-dark-c-txt-red-20))}.sf-c-txt-red\:90{color:hsl(var(--sf-dark-c-txt-red-10))}.sf-c-txt-red\:100{color:hsl(var(--sf-dark-c-txt-red-0))}html.var .sf-c-txt-red{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-red\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-red\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-red\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-red\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-red\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-red\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-red\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-red\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-red,html.dark .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='dark'] .sf-c-red\:0,html.dark .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='dark'] .sf-c-red\:10,html.dark .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='dark'] .sf-c-red\:20,html.dark .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='dark'] .sf-c-red\:30,html.dark .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='dark'] .sf-c-red\:40,html.dark .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='dark'] .sf-c-red\:50,html.dark .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='dark'] .sf-c-red\:60,html.dark .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='dark'] .sf-c-red\:70,html.dark .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='dark'] .sf-c-red\:80,html.dark .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='dark'] .sf-c-red\:90,html.dark .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='dark'] .sf-c-red\:100,html.dark .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='dark'] .sf-c-red\:dark,html.dark .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='dark'] .sf-c-red\:0\:dark,html.dark .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='dark'] .sf-c-red\:10\:dark,html.dark .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='dark'] .sf-c-red\:20\:dark,html.dark .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='dark'] .sf-c-red\:30\:dark,html.dark .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='dark'] .sf-c-red\:40\:dark,html.dark .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='dark'] .sf-c-red\:50\:dark,html.dark .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='dark'] .sf-c-red\:60\:dark,html.dark .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='dark'] .sf-c-red\:70\:dark,html.dark .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='dark'] .sf-c-red\:80\:dark,html.dark .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='dark'] .sf-c-red\:90\:dark,html.dark .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='dark'] .sf-c-red\:100\:dark,html.dark .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-dark-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-dark-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-dark-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-dark-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-dark-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-dark-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-dark-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-dark-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-dark-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-dark-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-dark-c-txt-red-100))}html.var[data-theme='dark'] .sf-c-red,html.var.dark .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0,html.var.dark .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10,html.var.dark .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20,html.var.dark .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30,html.var.dark .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40,html.var.dark .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50,html.var.dark .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60,html.var.dark .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70,html.var.dark .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80,html.var.dark .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90,html.var.dark .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100,html.var.dark .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-red\:dark,html.var.dark .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0\:dark,html.var.dark .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10\:dark,html.var.dark .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20\:dark,html.var.dark .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30\:dark,html.var.dark .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40\:dark,html.var.dark .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50\:dark,html.var.dark .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60\:dark,html.var.dark .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70\:dark,html.var.dark .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80\:dark,html.var.dark .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90\:dark,html.var.dark .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100\:dark,html.var.dark .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-red,html.auto .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='auto'] .sf-c-red\:0,html.auto .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='auto'] .sf-c-red\:10,html.auto .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='auto'] .sf-c-red\:20,html.auto .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='auto'] .sf-c-red\:30,html.auto .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='auto'] .sf-c-red\:40,html.auto .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='auto'] .sf-c-red\:50,html.auto .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='auto'] .sf-c-red\:60,html.auto .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='auto'] .sf-c-red\:70,html.auto .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='auto'] .sf-c-red\:80,html.auto .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='auto'] .sf-c-red\:90,html.auto .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='auto'] .sf-c-red\:100,html.auto .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='auto'] .sf-c-red\:dark,html.auto .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='auto'] .sf-c-red\:0\:dark,html.auto .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='auto'] .sf-c-red\:10\:dark,html.auto .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='auto'] .sf-c-red\:20\:dark,html.auto .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='auto'] .sf-c-red\:30\:dark,html.auto .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='auto'] .sf-c-red\:40\:dark,html.auto .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='auto'] .sf-c-red\:50\:dark,html.auto .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='auto'] .sf-c-red\:60\:dark,html.auto .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='auto'] .sf-c-red\:70\:dark,html.auto .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='auto'] .sf-c-red\:80\:dark,html.auto .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='auto'] .sf-c-red\:90\:dark,html.auto .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='auto'] .sf-c-red\:100\:dark,html.auto .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-c-txt-red-100))}html.var[data-theme='auto'] .sf-c-red,html.var.auto .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0,html.var.auto .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10,html.var.auto .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20,html.var.auto .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30,html.var.auto .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40,html.var.auto .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50,html.var.auto .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60,html.var.auto .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70,html.var.auto .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80,html.var.auto .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90,html.var.auto .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100,html.var.auto .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-red\:dark,html.var.auto .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0\:dark,html.var.auto .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10\:dark,html.var.auto .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20\:dark,html.var.auto .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30\:dark,html.var.auto .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40\:dark,html.var.auto .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50\:dark,html.var.auto .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60\:dark,html.var.auto .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70\:dark,html.var.auto .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80\:dark,html.var.auto .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90\:dark,html.var.auto .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100\:dark,html.var.auto .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}}.sf-c-silver{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver))}.sf-c-silver\:0{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}.sf-c-silver\:10{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}.sf-c-silver\:20{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}.sf-c-silver\:30{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}.sf-c-silver\:40{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}.sf-c-silver\:50{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-50))}.sf-c-silver\:60{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-60))}.sf-c-silver\:70{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}.sf-c-silver\:80{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}.sf-c-silver\:90{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}.sf-c-silver\:100{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-100))}html.var .sf-c-silver{color:hsl(0,0%,10%);background:hsl(0,0%,75%)}html.var .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-silver\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-silver\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-silver\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-silver\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-silver\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-silver\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-silver\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-silver\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-silver\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-silver{color:hsl(var(--sf-dark-c-txt-silver))}.sf-c-txt-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-100))}.sf-c-txt-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-90))}.sf-c-txt-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-80))}.sf-c-txt-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-70))}.sf-c-txt-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-60))}.sf-c-txt-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-50))}.sf-c-txt-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-40))}.sf-c-txt-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-30))}.sf-c-txt-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-20))}.sf-c-txt-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-10))}.sf-c-txt-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-0))}html.var .sf-c-txt-silver{color:hsl(0,0%,25%)}html.var .sf-c-txt-silver\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-silver\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-silver\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-silver\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-silver\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-silver\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-silver\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-silver\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-silver\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-silver\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-silver,html.dark .sf-c-silver{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver))}html[data-theme='dark'] .sf-c-silver\:0,html.dark .sf-c-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-100))}html[data-theme='dark'] .sf-c-silver\:10,html.dark .sf-c-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-90))}html[data-theme='dark'] .sf-c-silver\:20,html.dark .sf-c-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-80))}html[data-theme='dark'] .sf-c-silver\:30,html.dark .sf-c-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-70))}html[data-theme='dark'] .sf-c-silver\:40,html.dark .sf-c-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-60))}html[data-theme='dark'] .sf-c-silver\:50,html.dark .sf-c-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-50))}html[data-theme='dark'] .sf-c-silver\:60,html.dark .sf-c-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-40))}html[data-theme='dark'] .sf-c-silver\:70,html.dark .sf-c-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-30))}html[data-theme='dark'] .sf-c-silver\:80,html.dark .sf-c-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-20))}html[data-theme='dark'] .sf-c-silver\:90,html.dark .sf-c-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-10))}html[data-theme='dark'] .sf-c-silver\:100,html.dark .sf-c-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-0))}html[data-theme='dark'] .sf-c-silver\:dark,html.dark .sf-c-silver\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver))}html[data-theme='dark'] .sf-c-silver\:0\:dark,html.dark .sf-c-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-100))}html[data-theme='dark'] .sf-c-silver\:10\:dark,html.dark .sf-c-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}html[data-theme='dark'] .sf-c-silver\:20\:dark,html.dark .sf-c-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}html[data-theme='dark'] .sf-c-silver\:30\:dark,html.dark .sf-c-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}html[data-theme='dark'] .sf-c-silver\:40\:dark,html.dark .sf-c-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-60))}html[data-theme='dark'] .sf-c-silver\:50\:dark,html.dark .sf-c-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-50))}html[data-theme='dark'] .sf-c-silver\:60\:dark,html.dark .sf-c-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}html[data-theme='dark'] .sf-c-silver\:70\:dark,html.dark .sf-c-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}html[data-theme='dark'] .sf-c-silver\:80\:dark,html.dark .sf-c-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}html[data-theme='dark'] .sf-c-silver\:90\:dark,html.dark .sf-c-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}html[data-theme='dark'] .sf-c-silver\:100\:dark,html.dark .sf-c-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}html[data-theme='dark'] .sf-c-txt-silver,html.dark .sf-c-txt-silver{color:hsl(var(--sf-c-txt-silver))}html[data-theme='dark'] .sf-c-txt-silver\:0,html.dark .sf-c-txt-silver\:0{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='dark'] .sf-c-txt-silver\:10,html.dark .sf-c-txt-silver\:10{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='dark'] .sf-c-txt-silver\:20,html.dark .sf-c-txt-silver\:20{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='dark'] .sf-c-txt-silver\:30,html.dark .sf-c-txt-silver\:30{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='dark'] .sf-c-txt-silver\:40,html.dark .sf-c-txt-silver\:40{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='dark'] .sf-c-txt-silver\:50,html.dark .sf-c-txt-silver\:50{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='dark'] .sf-c-txt-silver\:60,html.dark .sf-c-txt-silver\:60{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='dark'] .sf-c-txt-silver\:70,html.dark .sf-c-txt-silver\:70{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='dark'] .sf-c-txt-silver\:80,html.dark .sf-c-txt-silver\:80{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='dark'] .sf-c-txt-silver\:90,html.dark .sf-c-txt-silver\:90{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='dark'] .sf-c-txt-silver\:100,html.dark .sf-c-txt-silver\:100{color:hsl(var(--sf-c-txt-silver-100))}html[data-theme='dark'] .sf-c-txt-silver\:dark,html.dark .sf-c-txt-silver\:dark{color:hsl(var(--sf-c-txt-silver))}html[data-theme='dark'] .sf-c-txt-silver\:0\:dark,html.dark .sf-c-txt-silver\:0\:dark{color:hsl(var(--sf-dark-c-txt-silver-0))}html[data-theme='dark'] .sf-c-txt-silver\:10\:dark,html.dark .sf-c-txt-silver\:10\:dark{color:hsl(var(--sf-dark-c-txt-silver-10))}html[data-theme='dark'] .sf-c-txt-silver\:20\:dark,html.dark .sf-c-txt-silver\:20\:dark{color:hsl(var(--sf-dark-c-txt-silver-20))}html[data-theme='dark'] .sf-c-txt-silver\:30\:dark,html.dark .sf-c-txt-silver\:30\:dark{color:hsl(var(--sf-dark-c-txt-silver-30))}html[data-theme='dark'] .sf-c-txt-silver\:40\:dark,html.dark .sf-c-txt-silver\:40\:dark{color:hsl(var(--sf-dark-c-txt-silver-40))}html[data-theme='dark'] .sf-c-txt-silver\:50\:dark,html.dark .sf-c-txt-silver\:50\:dark{color:hsl(var(--sf-dark-c-txt-silver-50))}html[data-theme='dark'] .sf-c-txt-silver\:60\:dark,html.dark .sf-c-txt-silver\:60\:dark{color:hsl(var(--sf-dark-c-txt-silver-60))}html[data-theme='dark'] .sf-c-txt-silver\:70\:dark,html.dark .sf-c-txt-silver\:70\:dark{color:hsl(var(--sf-dark-c-txt-silver-70))}html[data-theme='dark'] .sf-c-txt-silver\:80\:dark,html.dark .sf-c-txt-silver\:80\:dark{color:hsl(var(--sf-dark-c-txt-silver-80))}html[data-theme='dark'] .sf-c-txt-silver\:90\:dark,html.dark .sf-c-txt-silver\:90\:dark{color:hsl(var(--sf-dark-c-txt-silver-90))}html[data-theme='dark'] .sf-c-txt-silver\:100\:dark,html.dark .sf-c-txt-silver\:100\:dark{color:hsl(var(--sf-dark-c-txt-silver-100))}html.var[data-theme='dark'] .sf-c-silver,html.var.dark .sf-c-silver{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='dark'] .sf-c-silver\:0,html.var.dark .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-silver\:10,html.var.dark .sf-c-silver\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-silver\:20,html.var.dark .sf-c-silver\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-silver\:30,html.var.dark .sf-c-silver\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-silver\:40,html.var.dark .sf-c-silver\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-silver\:50,html.var.dark .sf-c-silver\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-silver\:60,html.var.dark .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-silver\:70,html.var.dark .sf-c-silver\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-silver\:80,html.var.dark .sf-c-silver\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-silver\:90,html.var.dark .sf-c-silver\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-silver\:100,html.var.dark .sf-c-silver\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-silver\:dark,html.var.dark .sf-c-silver\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='dark'] .sf-c-silver\:0\:dark,html.var.dark .sf-c-silver\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-silver\:10\:dark,html.var.dark .sf-c-silver\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-silver\:20\:dark,html.var.dark .sf-c-silver\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-silver\:30\:dark,html.var.dark .sf-c-silver\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-silver\:40\:dark,html.var.dark .sf-c-silver\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-silver\:50\:dark,html.var.dark .sf-c-silver\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-silver\:60\:dark,html.var.dark .sf-c-silver\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-silver\:70\:dark,html.var.dark .sf-c-silver\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-silver\:80\:dark,html.var.dark .sf-c-silver\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-silver\:90\:dark,html.var.dark .sf-c-silver\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-silver\:100\:dark,html.var.dark .sf-c-silver\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver,html.dark .sf-c-txt-silver{color:hsl(0,0%,75%)}html.var[data-theme='dark'] .sf-c-txt-silver\:0,html.dark .sf-c-txt-silver\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver\:10,html.dark .sf-c-txt-silver\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-silver\:20,html.dark .sf-c-txt-silver\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-silver\:30,html.dark .sf-c-txt-silver\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-silver\:40,html.dark .sf-c-txt-silver\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-silver\:50,html.dark .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-silver\:60,html.dark .sf-c-txt-silver\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-silver\:70,html.dark .sf-c-txt-silver\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-silver\:80,html.dark .sf-c-txt-silver\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-silver\:90,html.dark .sf-c-txt-silver\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-silver\:100,html.dark .sf-c-txt-silver\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-silver\:dark,html.dark .sf-c-txt-silver\:dark{color:hsl(0,0%,75%)}html.var[data-theme='dark'] .sf-c-txt-silver\:0\:dark,html.dark .sf-c-txt-silver\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver\:10\:dark,html.dark .sf-c-txt-silver\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-silver\:20\:dark,html.dark .sf-c-txt-silver\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-silver\:30\:dark,html.dark .sf-c-txt-silver\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-silver\:40\:dark,html.dark .sf-c-txt-silver\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-silver\:50\:dark,html.dark .sf-c-txt-silver\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-silver\:60\:dark,html.dark .sf-c-txt-silver\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-silver\:70\:dark,html.dark .sf-c-txt-silver\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-silver\:80\:dark,html.dark .sf-c-txt-silver\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-silver\:90\:dark,html.dark .sf-c-txt-silver\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-silver\:100\:dark,html.dark .sf-c-txt-silver\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-silver,html.auto .sf-c-silver{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver))}html[data-theme='auto'] .sf-c-silver\:0,html.auto .sf-c-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-100))}html[data-theme='auto'] .sf-c-silver\:10,html.auto .sf-c-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-90))}html[data-theme='auto'] .sf-c-silver\:20,html.auto .sf-c-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-80))}html[data-theme='auto'] .sf-c-silver\:30,html.auto .sf-c-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-70))}html[data-theme='auto'] .sf-c-silver\:40,html.auto .sf-c-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-60))}html[data-theme='auto'] .sf-c-silver\:50,html.auto .sf-c-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-50))}html[data-theme='auto'] .sf-c-silver\:60,html.auto .sf-c-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-40))}html[data-theme='auto'] .sf-c-silver\:70,html.auto .sf-c-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-30))}html[data-theme='auto'] .sf-c-silver\:80,html.auto .sf-c-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-20))}html[data-theme='auto'] .sf-c-silver\:90,html.auto .sf-c-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-10))}html[data-theme='auto'] .sf-c-silver\:100,html.auto .sf-c-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-0))}html[data-theme='auto'] .sf-c-silver\:dark,html.auto .sf-c-silver\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver))}html[data-theme='auto'] .sf-c-silver\:0\:dark,html.auto .sf-c-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-100))}html[data-theme='auto'] .sf-c-silver\:10\:dark,html.auto .sf-c-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}html[data-theme='auto'] .sf-c-silver\:20\:dark,html.auto .sf-c-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}html[data-theme='auto'] .sf-c-silver\:30\:dark,html.auto .sf-c-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}html[data-theme='auto'] .sf-c-silver\:40\:dark,html.auto .sf-c-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-60))}html[data-theme='auto'] .sf-c-silver\:50\:dark,html.auto .sf-c-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-50))}html[data-theme='auto'] .sf-c-silver\:60\:dark,html.auto .sf-c-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}html[data-theme='auto'] .sf-c-silver\:70\:dark,html.auto .sf-c-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}html[data-theme='auto'] .sf-c-silver\:80\:dark,html.auto .sf-c-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}html[data-theme='auto'] .sf-c-silver\:90\:dark,html.auto .sf-c-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}html[data-theme='auto'] .sf-c-silver\:100\:dark,html.auto .sf-c-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}html[data-theme='auto'] .sf-c-txt-silver,html.auto .sf-c-txt-silver{color:hsl(var(--sf-c-txt-silver))}html[data-theme='auto'] .sf-c-txt-silver\:0,html.auto .sf-c-txt-silver\:0{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='auto'] .sf-c-txt-silver\:10,html.auto .sf-c-txt-silver\:10{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='auto'] .sf-c-txt-silver\:20,html.auto .sf-c-txt-silver\:20{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='auto'] .sf-c-txt-silver\:30,html.auto .sf-c-txt-silver\:30{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='auto'] .sf-c-txt-silver\:40,html.auto .sf-c-txt-silver\:40{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='auto'] .sf-c-txt-silver\:50,html.auto .sf-c-txt-silver\:50{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='auto'] .sf-c-txt-silver\:60,html.auto .sf-c-txt-silver\:60{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='auto'] .sf-c-txt-silver\:70,html.auto .sf-c-txt-silver\:70{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='auto'] .sf-c-txt-silver\:80,html.auto .sf-c-txt-silver\:80{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='auto'] .sf-c-txt-silver\:90,html.auto .sf-c-txt-silver\:90{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='auto'] .sf-c-txt-silver\:100,html.auto .sf-c-txt-silver\:100{color:hsl(var(--sf-c-txt-silver-100))}html[data-theme='auto'] .sf-c-txt-silver\:dark,html.auto .sf-c-txt-silver\:dark{color:hsl(var(--sf-c-txt-silver))}html[data-theme='auto'] .sf-c-txt-silver\:0\:dark,html.auto .sf-c-txt-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='auto'] .sf-c-txt-silver\:10\:dark,html.auto .sf-c-txt-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='auto'] .sf-c-txt-silver\:20\:dark,html.auto .sf-c-txt-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='auto'] .sf-c-txt-silver\:30\:dark,html.auto .sf-c-txt-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='auto'] .sf-c-txt-silver\:40\:dark,html.auto .sf-c-txt-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='auto'] .sf-c-txt-silver\:50\:dark,html.auto .sf-c-txt-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='auto'] .sf-c-txt-silver\:60\:dark,html.auto .sf-c-txt-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='auto'] .sf-c-txt-silver\:70\:dark,html.auto .sf-c-txt-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='auto'] .sf-c-txt-silver\:80\:dark,html.auto .sf-c-txt-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='auto'] .sf-c-txt-silver\:90\:dark,html.auto .sf-c-txt-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='auto'] .sf-c-txt-silver\:100\:dark,html.auto .sf-c-txt-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-100))}html.var[data-theme='auto'] .sf-c-silver,html.var.auto .sf-c-silver{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='auto'] .sf-c-silver\:0,html.var.auto .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-silver\:10,html.var.auto .sf-c-silver\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-silver\:20,html.var.auto .sf-c-silver\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-silver\:30,html.var.auto .sf-c-silver\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-silver\:40,html.var.auto .sf-c-silver\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-silver\:50,html.var.auto .sf-c-silver\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-silver\:60,html.var.auto .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-silver\:70,html.var.auto .sf-c-silver\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-silver\:80,html.var.auto .sf-c-silver\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-silver\:90,html.var.auto .sf-c-silver\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-silver\:100,html.var.auto .sf-c-silver\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-silver\:dark,html.var.auto .sf-c-silver\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='auto'] .sf-c-silver\:0\:dark,html.var.auto .sf-c-silver\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-silver\:10\:dark,html.var.auto .sf-c-silver\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-silver\:20\:dark,html.var.auto .sf-c-silver\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-silver\:30\:dark,html.var.auto .sf-c-silver\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-silver\:40\:dark,html.var.auto .sf-c-silver\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-silver\:50\:dark,html.var.auto .sf-c-silver\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-silver\:60\:dark,html.var.auto .sf-c-silver\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-silver\:70\:dark,html.var.auto .sf-c-silver\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-silver\:80\:dark,html.var.auto .sf-c-silver\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-silver\:90\:dark,html.var.auto .sf-c-silver\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-silver\:100\:dark,html.var.auto .sf-c-silver\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver,html.auto .sf-c-txt-silver{color:hsl(0,0%,75%)}html.var[data-theme='auto'] .sf-c-txt-silver\:0,html.auto .sf-c-txt-silver\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver\:10,html.auto .sf-c-txt-silver\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-silver\:20,html.auto .sf-c-txt-silver\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-silver\:30,html.auto .sf-c-txt-silver\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-silver\:40,html.auto .sf-c-txt-silver\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-silver\:50,html.auto .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-silver\:60,html.auto .sf-c-txt-silver\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-silver\:70,html.auto .sf-c-txt-silver\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-silver\:80,html.auto .sf-c-txt-silver\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-silver\:90,html.auto .sf-c-txt-silver\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-silver\:100,html.auto .sf-c-txt-silver\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-silver\:dark,html.auto .sf-c-txt-silver\:dark{color:hsl(0,0%,75%)}html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark,html.auto .sf-c-txt-silver\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark,html.auto .sf-c-txt-silver\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark,html.auto .sf-c-txt-silver\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark,html.auto .sf-c-txt-silver\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark,html.auto .sf-c-txt-silver\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark,html.auto .sf-c-txt-silver\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark,html.auto .sf-c-txt-silver\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark,html.auto .sf-c-txt-silver\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark,html.auto .sf-c-txt-silver\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark,html.auto .sf-c-txt-silver\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark,html.auto .sf-c-txt-silver\:100\:dark{color:hsl(0,0%,100%)}}.sf-c-teal{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal))}.sf-c-teal\:0{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}.sf-c-teal\:10{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}.sf-c-teal\:20{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}.sf-c-teal\:30{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-30))}.sf-c-teal\:40{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-40))}.sf-c-teal\:50{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}.sf-c-teal\:60{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}.sf-c-teal\:70{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}.sf-c-teal\:80{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}.sf-c-teal\:90{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}.sf-c-teal\:100{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-100))}html.var .sf-c-teal{color:hsl(180,100%,90%);background:hsl(180,100%,25%)}html.var .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var .sf-c-teal\:10{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var .sf-c-teal\:20{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var .sf-c-teal\:30{color:hsl(180,100%,90%);background:hsl(180,100%,30%)}html.var .sf-c-teal\:40{color:hsl(180,100%,90%);background:hsl(180,100%,40%)}html.var .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var .sf-c-teal\:80{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var .sf-c-teal\:90{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var .sf-c-teal\:100{color:hsl(180,100%,10%);background:hsl(180,100%,100%)}.sf-c-txt-teal{color:hsl(var(--sf-dark-c-txt-teal))}.sf-c-txt-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-100))}.sf-c-txt-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-90))}.sf-c-txt-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-80))}.sf-c-txt-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-70))}.sf-c-txt-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-60))}.sf-c-txt-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-50))}.sf-c-txt-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-40))}.sf-c-txt-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-30))}.sf-c-txt-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-20))}.sf-c-txt-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-10))}.sf-c-txt-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-0))}html.var .sf-c-txt-teal{color:hsl(180,100%,75%)}html.var .sf-c-txt-teal\:0{color:hsl(180,100%,100%)}html.var .sf-c-txt-teal\:10{color:hsl(180,100%,90%)}html.var .sf-c-txt-teal\:20{color:hsl(180,100%,80%)}html.var .sf-c-txt-teal\:30{color:hsl(180,100%,70%)}html.var .sf-c-txt-teal\:40{color:hsl(180,100%,60%)}html.var .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var .sf-c-txt-teal\:60{color:hsl(180,100%,40%)}html.var .sf-c-txt-teal\:70{color:hsl(180,100%,30%)}html.var .sf-c-txt-teal\:80{color:hsl(180,100%,20%)}html.var .sf-c-txt-teal\:90{color:hsl(180,100%,10%)}html.var .sf-c-txt-teal\:100{color:hsl(180,100%,0%)}html[data-theme='dark'] .sf-c-teal,html.dark .sf-c-teal{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal))}html[data-theme='dark'] .sf-c-teal\:0,html.dark .sf-c-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-100))}html[data-theme='dark'] .sf-c-teal\:10,html.dark .sf-c-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-90))}html[data-theme='dark'] .sf-c-teal\:20,html.dark .sf-c-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-80))}html[data-theme='dark'] .sf-c-teal\:30,html.dark .sf-c-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-70))}html[data-theme='dark'] .sf-c-teal\:40,html.dark .sf-c-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-60))}html[data-theme='dark'] .sf-c-teal\:50,html.dark .sf-c-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-50))}html[data-theme='dark'] .sf-c-teal\:60,html.dark .sf-c-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-40))}html[data-theme='dark'] .sf-c-teal\:70,html.dark .sf-c-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-30))}html[data-theme='dark'] .sf-c-teal\:80,html.dark .sf-c-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-20))}html[data-theme='dark'] .sf-c-teal\:90,html.dark .sf-c-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-10))}html[data-theme='dark'] .sf-c-teal\:100,html.dark .sf-c-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-0))}html[data-theme='dark'] .sf-c-teal\:dark,html.dark .sf-c-teal\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal))}html[data-theme='dark'] .sf-c-teal\:0\:dark,html.dark .sf-c-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-100))}html[data-theme='dark'] .sf-c-teal\:10\:dark,html.dark .sf-c-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}html[data-theme='dark'] .sf-c-teal\:20\:dark,html.dark .sf-c-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}html[data-theme='dark'] .sf-c-teal\:30\:dark,html.dark .sf-c-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}html[data-theme='dark'] .sf-c-teal\:40\:dark,html.dark .sf-c-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}html[data-theme='dark'] .sf-c-teal\:50\:dark,html.dark .sf-c-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}html[data-theme='dark'] .sf-c-teal\:60\:dark,html.dark .sf-c-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-40))}html[data-theme='dark'] .sf-c-teal\:70\:dark,html.dark .sf-c-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-30))}html[data-theme='dark'] .sf-c-teal\:80\:dark,html.dark .sf-c-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}html[data-theme='dark'] .sf-c-teal\:90\:dark,html.dark .sf-c-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}html[data-theme='dark'] .sf-c-teal\:100\:dark,html.dark .sf-c-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}html[data-theme='dark'] .sf-c-txt-teal,html.dark .sf-c-txt-teal{color:hsl(var(--sf-c-txt-teal))}html[data-theme='dark'] .sf-c-txt-teal\:0,html.dark .sf-c-txt-teal\:0{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='dark'] .sf-c-txt-teal\:10,html.dark .sf-c-txt-teal\:10{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='dark'] .sf-c-txt-teal\:20,html.dark .sf-c-txt-teal\:20{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='dark'] .sf-c-txt-teal\:30,html.dark .sf-c-txt-teal\:30{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='dark'] .sf-c-txt-teal\:40,html.dark .sf-c-txt-teal\:40{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='dark'] .sf-c-txt-teal\:50,html.dark .sf-c-txt-teal\:50{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='dark'] .sf-c-txt-teal\:60,html.dark .sf-c-txt-teal\:60{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='dark'] .sf-c-txt-teal\:70,html.dark .sf-c-txt-teal\:70{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='dark'] .sf-c-txt-teal\:80,html.dark .sf-c-txt-teal\:80{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='dark'] .sf-c-txt-teal\:90,html.dark .sf-c-txt-teal\:90{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='dark'] .sf-c-txt-teal\:100,html.dark .sf-c-txt-teal\:100{color:hsl(var(--sf-c-txt-teal-100))}html[data-theme='dark'] .sf-c-txt-teal\:dark,html.dark .sf-c-txt-teal\:dark{color:hsl(var(--sf-c-txt-teal))}html[data-theme='dark'] .sf-c-txt-teal\:0\:dark,html.dark .sf-c-txt-teal\:0\:dark{color:hsl(var(--sf-dark-c-txt-teal-0))}html[data-theme='dark'] .sf-c-txt-teal\:10\:dark,html.dark .sf-c-txt-teal\:10\:dark{color:hsl(var(--sf-dark-c-txt-teal-10))}html[data-theme='dark'] .sf-c-txt-teal\:20\:dark,html.dark .sf-c-txt-teal\:20\:dark{color:hsl(var(--sf-dark-c-txt-teal-20))}html[data-theme='dark'] .sf-c-txt-teal\:30\:dark,html.dark .sf-c-txt-teal\:30\:dark{color:hsl(var(--sf-dark-c-txt-teal-30))}html[data-theme='dark'] .sf-c-txt-teal\:40\:dark,html.dark .sf-c-txt-teal\:40\:dark{color:hsl(var(--sf-dark-c-txt-teal-40))}html[data-theme='dark'] .sf-c-txt-teal\:50\:dark,html.dark .sf-c-txt-teal\:50\:dark{color:hsl(var(--sf-dark-c-txt-teal-50))}html[data-theme='dark'] .sf-c-txt-teal\:60\:dark,html.dark .sf-c-txt-teal\:60\:dark{color:hsl(var(--sf-dark-c-txt-teal-60))}html[data-theme='dark'] .sf-c-txt-teal\:70\:dark,html.dark .sf-c-txt-teal\:70\:dark{color:hsl(var(--sf-dark-c-txt-teal-70))}html[data-theme='dark'] .sf-c-txt-teal\:80\:dark,html.dark .sf-c-txt-teal\:80\:dark{color:hsl(var(--sf-dark-c-txt-teal-80))}html[data-theme='dark'] .sf-c-txt-teal\:90\:dark,html.dark .sf-c-txt-teal\:90\:dark{color:hsl(var(--sf-dark-c-txt-teal-90))}html[data-theme='dark'] .sf-c-txt-teal\:100\:dark,html.dark .sf-c-txt-teal\:100\:dark{color:hsl(var(--sf-dark-c-txt-teal-100))}html.var[data-theme='dark'] .sf-c-teal,html.var.dark .sf-c-teal{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='dark'] .sf-c-teal\:0,html.var.dark .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-teal\:10,html.var.dark .sf-c-teal\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-teal\:20,html.var.dark .sf-c-teal\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-teal\:30,html.var.dark .sf-c-teal\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-teal\:40,html.var.dark .sf-c-teal\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-teal\:50,html.var.dark .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-teal\:60,html.var.dark .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-teal\:70,html.var.dark .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-teal\:80,html.var.dark .sf-c-teal\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-teal\:90,html.var.dark .sf-c-teal\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-teal\:100,html.var.dark .sf-c-teal\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-teal\:dark,html.var.dark .sf-c-teal\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='dark'] .sf-c-teal\:0\:dark,html.var.dark .sf-c-teal\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-teal\:10\:dark,html.var.dark .sf-c-teal\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-teal\:20\:dark,html.var.dark .sf-c-teal\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-teal\:30\:dark,html.var.dark .sf-c-teal\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-teal\:40\:dark,html.var.dark .sf-c-teal\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-teal\:50\:dark,html.var.dark .sf-c-teal\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-teal\:60\:dark,html.var.dark .sf-c-teal\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-teal\:70\:dark,html.var.dark .sf-c-teal\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-teal\:80\:dark,html.var.dark .sf-c-teal\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-teal\:90\:dark,html.var.dark .sf-c-teal\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-teal\:100\:dark,html.var.dark .sf-c-teal\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal,html.dark .sf-c-txt-teal{color:hsl(180,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-teal\:0,html.dark .sf-c-txt-teal\:0{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal\:10,html.dark .sf-c-txt-teal\:10{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-teal\:20,html.dark .sf-c-txt-teal\:20{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-teal\:30,html.dark .sf-c-txt-teal\:30{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-teal\:40,html.dark .sf-c-txt-teal\:40{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-teal\:50,html.dark .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-teal\:60,html.dark .sf-c-txt-teal\:60{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-teal\:70,html.dark .sf-c-txt-teal\:70{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-teal\:80,html.dark .sf-c-txt-teal\:80{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-teal\:90,html.dark .sf-c-txt-teal\:90{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-teal\:100,html.dark .sf-c-txt-teal\:100{color:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-teal\:dark,html.dark .sf-c-txt-teal\:dark{color:hsl(180,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-teal\:0\:dark,html.dark .sf-c-txt-teal\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal\:10\:dark,html.dark .sf-c-txt-teal\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-teal\:20\:dark,html.dark .sf-c-txt-teal\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-teal\:30\:dark,html.dark .sf-c-txt-teal\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-teal\:40\:dark,html.dark .sf-c-txt-teal\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-teal\:50\:dark,html.dark .sf-c-txt-teal\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-teal\:60\:dark,html.dark .sf-c-txt-teal\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-teal\:70\:dark,html.dark .sf-c-txt-teal\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-teal\:80\:dark,html.dark .sf-c-txt-teal\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-teal\:90\:dark,html.dark .sf-c-txt-teal\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-teal\:100\:dark,html.dark .sf-c-txt-teal\:100\:dark{color:hsl(180,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-teal,html.auto .sf-c-teal{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal))}html[data-theme='auto'] .sf-c-teal\:0,html.auto .sf-c-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-100))}html[data-theme='auto'] .sf-c-teal\:10,html.auto .sf-c-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-90))}html[data-theme='auto'] .sf-c-teal\:20,html.auto .sf-c-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-80))}html[data-theme='auto'] .sf-c-teal\:30,html.auto .sf-c-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-70))}html[data-theme='auto'] .sf-c-teal\:40,html.auto .sf-c-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-60))}html[data-theme='auto'] .sf-c-teal\:50,html.auto .sf-c-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-50))}html[data-theme='auto'] .sf-c-teal\:60,html.auto .sf-c-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-40))}html[data-theme='auto'] .sf-c-teal\:70,html.auto .sf-c-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-30))}html[data-theme='auto'] .sf-c-teal\:80,html.auto .sf-c-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-20))}html[data-theme='auto'] .sf-c-teal\:90,html.auto .sf-c-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-10))}html[data-theme='auto'] .sf-c-teal\:100,html.auto .sf-c-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-0))}html[data-theme='auto'] .sf-c-teal\:dark,html.auto .sf-c-teal\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal))}html[data-theme='auto'] .sf-c-teal\:0\:dark,html.auto .sf-c-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-100))}html[data-theme='auto'] .sf-c-teal\:10\:dark,html.auto .sf-c-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}html[data-theme='auto'] .sf-c-teal\:20\:dark,html.auto .sf-c-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}html[data-theme='auto'] .sf-c-teal\:30\:dark,html.auto .sf-c-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}html[data-theme='auto'] .sf-c-teal\:40\:dark,html.auto .sf-c-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}html[data-theme='auto'] .sf-c-teal\:50\:dark,html.auto .sf-c-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}html[data-theme='auto'] .sf-c-teal\:60\:dark,html.auto .sf-c-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-40))}html[data-theme='auto'] .sf-c-teal\:70\:dark,html.auto .sf-c-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-30))}html[data-theme='auto'] .sf-c-teal\:80\:dark,html.auto .sf-c-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}html[data-theme='auto'] .sf-c-teal\:90\:dark,html.auto .sf-c-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}html[data-theme='auto'] .sf-c-teal\:100\:dark,html.auto .sf-c-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}html[data-theme='auto'] .sf-c-txt-teal,html.auto .sf-c-txt-teal{color:hsl(var(--sf-c-txt-teal))}html[data-theme='auto'] .sf-c-txt-teal\:0,html.auto .sf-c-txt-teal\:0{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='auto'] .sf-c-txt-teal\:10,html.auto .sf-c-txt-teal\:10{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='auto'] .sf-c-txt-teal\:20,html.auto .sf-c-txt-teal\:20{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='auto'] .sf-c-txt-teal\:30,html.auto .sf-c-txt-teal\:30{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='auto'] .sf-c-txt-teal\:40,html.auto .sf-c-txt-teal\:40{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='auto'] .sf-c-txt-teal\:50,html.auto .sf-c-txt-teal\:50{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='auto'] .sf-c-txt-teal\:60,html.auto .sf-c-txt-teal\:60{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='auto'] .sf-c-txt-teal\:70,html.auto .sf-c-txt-teal\:70{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='auto'] .sf-c-txt-teal\:80,html.auto .sf-c-txt-teal\:80{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='auto'] .sf-c-txt-teal\:90,html.auto .sf-c-txt-teal\:90{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='auto'] .sf-c-txt-teal\:100,html.auto .sf-c-txt-teal\:100{color:hsl(var(--sf-c-txt-teal-100))}html[data-theme='auto'] .sf-c-txt-teal\:dark,html.auto .sf-c-txt-teal\:dark{color:hsl(var(--sf-c-txt-teal))}html[data-theme='auto'] .sf-c-txt-teal\:0\:dark,html.auto .sf-c-txt-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='auto'] .sf-c-txt-teal\:10\:dark,html.auto .sf-c-txt-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='auto'] .sf-c-txt-teal\:20\:dark,html.auto .sf-c-txt-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='auto'] .sf-c-txt-teal\:30\:dark,html.auto .sf-c-txt-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='auto'] .sf-c-txt-teal\:40\:dark,html.auto .sf-c-txt-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='auto'] .sf-c-txt-teal\:50\:dark,html.auto .sf-c-txt-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='auto'] .sf-c-txt-teal\:60\:dark,html.auto .sf-c-txt-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='auto'] .sf-c-txt-teal\:70\:dark,html.auto .sf-c-txt-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='auto'] .sf-c-txt-teal\:80\:dark,html.auto .sf-c-txt-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='auto'] .sf-c-txt-teal\:90\:dark,html.auto .sf-c-txt-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='auto'] .sf-c-txt-teal\:100\:dark,html.auto .sf-c-txt-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-100))}html.var[data-theme='auto'] .sf-c-teal,html.var.auto .sf-c-teal{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='auto'] .sf-c-teal\:0,html.var.auto .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-teal\:10,html.var.auto .sf-c-teal\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-teal\:20,html.var.auto .sf-c-teal\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-teal\:30,html.var.auto .sf-c-teal\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-teal\:40,html.var.auto .sf-c-teal\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-teal\:50,html.var.auto .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-teal\:60,html.var.auto .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-teal\:70,html.var.auto .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-teal\:80,html.var.auto .sf-c-teal\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-teal\:90,html.var.auto .sf-c-teal\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-teal\:100,html.var.auto .sf-c-teal\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-teal\:dark,html.var.auto .sf-c-teal\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='auto'] .sf-c-teal\:0\:dark,html.var.auto .sf-c-teal\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-teal\:10\:dark,html.var.auto .sf-c-teal\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-teal\:20\:dark,html.var.auto .sf-c-teal\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-teal\:30\:dark,html.var.auto .sf-c-teal\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-teal\:40\:dark,html.var.auto .sf-c-teal\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-teal\:50\:dark,html.var.auto .sf-c-teal\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-teal\:60\:dark,html.var.auto .sf-c-teal\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-teal\:70\:dark,html.var.auto .sf-c-teal\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-teal\:80\:dark,html.var.auto .sf-c-teal\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-teal\:90\:dark,html.var.auto .sf-c-teal\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-teal\:100\:dark,html.var.auto .sf-c-teal\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal,html.auto .sf-c-txt-teal{color:hsl(180,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-teal\:0,html.auto .sf-c-txt-teal\:0{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal\:10,html.auto .sf-c-txt-teal\:10{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-teal\:20,html.auto .sf-c-txt-teal\:20{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-teal\:30,html.auto .sf-c-txt-teal\:30{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-teal\:40,html.auto .sf-c-txt-teal\:40{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-teal\:50,html.auto .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-teal\:60,html.auto .sf-c-txt-teal\:60{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-teal\:70,html.auto .sf-c-txt-teal\:70{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-teal\:80,html.auto .sf-c-txt-teal\:80{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-teal\:90,html.auto .sf-c-txt-teal\:90{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-teal\:100,html.auto .sf-c-txt-teal\:100{color:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-teal\:dark,html.auto .sf-c-txt-teal\:dark{color:hsl(180,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark,html.auto .sf-c-txt-teal\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark,html.auto .sf-c-txt-teal\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark,html.auto .sf-c-txt-teal\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark,html.auto .sf-c-txt-teal\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark,html.auto .sf-c-txt-teal\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark,html.auto .sf-c-txt-teal\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark,html.auto .sf-c-txt-teal\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark,html.auto .sf-c-txt-teal\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark,html.auto .sf-c-txt-teal\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark,html.auto .sf-c-txt-teal\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark,html.auto .sf-c-txt-teal\:100\:dark{color:hsl(180,100%,100%)}}.sf-c-white{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white))}.sf-c-white\:0{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}.sf-c-white\:10{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}.sf-c-white\:20{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}.sf-c-white\:30{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}.sf-c-white\:40{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}.sf-c-white\:50{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-50))}.sf-c-white\:60{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-60))}.sf-c-white\:70{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}.sf-c-white\:80{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}.sf-c-white\:90{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}.sf-c-white\:100{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-100))}html.var .sf-c-white{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-white\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-white\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-white\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-white\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-white\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-white\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-white\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-white\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-white\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-white{color:hsl(var(--sf-dark-c-txt-white))}.sf-c-txt-white\:0{color:hsl(var(--sf-dark-c-txt-white-100))}.sf-c-txt-white\:10{color:hsl(var(--sf-dark-c-txt-white-90))}.sf-c-txt-white\:20{color:hsl(var(--sf-dark-c-txt-white-80))}.sf-c-txt-white\:30{color:hsl(var(--sf-dark-c-txt-white-70))}.sf-c-txt-white\:40{color:hsl(var(--sf-dark-c-txt-white-60))}.sf-c-txt-white\:50{color:hsl(var(--sf-dark-c-txt-white-50))}.sf-c-txt-white\:60{color:hsl(var(--sf-dark-c-txt-white-40))}.sf-c-txt-white\:70{color:hsl(var(--sf-dark-c-txt-white-30))}.sf-c-txt-white\:80{color:hsl(var(--sf-dark-c-txt-white-20))}.sf-c-txt-white\:90{color:hsl(var(--sf-dark-c-txt-white-10))}.sf-c-txt-white\:100{color:hsl(var(--sf-dark-c-txt-white-0))}html.var .sf-c-txt-white{color:hsl(0,0%,0%)}html.var .sf-c-txt-white\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-white\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-white\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-white\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-white\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-white\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-white\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-white\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-white\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-white\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-white,html.dark .sf-c-white{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white))}html[data-theme='dark'] .sf-c-white\:0,html.dark .sf-c-white\:0{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-100))}html[data-theme='dark'] .sf-c-white\:10,html.dark .sf-c-white\:10{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-90))}html[data-theme='dark'] .sf-c-white\:20,html.dark .sf-c-white\:20{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-80))}html[data-theme='dark'] .sf-c-white\:30,html.dark .sf-c-white\:30{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-70))}html[data-theme='dark'] .sf-c-white\:40,html.dark .sf-c-white\:40{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-60))}html[data-theme='dark'] .sf-c-white\:50,html.dark .sf-c-white\:50{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-50))}html[data-theme='dark'] .sf-c-white\:60,html.dark .sf-c-white\:60{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-40))}html[data-theme='dark'] .sf-c-white\:70,html.dark .sf-c-white\:70{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-30))}html[data-theme='dark'] .sf-c-white\:80,html.dark .sf-c-white\:80{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-20))}html[data-theme='dark'] .sf-c-white\:90,html.dark .sf-c-white\:90{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-10))}html[data-theme='dark'] .sf-c-white\:100,html.dark .sf-c-white\:100{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-0))}html[data-theme='dark'] .sf-c-white\:dark,html.dark .sf-c-white\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white))}html[data-theme='dark'] .sf-c-white\:0\:dark,html.dark .sf-c-white\:0\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-100))}html[data-theme='dark'] .sf-c-white\:10\:dark,html.dark .sf-c-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}html[data-theme='dark'] .sf-c-white\:20\:dark,html.dark .sf-c-white\:20\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}html[data-theme='dark'] .sf-c-white\:30\:dark,html.dark .sf-c-white\:30\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}html[data-theme='dark'] .sf-c-white\:40\:dark,html.dark .sf-c-white\:40\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-60))}html[data-theme='dark'] .sf-c-white\:50\:dark,html.dark .sf-c-white\:50\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-50))}html[data-theme='dark'] .sf-c-white\:60\:dark,html.dark .sf-c-white\:60\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}html[data-theme='dark'] .sf-c-white\:70\:dark,html.dark .sf-c-white\:70\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}html[data-theme='dark'] .sf-c-white\:80\:dark,html.dark .sf-c-white\:80\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}html[data-theme='dark'] .sf-c-white\:90\:dark,html.dark .sf-c-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}html[data-theme='dark'] .sf-c-white\:100\:dark,html.dark .sf-c-white\:100\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}html[data-theme='dark'] .sf-c-txt-white,html.dark .sf-c-txt-white{color:hsl(var(--sf-c-txt-white))}html[data-theme='dark'] .sf-c-txt-white\:0,html.dark .sf-c-txt-white\:0{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='dark'] .sf-c-txt-white\:10,html.dark .sf-c-txt-white\:10{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='dark'] .sf-c-txt-white\:20,html.dark .sf-c-txt-white\:20{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='dark'] .sf-c-txt-white\:30,html.dark .sf-c-txt-white\:30{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='dark'] .sf-c-txt-white\:40,html.dark .sf-c-txt-white\:40{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='dark'] .sf-c-txt-white\:50,html.dark .sf-c-txt-white\:50{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='dark'] .sf-c-txt-white\:60,html.dark .sf-c-txt-white\:60{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='dark'] .sf-c-txt-white\:70,html.dark .sf-c-txt-white\:70{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='dark'] .sf-c-txt-white\:80,html.dark .sf-c-txt-white\:80{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='dark'] .sf-c-txt-white\:90,html.dark .sf-c-txt-white\:90{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='dark'] .sf-c-txt-white\:100,html.dark .sf-c-txt-white\:100{color:hsl(var(--sf-c-txt-white-100))}html[data-theme='dark'] .sf-c-txt-white\:dark,html.dark .sf-c-txt-white\:dark{color:hsl(var(--sf-c-txt-white))}html[data-theme='dark'] .sf-c-txt-white\:0\:dark,html.dark .sf-c-txt-white\:0\:dark{color:hsl(var(--sf-dark-c-txt-white-0))}html[data-theme='dark'] .sf-c-txt-white\:10\:dark,html.dark .sf-c-txt-white\:10\:dark{color:hsl(var(--sf-dark-c-txt-white-10))}html[data-theme='dark'] .sf-c-txt-white\:20\:dark,html.dark .sf-c-txt-white\:20\:dark{color:hsl(var(--sf-dark-c-txt-white-20))}html[data-theme='dark'] .sf-c-txt-white\:30\:dark,html.dark .sf-c-txt-white\:30\:dark{color:hsl(var(--sf-dark-c-txt-white-30))}html[data-theme='dark'] .sf-c-txt-white\:40\:dark,html.dark .sf-c-txt-white\:40\:dark{color:hsl(var(--sf-dark-c-txt-white-40))}html[data-theme='dark'] .sf-c-txt-white\:50\:dark,html.dark .sf-c-txt-white\:50\:dark{color:hsl(var(--sf-dark-c-txt-white-50))}html[data-theme='dark'] .sf-c-txt-white\:60\:dark,html.dark .sf-c-txt-white\:60\:dark{color:hsl(var(--sf-dark-c-txt-white-60))}html[data-theme='dark'] .sf-c-txt-white\:70\:dark,html.dark .sf-c-txt-white\:70\:dark{color:hsl(var(--sf-dark-c-txt-white-70))}html[data-theme='dark'] .sf-c-txt-white\:80\:dark,html.dark .sf-c-txt-white\:80\:dark{color:hsl(var(--sf-dark-c-txt-white-80))}html[data-theme='dark'] .sf-c-txt-white\:90\:dark,html.dark .sf-c-txt-white\:90\:dark{color:hsl(var(--sf-dark-c-txt-white-90))}html[data-theme='dark'] .sf-c-txt-white\:100\:dark,html.dark .sf-c-txt-white\:100\:dark{color:hsl(var(--sf-dark-c-txt-white-100))}html.var[data-theme='dark'] .sf-c-white,html.var.dark .sf-c-white{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:0,html.var.dark .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-white\:10,html.var.dark .sf-c-white\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-white\:20,html.var.dark .sf-c-white\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-white\:30,html.var.dark .sf-c-white\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-white\:40,html.var.dark .sf-c-white\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-white\:50,html.var.dark .sf-c-white\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-white\:60,html.var.dark .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-white\:70,html.var.dark .sf-c-white\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-white\:80,html.var.dark .sf-c-white\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-white\:90,html.var.dark .sf-c-white\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-white\:100,html.var.dark .sf-c-white\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:dark,html.var.dark .sf-c-white\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:0\:dark,html.var.dark .sf-c-white\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-white\:10\:dark,html.var.dark .sf-c-white\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-white\:20\:dark,html.var.dark .sf-c-white\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-white\:30\:dark,html.var.dark .sf-c-white\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-white\:40\:dark,html.var.dark .sf-c-white\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-white\:50\:dark,html.var.dark .sf-c-white\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-white\:60\:dark,html.var.dark .sf-c-white\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-white\:70\:dark,html.var.dark .sf-c-white\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-white\:80\:dark,html.var.dark .sf-c-white\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-white\:90\:dark,html.var.dark .sf-c-white\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-white\:100\:dark,html.var.dark .sf-c-white\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white,html.dark .sf-c-txt-white{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:0,html.dark .sf-c-txt-white\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white\:10,html.dark .sf-c-txt-white\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-white\:20,html.dark .sf-c-txt-white\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-white\:30,html.dark .sf-c-txt-white\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-white\:40,html.dark .sf-c-txt-white\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-white\:50,html.dark .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-white\:60,html.dark .sf-c-txt-white\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-white\:70,html.dark .sf-c-txt-white\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-white\:80,html.dark .sf-c-txt-white\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-white\:90,html.dark .sf-c-txt-white\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-white\:100,html.dark .sf-c-txt-white\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:dark,html.dark .sf-c-txt-white\:dark{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:0\:dark,html.dark .sf-c-txt-white\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white\:10\:dark,html.dark .sf-c-txt-white\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-white\:20\:dark,html.dark .sf-c-txt-white\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-white\:30\:dark,html.dark .sf-c-txt-white\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-white\:40\:dark,html.dark .sf-c-txt-white\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-white\:50\:dark,html.dark .sf-c-txt-white\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-white\:60\:dark,html.dark .sf-c-txt-white\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-white\:70\:dark,html.dark .sf-c-txt-white\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-white\:80\:dark,html.dark .sf-c-txt-white\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-white\:90\:dark,html.dark .sf-c-txt-white\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-white\:100\:dark,html.dark .sf-c-txt-white\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-white,html.auto .sf-c-white{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white))}html[data-theme='auto'] .sf-c-white\:0,html.auto .sf-c-white\:0{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-100))}html[data-theme='auto'] .sf-c-white\:10,html.auto .sf-c-white\:10{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-90))}html[data-theme='auto'] .sf-c-white\:20,html.auto .sf-c-white\:20{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-80))}html[data-theme='auto'] .sf-c-white\:30,html.auto .sf-c-white\:30{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-70))}html[data-theme='auto'] .sf-c-white\:40,html.auto .sf-c-white\:40{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-60))}html[data-theme='auto'] .sf-c-white\:50,html.auto .sf-c-white\:50{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-50))}html[data-theme='auto'] .sf-c-white\:60,html.auto .sf-c-white\:60{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-40))}html[data-theme='auto'] .sf-c-white\:70,html.auto .sf-c-white\:70{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-30))}html[data-theme='auto'] .sf-c-white\:80,html.auto .sf-c-white\:80{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-20))}html[data-theme='auto'] .sf-c-white\:90,html.auto .sf-c-white\:90{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-10))}html[data-theme='auto'] .sf-c-white\:100,html.auto .sf-c-white\:100{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-0))}html[data-theme='auto'] .sf-c-white\:dark,html.auto .sf-c-white\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white))}html[data-theme='auto'] .sf-c-white\:0\:dark,html.auto .sf-c-white\:0\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-100))}html[data-theme='auto'] .sf-c-white\:10\:dark,html.auto .sf-c-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}html[data-theme='auto'] .sf-c-white\:20\:dark,html.auto .sf-c-white\:20\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}html[data-theme='auto'] .sf-c-white\:30\:dark,html.auto .sf-c-white\:30\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}html[data-theme='auto'] .sf-c-white\:40\:dark,html.auto .sf-c-white\:40\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-60))}html[data-theme='auto'] .sf-c-white\:50\:dark,html.auto .sf-c-white\:50\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-50))}html[data-theme='auto'] .sf-c-white\:60\:dark,html.auto .sf-c-white\:60\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}html[data-theme='auto'] .sf-c-white\:70\:dark,html.auto .sf-c-white\:70\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}html[data-theme='auto'] .sf-c-white\:80\:dark,html.auto .sf-c-white\:80\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}html[data-theme='auto'] .sf-c-white\:90\:dark,html.auto .sf-c-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}html[data-theme='auto'] .sf-c-white\:100\:dark,html.auto .sf-c-white\:100\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}html[data-theme='auto'] .sf-c-txt-white,html.auto .sf-c-txt-white{color:hsl(var(--sf-c-txt-white))}html[data-theme='auto'] .sf-c-txt-white\:0,html.auto .sf-c-txt-white\:0{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='auto'] .sf-c-txt-white\:10,html.auto .sf-c-txt-white\:10{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='auto'] .sf-c-txt-white\:20,html.auto .sf-c-txt-white\:20{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='auto'] .sf-c-txt-white\:30,html.auto .sf-c-txt-white\:30{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='auto'] .sf-c-txt-white\:40,html.auto .sf-c-txt-white\:40{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='auto'] .sf-c-txt-white\:50,html.auto .sf-c-txt-white\:50{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='auto'] .sf-c-txt-white\:60,html.auto .sf-c-txt-white\:60{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='auto'] .sf-c-txt-white\:70,html.auto .sf-c-txt-white\:70{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='auto'] .sf-c-txt-white\:80,html.auto .sf-c-txt-white\:80{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='auto'] .sf-c-txt-white\:90,html.auto .sf-c-txt-white\:90{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='auto'] .sf-c-txt-white\:100,html.auto .sf-c-txt-white\:100{color:hsl(var(--sf-c-txt-white-100))}html[data-theme='auto'] .sf-c-txt-white\:dark,html.auto .sf-c-txt-white\:dark{color:hsl(var(--sf-c-txt-white))}html[data-theme='auto'] .sf-c-txt-white\:0\:dark,html.auto .sf-c-txt-white\:0\:dark{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='auto'] .sf-c-txt-white\:10\:dark,html.auto .sf-c-txt-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='auto'] .sf-c-txt-white\:20\:dark,html.auto .sf-c-txt-white\:20\:dark{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='auto'] .sf-c-txt-white\:30\:dark,html.auto .sf-c-txt-white\:30\:dark{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='auto'] .sf-c-txt-white\:40\:dark,html.auto .sf-c-txt-white\:40\:dark{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='auto'] .sf-c-txt-white\:50\:dark,html.auto .sf-c-txt-white\:50\:dark{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='auto'] .sf-c-txt-white\:60\:dark,html.auto .sf-c-txt-white\:60\:dark{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='auto'] .sf-c-txt-white\:70\:dark,html.auto .sf-c-txt-white\:70\:dark{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='auto'] .sf-c-txt-white\:80\:dark,html.auto .sf-c-txt-white\:80\:dark{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='auto'] .sf-c-txt-white\:90\:dark,html.auto .sf-c-txt-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='auto'] .sf-c-txt-white\:100\:dark,html.auto .sf-c-txt-white\:100\:dark{color:hsl(var(--sf-c-txt-white-100))}html.var[data-theme='auto'] .sf-c-white,html.var.auto .sf-c-white{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:0,html.var.auto .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-white\:10,html.var.auto .sf-c-white\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-white\:20,html.var.auto .sf-c-white\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-white\:30,html.var.auto .sf-c-white\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-white\:40,html.var.auto .sf-c-white\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-white\:50,html.var.auto .sf-c-white\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-white\:60,html.var.auto .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-white\:70,html.var.auto .sf-c-white\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-white\:80,html.var.auto .sf-c-white\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-white\:90,html.var.auto .sf-c-white\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-white\:100,html.var.auto .sf-c-white\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:dark,html.var.auto .sf-c-white\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:0\:dark,html.var.auto .sf-c-white\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-white\:10\:dark,html.var.auto .sf-c-white\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-white\:20\:dark,html.var.auto .sf-c-white\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-white\:30\:dark,html.var.auto .sf-c-white\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-white\:40\:dark,html.var.auto .sf-c-white\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-white\:50\:dark,html.var.auto .sf-c-white\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-white\:60\:dark,html.var.auto .sf-c-white\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-white\:70\:dark,html.var.auto .sf-c-white\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-white\:80\:dark,html.var.auto .sf-c-white\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-white\:90\:dark,html.var.auto .sf-c-white\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-white\:100\:dark,html.var.auto .sf-c-white\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white,html.auto .sf-c-txt-white{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:0,html.auto .sf-c-txt-white\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white\:10,html.auto .sf-c-txt-white\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-white\:20,html.auto .sf-c-txt-white\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-white\:30,html.auto .sf-c-txt-white\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-white\:40,html.auto .sf-c-txt-white\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-white\:50,html.auto .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-white\:60,html.auto .sf-c-txt-white\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-white\:70,html.auto .sf-c-txt-white\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-white\:80,html.auto .sf-c-txt-white\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-white\:90,html.auto .sf-c-txt-white\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-white\:100,html.auto .sf-c-txt-white\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:dark,html.auto .sf-c-txt-white\:dark{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark,html.auto .sf-c-txt-white\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark,html.auto .sf-c-txt-white\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark,html.auto .sf-c-txt-white\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark,html.auto .sf-c-txt-white\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark,html.auto .sf-c-txt-white\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark,html.auto .sf-c-txt-white\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark,html.auto .sf-c-txt-white\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark,html.auto .sf-c-txt-white\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark,html.auto .sf-c-txt-white\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark,html.auto .sf-c-txt-white\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark,html.auto .sf-c-txt-white\:100\:dark{color:hsl(0,0%,100%)}}.sf-c-yellow{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}.sf-c-yellow\:0{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}.sf-c-yellow\:10{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}.sf-c-yellow\:20{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}.sf-c-yellow\:30{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-30))}.sf-c-yellow\:40{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-40))}.sf-c-yellow\:50{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}.sf-c-yellow\:60{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}.sf-c-yellow\:70{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}.sf-c-yellow\:80{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}.sf-c-yellow\:90{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}.sf-c-yellow\:100{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-100))}html.var .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-yellow\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-yellow\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-yellow\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-yellow\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-yellow\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-yellow\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-yellow\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-yellow{color:hsl(var(--sf-dark-c-txt-yellow))}.sf-c-txt-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-100))}.sf-c-txt-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-90))}.sf-c-txt-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-80))}.sf-c-txt-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-70))}.sf-c-txt-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-60))}.sf-c-txt-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-50))}.sf-c-txt-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-40))}.sf-c-txt-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-30))}.sf-c-txt-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-20))}.sf-c-txt-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-10))}.sf-c-txt-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-0))}html.var .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-yellow\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-yellow\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-yellow\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-yellow\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-yellow\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-yellow\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-yellow\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-yellow\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-yellow,html.dark .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0,html.dark .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10,html.dark .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20,html.dark .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30,html.dark .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40,html.dark .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50,html.dark .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60,html.dark .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70,html.dark .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80,html.dark .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90,html.dark .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100,html.dark .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='dark'] .sf-c-yellow\:dark,html.dark .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0\:dark,html.dark .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10\:dark,html.dark .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20\:dark,html.dark .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30\:dark,html.dark .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40\:dark,html.dark .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50\:dark,html.dark .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60\:dark,html.dark .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70\:dark,html.dark .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80\:dark,html.dark .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90\:dark,html.dark .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100\:dark,html.dark .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-dark-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-dark-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-dark-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-dark-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-dark-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-dark-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-dark-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-dark-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-dark-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-dark-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-dark-c-txt-yellow-100))}html.var[data-theme='dark'] .sf-c-yellow,html.var.dark .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0,html.var.dark .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10,html.var.dark .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20,html.var.dark .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30,html.var.dark .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40,html.var.dark .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50,html.var.dark .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60,html.var.dark .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70,html.var.dark .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80,html.var.dark .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90,html.var.dark .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100,html.var.dark .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-yellow\:dark,html.var.dark .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0\:dark,html.var.dark .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10\:dark,html.var.dark .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20\:dark,html.var.dark .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30\:dark,html.var.dark .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40\:dark,html.var.dark .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50\:dark,html.var.dark .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60\:dark,html.var.dark .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70\:dark,html.var.dark .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80\:dark,html.var.dark .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90\:dark,html.var.dark .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100\:dark,html.var.dark .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-yellow,html.auto .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0,html.auto .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10,html.auto .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20,html.auto .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30,html.auto .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40,html.auto .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50,html.auto .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60,html.auto .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70,html.auto .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80,html.auto .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90,html.auto .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100,html.auto .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='auto'] .sf-c-yellow\:dark,html.auto .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0\:dark,html.auto .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10\:dark,html.auto .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20\:dark,html.auto .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30\:dark,html.auto .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40\:dark,html.auto .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50\:dark,html.auto .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60\:dark,html.auto .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70\:dark,html.auto .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80\:dark,html.auto .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90\:dark,html.auto .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100\:dark,html.auto .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-100))}html.var[data-theme='auto'] .sf-c-yellow,html.var.auto .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0,html.var.auto .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10,html.var.auto .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20,html.var.auto .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30,html.var.auto .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40,html.var.auto .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50,html.var.auto .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60,html.var.auto .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70,html.var.auto .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80,html.var.auto .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90,html.var.auto .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100,html.var.auto .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-yellow\:dark,html.var.auto .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0\:dark,html.var.auto .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10\:dark,html.var.auto .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20\:dark,html.var.auto .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30\:dark,html.var.auto .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40\:dark,html.var.auto .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50\:dark,html.var.auto .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60\:dark,html.var.auto .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70\:dark,html.var.auto .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80\:dark,html.var.auto .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90\:dark,html.var.auto .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100\:dark,html.var.auto .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}} \ No newline at end of file +[class*='aqua']{--sf-c-aqua:180 100% 50%;--sf-c-aqua-0:180 100% 0%;--sf-c-aqua-10:180 100% 10%;--sf-c-aqua-20:180 100% 20%;--sf-c-aqua-30:180 100% 30%;--sf-c-aqua-40:180 100% 40%;--sf-c-aqua-50:180 100% 50%;--sf-c-aqua-60:180 100% 60%;--sf-c-aqua-70:180 100% 70%;--sf-c-aqua-80:180 100% 80%;--sf-c-aqua-90:180 100% 90%;--sf-c-aqua-100:180 100% 100%;--sf-c-txt-aqua:var(--sf-c-aqua);--sf-c-txt-aqua-0:var(--sf-c-aqua-0);--sf-c-txt-aqua-10:var(--sf-c-aqua-10);--sf-c-txt-aqua-20:var(--sf-c-aqua-20);--sf-c-txt-aqua-30:var(--sf-c-aqua-30);--sf-c-txt-aqua-40:var(--sf-c-aqua-40);--sf-c-txt-aqua-50:var(--sf-c-aqua-50);--sf-c-txt-aqua-60:var(--sf-c-aqua-60);--sf-c-txt-aqua-70:var(--sf-c-aqua-70);--sf-c-txt-aqua-80:var(--sf-c-aqua-80);--sf-c-txt-aqua-90:var(--sf-c-aqua-90);--sf-c-txt-aqua-100:var(--sf-c-aqua-100);--sf-dark-c-aqua:180 100% 50%;--sf-dark-c-aqua-0:180 100% 0%;--sf-dark-c-aqua-10:180 100% 10%;--sf-dark-c-aqua-20:180 100% 20%;--sf-dark-c-aqua-30:180 100% 30%;--sf-dark-c-aqua-40:180 100% 40%;--sf-dark-c-aqua-50:180 100% 50%;--sf-dark-c-aqua-60:180 100% 60%;--sf-dark-c-aqua-70:180 100% 70%;--sf-dark-c-aqua-80:180 100% 80%;--sf-dark-c-aqua-90:180 100% 90%;--sf-dark-c-aqua-100:180 100% 100%;--sf-dark-c-txt-aqua:var(--sf-dark-c-aqua);--sf-dark-c-txt-aqua-0:var(--sf-dark-c-aqua-0);--sf-dark-c-txt-aqua-10:var(--sf-dark-c-aqua-10);--sf-dark-c-txt-aqua-20:var(--sf-dark-c-aqua-20);--sf-dark-c-txt-aqua-30:var(--sf-dark-c-aqua-30);--sf-dark-c-txt-aqua-40:var(--sf-dark-c-aqua-40);--sf-dark-c-txt-aqua-50:var(--sf-dark-c-aqua-50);--sf-dark-c-txt-aqua-60:var(--sf-dark-c-aqua-60);--sf-dark-c-txt-aqua-70:var(--sf-dark-c-aqua-70);--sf-dark-c-txt-aqua-80:var(--sf-dark-c-aqua-80);--sf-dark-c-txt-aqua-90:var(--sf-dark-c-aqua-90);--sf-dark-c-txt-aqua-100:var(--sf-dark-c-aqua-100)}.sf-c-aqua{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}.sf-c-aqua\:0{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}.sf-c-aqua\:10{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}.sf-c-aqua\:20{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}.sf-c-aqua\:30{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-30))}.sf-c-aqua\:40{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-40))}.sf-c-aqua\:50{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}.sf-c-aqua\:60{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}.sf-c-aqua\:70{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}.sf-c-aqua\:80{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}.sf-c-aqua\:90{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}.sf-c-aqua\:100{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-100))}html.var .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var .sf-c-aqua\:10{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var .sf-c-aqua\:20{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var .sf-c-aqua\:30{color:hsl(180,100%,90%);background:hsl(180,100%,30%)}html.var .sf-c-aqua\:40{color:hsl(180,100%,90%);background:hsl(180,100%,40%)}html.var .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var .sf-c-aqua\:80{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var .sf-c-aqua\:90{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var .sf-c-aqua\:100{color:hsl(180,100%,10%);background:hsl(180,100%,100%)}.sf-c-txt-aqua{color:hsl(var(--sf-dark-c-txt-aqua))}.sf-c-txt-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-100))}.sf-c-txt-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-90))}.sf-c-txt-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-80))}.sf-c-txt-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-70))}.sf-c-txt-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-60))}.sf-c-txt-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-50))}.sf-c-txt-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-40))}.sf-c-txt-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-30))}.sf-c-txt-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-20))}.sf-c-txt-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-10))}.sf-c-txt-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-0))}html.var .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var .sf-c-txt-aqua\:0{color:hsl(180,100%,100%)}html.var .sf-c-txt-aqua\:10{color:hsl(180,100%,90%)}html.var .sf-c-txt-aqua\:20{color:hsl(180,100%,80%)}html.var .sf-c-txt-aqua\:30{color:hsl(180,100%,70%)}html.var .sf-c-txt-aqua\:40{color:hsl(180,100%,60%)}html.var .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var .sf-c-txt-aqua\:60{color:hsl(180,100%,40%)}html.var .sf-c-txt-aqua\:70{color:hsl(180,100%,30%)}html.var .sf-c-txt-aqua\:80{color:hsl(180,100%,20%)}html.var .sf-c-txt-aqua\:90{color:hsl(180,100%,10%)}html.var .sf-c-txt-aqua\:100{color:hsl(180,100%,0%)}html[data-theme='dark'] .sf-c-aqua,html.dark .sf-c-aqua{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua))}html[data-theme='dark'] .sf-c-aqua\:0,html.dark .sf-c-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-100))}html[data-theme='dark'] .sf-c-aqua\:10,html.dark .sf-c-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-90))}html[data-theme='dark'] .sf-c-aqua\:20,html.dark .sf-c-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-80))}html[data-theme='dark'] .sf-c-aqua\:30,html.dark .sf-c-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-70))}html[data-theme='dark'] .sf-c-aqua\:40,html.dark .sf-c-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-60))}html[data-theme='dark'] .sf-c-aqua\:50,html.dark .sf-c-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-50))}html[data-theme='dark'] .sf-c-aqua\:60,html.dark .sf-c-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-40))}html[data-theme='dark'] .sf-c-aqua\:70,html.dark .sf-c-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-30))}html[data-theme='dark'] .sf-c-aqua\:80,html.dark .sf-c-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-20))}html[data-theme='dark'] .sf-c-aqua\:90,html.dark .sf-c-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-10))}html[data-theme='dark'] .sf-c-aqua\:100,html.dark .sf-c-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-0))}html[data-theme='dark'] .sf-c-aqua\:dark,html.dark .sf-c-aqua\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}html[data-theme='dark'] .sf-c-aqua\:0\:dark,html.dark .sf-c-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-100))}html[data-theme='dark'] .sf-c-aqua\:10\:dark,html.dark .sf-c-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}html[data-theme='dark'] .sf-c-aqua\:20\:dark,html.dark .sf-c-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}html[data-theme='dark'] .sf-c-aqua\:30\:dark,html.dark .sf-c-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}html[data-theme='dark'] .sf-c-aqua\:40\:dark,html.dark .sf-c-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}html[data-theme='dark'] .sf-c-aqua\:50\:dark,html.dark .sf-c-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}html[data-theme='dark'] .sf-c-aqua\:60\:dark,html.dark .sf-c-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-40))}html[data-theme='dark'] .sf-c-aqua\:70\:dark,html.dark .sf-c-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-30))}html[data-theme='dark'] .sf-c-aqua\:80\:dark,html.dark .sf-c-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}html[data-theme='dark'] .sf-c-aqua\:90\:dark,html.dark .sf-c-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}html[data-theme='dark'] .sf-c-aqua\:100\:dark,html.dark .sf-c-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua,html.dark .sf-c-txt-aqua{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='dark'] .sf-c-txt-aqua\:0,html.dark .sf-c-txt-aqua\:0{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua\:10,html.dark .sf-c-txt-aqua\:10{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='dark'] .sf-c-txt-aqua\:20,html.dark .sf-c-txt-aqua\:20{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='dark'] .sf-c-txt-aqua\:30,html.dark .sf-c-txt-aqua\:30{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='dark'] .sf-c-txt-aqua\:40,html.dark .sf-c-txt-aqua\:40{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='dark'] .sf-c-txt-aqua\:50,html.dark .sf-c-txt-aqua\:50{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='dark'] .sf-c-txt-aqua\:60,html.dark .sf-c-txt-aqua\:60{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='dark'] .sf-c-txt-aqua\:70,html.dark .sf-c-txt-aqua\:70{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='dark'] .sf-c-txt-aqua\:80,html.dark .sf-c-txt-aqua\:80{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='dark'] .sf-c-txt-aqua\:90,html.dark .sf-c-txt-aqua\:90{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='dark'] .sf-c-txt-aqua\:100,html.dark .sf-c-txt-aqua\:100{color:hsl(var(--sf-c-txt-aqua-100))}html[data-theme='dark'] .sf-c-txt-aqua\:dark,html.dark .sf-c-txt-aqua\:dark{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='dark'] .sf-c-txt-aqua\:0\:dark,html.dark .sf-c-txt-aqua\:0\:dark{color:hsl(var(--sf-dark-c-txt-aqua-0))}html[data-theme='dark'] .sf-c-txt-aqua\:10\:dark,html.dark .sf-c-txt-aqua\:10\:dark{color:hsl(var(--sf-dark-c-txt-aqua-10))}html[data-theme='dark'] .sf-c-txt-aqua\:20\:dark,html.dark .sf-c-txt-aqua\:20\:dark{color:hsl(var(--sf-dark-c-txt-aqua-20))}html[data-theme='dark'] .sf-c-txt-aqua\:30\:dark,html.dark .sf-c-txt-aqua\:30\:dark{color:hsl(var(--sf-dark-c-txt-aqua-30))}html[data-theme='dark'] .sf-c-txt-aqua\:40\:dark,html.dark .sf-c-txt-aqua\:40\:dark{color:hsl(var(--sf-dark-c-txt-aqua-40))}html[data-theme='dark'] .sf-c-txt-aqua\:50\:dark,html.dark .sf-c-txt-aqua\:50\:dark{color:hsl(var(--sf-dark-c-txt-aqua-50))}html[data-theme='dark'] .sf-c-txt-aqua\:60\:dark,html.dark .sf-c-txt-aqua\:60\:dark{color:hsl(var(--sf-dark-c-txt-aqua-60))}html[data-theme='dark'] .sf-c-txt-aqua\:70\:dark,html.dark .sf-c-txt-aqua\:70\:dark{color:hsl(var(--sf-dark-c-txt-aqua-70))}html[data-theme='dark'] .sf-c-txt-aqua\:80\:dark,html.dark .sf-c-txt-aqua\:80\:dark{color:hsl(var(--sf-dark-c-txt-aqua-80))}html[data-theme='dark'] .sf-c-txt-aqua\:90\:dark,html.dark .sf-c-txt-aqua\:90\:dark{color:hsl(var(--sf-dark-c-txt-aqua-90))}html[data-theme='dark'] .sf-c-txt-aqua\:100\:dark,html.dark .sf-c-txt-aqua\:100\:dark{color:hsl(var(--sf-dark-c-txt-aqua-100))}html.var[data-theme='dark'] .sf-c-aqua,html.var.dark .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:0,html.var.dark .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-aqua\:10,html.var.dark .sf-c-aqua\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-aqua\:20,html.var.dark .sf-c-aqua\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-aqua\:30,html.var.dark .sf-c-aqua\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-aqua\:40,html.var.dark .sf-c-aqua\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-aqua\:50,html.var.dark .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:60,html.var.dark .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-aqua\:70,html.var.dark .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-aqua\:80,html.var.dark .sf-c-aqua\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-aqua\:90,html.var.dark .sf-c-aqua\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-aqua\:100,html.var.dark .sf-c-aqua\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-aqua\:dark,html.var.dark .sf-c-aqua\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:0\:dark,html.var.dark .sf-c-aqua\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-aqua\:10\:dark,html.var.dark .sf-c-aqua\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-aqua\:20\:dark,html.var.dark .sf-c-aqua\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-aqua\:30\:dark,html.var.dark .sf-c-aqua\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-aqua\:40\:dark,html.var.dark .sf-c-aqua\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-aqua\:50\:dark,html.var.dark .sf-c-aqua\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-aqua\:60\:dark,html.var.dark .sf-c-aqua\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-aqua\:70\:dark,html.var.dark .sf-c-aqua\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-aqua\:80\:dark,html.var.dark .sf-c-aqua\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-aqua\:90\:dark,html.var.dark .sf-c-aqua\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-aqua\:100\:dark,html.var.dark .sf-c-aqua\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua,html.dark .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:0,html.dark .sf-c-txt-aqua\:0{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:10,html.dark .sf-c-txt-aqua\:10{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:20,html.dark .sf-c-txt-aqua\:20{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:30,html.dark .sf-c-txt-aqua\:30{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:40,html.dark .sf-c-txt-aqua\:40{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:50,html.dark .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:60,html.dark .sf-c-txt-aqua\:60{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:70,html.dark .sf-c-txt-aqua\:70{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:80,html.dark .sf-c-txt-aqua\:80{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:90,html.dark .sf-c-txt-aqua\:90{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:100,html.dark .sf-c-txt-aqua\:100{color:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:dark,html.dark .sf-c-txt-aqua\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:0\:dark,html.dark .sf-c-txt-aqua\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:10\:dark,html.dark .sf-c-txt-aqua\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:20\:dark,html.dark .sf-c-txt-aqua\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:30\:dark,html.dark .sf-c-txt-aqua\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:40\:dark,html.dark .sf-c-txt-aqua\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:50\:dark,html.dark .sf-c-txt-aqua\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:60\:dark,html.dark .sf-c-txt-aqua\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:70\:dark,html.dark .sf-c-txt-aqua\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:80\:dark,html.dark .sf-c-txt-aqua\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:90\:dark,html.dark .sf-c-txt-aqua\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-aqua\:100\:dark,html.dark .sf-c-txt-aqua\:100\:dark{color:hsl(180,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-aqua,html.auto .sf-c-aqua{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua))}html[data-theme='auto'] .sf-c-aqua\:0,html.auto .sf-c-aqua\:0{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-100))}html[data-theme='auto'] .sf-c-aqua\:10,html.auto .sf-c-aqua\:10{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-90))}html[data-theme='auto'] .sf-c-aqua\:20,html.auto .sf-c-aqua\:20{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-80))}html[data-theme='auto'] .sf-c-aqua\:30,html.auto .sf-c-aqua\:30{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-70))}html[data-theme='auto'] .sf-c-aqua\:40,html.auto .sf-c-aqua\:40{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-60))}html[data-theme='auto'] .sf-c-aqua\:50,html.auto .sf-c-aqua\:50{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-50))}html[data-theme='auto'] .sf-c-aqua\:60,html.auto .sf-c-aqua\:60{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-40))}html[data-theme='auto'] .sf-c-aqua\:70,html.auto .sf-c-aqua\:70{color:hsl(var(--sf-dark-c-txt-aqua-10));background:hsl(var(--sf-dark-c-aqua-30))}html[data-theme='auto'] .sf-c-aqua\:80,html.auto .sf-c-aqua\:80{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-20))}html[data-theme='auto'] .sf-c-aqua\:90,html.auto .sf-c-aqua\:90{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-10))}html[data-theme='auto'] .sf-c-aqua\:100,html.auto .sf-c-aqua\:100{color:hsl(var(--sf-dark-c-txt-aqua-90));background:hsl(var(--sf-dark-c-aqua-0))}html[data-theme='auto'] .sf-c-aqua\:dark,html.auto .sf-c-aqua\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua))}html[data-theme='auto'] .sf-c-aqua\:0\:dark,html.auto .sf-c-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-100))}html[data-theme='auto'] .sf-c-aqua\:10\:dark,html.auto .sf-c-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-90))}html[data-theme='auto'] .sf-c-aqua\:20\:dark,html.auto .sf-c-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-80))}html[data-theme='auto'] .sf-c-aqua\:30\:dark,html.auto .sf-c-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-70))}html[data-theme='auto'] .sf-c-aqua\:40\:dark,html.auto .sf-c-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-60))}html[data-theme='auto'] .sf-c-aqua\:50\:dark,html.auto .sf-c-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-50))}html[data-theme='auto'] .sf-c-aqua\:60\:dark,html.auto .sf-c-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-40))}html[data-theme='auto'] .sf-c-aqua\:70\:dark,html.auto .sf-c-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-10));background:hsl(var(--sf-c-aqua-30))}html[data-theme='auto'] .sf-c-aqua\:80\:dark,html.auto .sf-c-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-20))}html[data-theme='auto'] .sf-c-aqua\:90\:dark,html.auto .sf-c-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-10))}html[data-theme='auto'] .sf-c-aqua\:100\:dark,html.auto .sf-c-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-90));background:hsl(var(--sf-c-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua,html.auto .sf-c-txt-aqua{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='auto'] .sf-c-txt-aqua\:0,html.auto .sf-c-txt-aqua\:0{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua\:10,html.auto .sf-c-txt-aqua\:10{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='auto'] .sf-c-txt-aqua\:20,html.auto .sf-c-txt-aqua\:20{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='auto'] .sf-c-txt-aqua\:30,html.auto .sf-c-txt-aqua\:30{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='auto'] .sf-c-txt-aqua\:40,html.auto .sf-c-txt-aqua\:40{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='auto'] .sf-c-txt-aqua\:50,html.auto .sf-c-txt-aqua\:50{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='auto'] .sf-c-txt-aqua\:60,html.auto .sf-c-txt-aqua\:60{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='auto'] .sf-c-txt-aqua\:70,html.auto .sf-c-txt-aqua\:70{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='auto'] .sf-c-txt-aqua\:80,html.auto .sf-c-txt-aqua\:80{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='auto'] .sf-c-txt-aqua\:90,html.auto .sf-c-txt-aqua\:90{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='auto'] .sf-c-txt-aqua\:100,html.auto .sf-c-txt-aqua\:100{color:hsl(var(--sf-c-txt-aqua-100))}html[data-theme='auto'] .sf-c-txt-aqua\:dark,html.auto .sf-c-txt-aqua\:dark{color:hsl(var(--sf-c-txt-aqua))}html[data-theme='auto'] .sf-c-txt-aqua\:0\:dark,html.auto .sf-c-txt-aqua\:0\:dark{color:hsl(var(--sf-c-txt-aqua-0))}html[data-theme='auto'] .sf-c-txt-aqua\:10\:dark,html.auto .sf-c-txt-aqua\:10\:dark{color:hsl(var(--sf-c-txt-aqua-10))}html[data-theme='auto'] .sf-c-txt-aqua\:20\:dark,html.auto .sf-c-txt-aqua\:20\:dark{color:hsl(var(--sf-c-txt-aqua-20))}html[data-theme='auto'] .sf-c-txt-aqua\:30\:dark,html.auto .sf-c-txt-aqua\:30\:dark{color:hsl(var(--sf-c-txt-aqua-30))}html[data-theme='auto'] .sf-c-txt-aqua\:40\:dark,html.auto .sf-c-txt-aqua\:40\:dark{color:hsl(var(--sf-c-txt-aqua-40))}html[data-theme='auto'] .sf-c-txt-aqua\:50\:dark,html.auto .sf-c-txt-aqua\:50\:dark{color:hsl(var(--sf-c-txt-aqua-50))}html[data-theme='auto'] .sf-c-txt-aqua\:60\:dark,html.auto .sf-c-txt-aqua\:60\:dark{color:hsl(var(--sf-c-txt-aqua-60))}html[data-theme='auto'] .sf-c-txt-aqua\:70\:dark,html.auto .sf-c-txt-aqua\:70\:dark{color:hsl(var(--sf-c-txt-aqua-70))}html[data-theme='auto'] .sf-c-txt-aqua\:80\:dark,html.auto .sf-c-txt-aqua\:80\:dark{color:hsl(var(--sf-c-txt-aqua-80))}html[data-theme='auto'] .sf-c-txt-aqua\:90\:dark,html.auto .sf-c-txt-aqua\:90\:dark{color:hsl(var(--sf-c-txt-aqua-90))}html[data-theme='auto'] .sf-c-txt-aqua\:100\:dark,html.auto .sf-c-txt-aqua\:100\:dark{color:hsl(var(--sf-c-txt-aqua-100))}html.var[data-theme='auto'] .sf-c-aqua,html.var.auto .sf-c-aqua{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:0,html.var.auto .sf-c-aqua\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-aqua\:10,html.var.auto .sf-c-aqua\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-aqua\:20,html.var.auto .sf-c-aqua\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-aqua\:30,html.var.auto .sf-c-aqua\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-aqua\:40,html.var.auto .sf-c-aqua\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-aqua\:50,html.var.auto .sf-c-aqua\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:60,html.var.auto .sf-c-aqua\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-aqua\:70,html.var.auto .sf-c-aqua\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-aqua\:80,html.var.auto .sf-c-aqua\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-aqua\:90,html.var.auto .sf-c-aqua\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-aqua\:100,html.var.auto .sf-c-aqua\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-aqua\:dark,html.var.auto .sf-c-aqua\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:0\:dark,html.var.auto .sf-c-aqua\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-aqua\:10\:dark,html.var.auto .sf-c-aqua\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-aqua\:20\:dark,html.var.auto .sf-c-aqua\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-aqua\:30\:dark,html.var.auto .sf-c-aqua\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-aqua\:40\:dark,html.var.auto .sf-c-aqua\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-aqua\:50\:dark,html.var.auto .sf-c-aqua\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-aqua\:60\:dark,html.var.auto .sf-c-aqua\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-aqua\:70\:dark,html.var.auto .sf-c-aqua\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-aqua\:80\:dark,html.var.auto .sf-c-aqua\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-aqua\:90\:dark,html.var.auto .sf-c-aqua\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-aqua\:100\:dark,html.var.auto .sf-c-aqua\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua,html.auto .sf-c-txt-aqua{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:0,html.auto .sf-c-txt-aqua\:0{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:10,html.auto .sf-c-txt-aqua\:10{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:20,html.auto .sf-c-txt-aqua\:20{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:30,html.auto .sf-c-txt-aqua\:30{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:40,html.auto .sf-c-txt-aqua\:40{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:50,html.auto .sf-c-txt-aqua\:50{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:60,html.auto .sf-c-txt-aqua\:60{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:70,html.auto .sf-c-txt-aqua\:70{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:80,html.auto .sf-c-txt-aqua\:80{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:90,html.auto .sf-c-txt-aqua\:90{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:100,html.auto .sf-c-txt-aqua\:100{color:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:dark,html.auto .sf-c-txt-aqua\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark,html.auto .sf-c-txt-aqua\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark,html.auto .sf-c-txt-aqua\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark,html.auto .sf-c-txt-aqua\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark,html.auto .sf-c-txt-aqua\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark,html.auto .sf-c-txt-aqua\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark,html.auto .sf-c-txt-aqua\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark,html.auto .sf-c-txt-aqua\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark,html.auto .sf-c-txt-aqua\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark,html.auto .sf-c-txt-aqua\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark,html.auto .sf-c-txt-aqua\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark,html.auto .sf-c-txt-aqua\:100\:dark{color:hsl(180,100%,100%)}}[class*='black']{--sf-c-black:0 0% 0%;--sf-c-black-0:0 0% 0%;--sf-c-black-10:0 0% 10%;--sf-c-black-20:0 0% 20%;--sf-c-black-30:0 0% 30%;--sf-c-black-40:0 0% 40%;--sf-c-black-50:0 0% 50%;--sf-c-black-60:0 0% 60%;--sf-c-black-70:0 0% 70%;--sf-c-black-80:0 0% 80%;--sf-c-black-90:0 0% 90%;--sf-c-black-100:0 0% 100%;--sf-c-txt-black:var(--sf-c-black);--sf-c-txt-black-0:var(--sf-c-black-0);--sf-c-txt-black-10:var(--sf-c-black-10);--sf-c-txt-black-20:var(--sf-c-black-20);--sf-c-txt-black-30:var(--sf-c-black-30);--sf-c-txt-black-40:var(--sf-c-black-40);--sf-c-txt-black-50:var(--sf-c-black-50);--sf-c-txt-black-60:var(--sf-c-black-60);--sf-c-txt-black-70:var(--sf-c-black-70);--sf-c-txt-black-80:var(--sf-c-black-80);--sf-c-txt-black-90:var(--sf-c-black-90);--sf-c-txt-black-100:var(--sf-c-black-100);--sf-dark-c-black:0 0% 100%;--sf-dark-c-black-0:0 0% 0%;--sf-dark-c-black-10:0 0% 10%;--sf-dark-c-black-20:0 0% 20%;--sf-dark-c-black-30:0 0% 30%;--sf-dark-c-black-40:0 0% 40%;--sf-dark-c-black-50:0 0% 50%;--sf-dark-c-black-60:0 0% 60%;--sf-dark-c-black-70:0 0% 70%;--sf-dark-c-black-80:0 0% 80%;--sf-dark-c-black-90:0 0% 90%;--sf-dark-c-black-100:0 0% 100%;--sf-dark-c-txt-black:var(--sf-dark-c-black);--sf-dark-c-txt-black-0:var(--sf-dark-c-black-0);--sf-dark-c-txt-black-10:var(--sf-dark-c-black-10);--sf-dark-c-txt-black-20:var(--sf-dark-c-black-20);--sf-dark-c-txt-black-30:var(--sf-dark-c-black-30);--sf-dark-c-txt-black-40:var(--sf-dark-c-black-40);--sf-dark-c-txt-black-50:var(--sf-dark-c-black-50);--sf-dark-c-txt-black-60:var(--sf-dark-c-black-60);--sf-dark-c-txt-black-70:var(--sf-dark-c-black-70);--sf-dark-c-txt-black-80:var(--sf-dark-c-black-80);--sf-dark-c-txt-black-90:var(--sf-dark-c-black-90);--sf-dark-c-txt-black-100:var(--sf-dark-c-black-100)}.sf-c-black{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black))}.sf-c-black\:0{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}.sf-c-black\:10{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}.sf-c-black\:20{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}.sf-c-black\:30{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}.sf-c-black\:40{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}.sf-c-black\:50{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-50))}.sf-c-black\:60{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-60))}.sf-c-black\:70{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}.sf-c-black\:80{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}.sf-c-black\:90{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}.sf-c-black\:100{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-100))}html.var .sf-c-black{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-black\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-black\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-black\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-black\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-black\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-black\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-black\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-black\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-black\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-black{color:hsl(var(--sf-dark-c-txt-black))}.sf-c-txt-black\:0{color:hsl(var(--sf-dark-c-txt-black-100))}.sf-c-txt-black\:10{color:hsl(var(--sf-dark-c-txt-black-90))}.sf-c-txt-black\:20{color:hsl(var(--sf-dark-c-txt-black-80))}.sf-c-txt-black\:30{color:hsl(var(--sf-dark-c-txt-black-70))}.sf-c-txt-black\:40{color:hsl(var(--sf-dark-c-txt-black-60))}.sf-c-txt-black\:50{color:hsl(var(--sf-dark-c-txt-black-50))}.sf-c-txt-black\:60{color:hsl(var(--sf-dark-c-txt-black-40))}.sf-c-txt-black\:70{color:hsl(var(--sf-dark-c-txt-black-30))}.sf-c-txt-black\:80{color:hsl(var(--sf-dark-c-txt-black-20))}.sf-c-txt-black\:90{color:hsl(var(--sf-dark-c-txt-black-10))}.sf-c-txt-black\:100{color:hsl(var(--sf-dark-c-txt-black-0))}html.var .sf-c-txt-black{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-black\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-black\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-black\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-black\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-black\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-black\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-black\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-black\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-black\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-black,html.dark .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='dark'] .sf-c-black\:0,html.dark .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='dark'] .sf-c-black\:10,html.dark .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='dark'] .sf-c-black\:20,html.dark .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='dark'] .sf-c-black\:30,html.dark .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='dark'] .sf-c-black\:40,html.dark .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='dark'] .sf-c-black\:50,html.dark .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='dark'] .sf-c-black\:60,html.dark .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='dark'] .sf-c-black\:70,html.dark .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='dark'] .sf-c-black\:80,html.dark .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='dark'] .sf-c-black\:90,html.dark .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='dark'] .sf-c-black\:100,html.dark .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='dark'] .sf-c-black\:dark,html.dark .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='dark'] .sf-c-black\:0\:dark,html.dark .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='dark'] .sf-c-black\:10\:dark,html.dark .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='dark'] .sf-c-black\:20\:dark,html.dark .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='dark'] .sf-c-black\:30\:dark,html.dark .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='dark'] .sf-c-black\:40\:dark,html.dark .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='dark'] .sf-c-black\:50\:dark,html.dark .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='dark'] .sf-c-black\:60\:dark,html.dark .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='dark'] .sf-c-black\:70\:dark,html.dark .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='dark'] .sf-c-black\:80\:dark,html.dark .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='dark'] .sf-c-black\:90\:dark,html.dark .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='dark'] .sf-c-black\:100\:dark,html.dark .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-dark-c-txt-black-0))}html[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-dark-c-txt-black-10))}html[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-dark-c-txt-black-20))}html[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-dark-c-txt-black-30))}html[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-dark-c-txt-black-40))}html[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-dark-c-txt-black-50))}html[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-dark-c-txt-black-60))}html[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-dark-c-txt-black-70))}html[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-dark-c-txt-black-80))}html[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-dark-c-txt-black-90))}html[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-dark-c-txt-black-100))}html.var[data-theme='dark'] .sf-c-black,html.var.dark .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0,html.var.dark .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10,html.var.dark .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20,html.var.dark .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30,html.var.dark .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40,html.var.dark .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50,html.var.dark .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60,html.var.dark .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70,html.var.dark .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80,html.var.dark .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90,html.var.dark .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100,html.var.dark .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-black\:dark,html.var.dark .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:0\:dark,html.var.dark .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-black\:10\:dark,html.var.dark .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-black\:20\:dark,html.var.dark .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-black\:30\:dark,html.var.dark .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-black\:40\:dark,html.var.dark .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-black\:50\:dark,html.var.dark .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-black\:60\:dark,html.var.dark .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-black\:70\:dark,html.var.dark .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-black\:80\:dark,html.var.dark .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-black\:90\:dark,html.var.dark .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-black\:100\:dark,html.var.dark .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black,html.dark .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0,html.dark .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10,html.dark .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20,html.dark .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30,html.dark .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40,html.dark .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50,html.dark .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60,html.dark .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70,html.dark .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80,html.dark .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90,html.dark .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100,html.dark .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-black\:dark,html.dark .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:0\:dark,html.dark .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-black\:10\:dark,html.dark .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-black\:20\:dark,html.dark .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-black\:30\:dark,html.dark .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-black\:40\:dark,html.dark .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-black\:50\:dark,html.dark .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-black\:60\:dark,html.dark .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-black\:70\:dark,html.dark .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-black\:80\:dark,html.dark .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-black\:90\:dark,html.dark .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-black\:100\:dark,html.dark .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-black,html.auto .sf-c-black{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black))}html[data-theme='auto'] .sf-c-black\:0,html.auto .sf-c-black\:0{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-100))}html[data-theme='auto'] .sf-c-black\:10,html.auto .sf-c-black\:10{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-90))}html[data-theme='auto'] .sf-c-black\:20,html.auto .sf-c-black\:20{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-80))}html[data-theme='auto'] .sf-c-black\:30,html.auto .sf-c-black\:30{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-70))}html[data-theme='auto'] .sf-c-black\:40,html.auto .sf-c-black\:40{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-60))}html[data-theme='auto'] .sf-c-black\:50,html.auto .sf-c-black\:50{color:hsl(var(--sf-dark-c-txt-black-10));background:hsl(var(--sf-dark-c-black-50))}html[data-theme='auto'] .sf-c-black\:60,html.auto .sf-c-black\:60{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-40))}html[data-theme='auto'] .sf-c-black\:70,html.auto .sf-c-black\:70{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-30))}html[data-theme='auto'] .sf-c-black\:80,html.auto .sf-c-black\:80{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-20))}html[data-theme='auto'] .sf-c-black\:90,html.auto .sf-c-black\:90{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-10))}html[data-theme='auto'] .sf-c-black\:100,html.auto .sf-c-black\:100{color:hsl(var(--sf-dark-c-txt-black-90));background:hsl(var(--sf-dark-c-black-0))}html[data-theme='auto'] .sf-c-black\:dark,html.auto .sf-c-black\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black))}html[data-theme='auto'] .sf-c-black\:0\:dark,html.auto .sf-c-black\:0\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-100))}html[data-theme='auto'] .sf-c-black\:10\:dark,html.auto .sf-c-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-90))}html[data-theme='auto'] .sf-c-black\:20\:dark,html.auto .sf-c-black\:20\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-80))}html[data-theme='auto'] .sf-c-black\:30\:dark,html.auto .sf-c-black\:30\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-70))}html[data-theme='auto'] .sf-c-black\:40\:dark,html.auto .sf-c-black\:40\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-60))}html[data-theme='auto'] .sf-c-black\:50\:dark,html.auto .sf-c-black\:50\:dark{color:hsl(var(--sf-c-txt-black-10));background:hsl(var(--sf-c-black-50))}html[data-theme='auto'] .sf-c-black\:60\:dark,html.auto .sf-c-black\:60\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-40))}html[data-theme='auto'] .sf-c-black\:70\:dark,html.auto .sf-c-black\:70\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-30))}html[data-theme='auto'] .sf-c-black\:80\:dark,html.auto .sf-c-black\:80\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-20))}html[data-theme='auto'] .sf-c-black\:90\:dark,html.auto .sf-c-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-10))}html[data-theme='auto'] .sf-c-black\:100\:dark,html.auto .sf-c-black\:100\:dark{color:hsl(var(--sf-c-txt-black-90));background:hsl(var(--sf-c-black-0))}html[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(var(--sf-c-txt-black-100))}html[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(var(--sf-c-txt-black))}html[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(var(--sf-c-txt-black-0))}html[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(var(--sf-c-txt-black-10))}html[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(var(--sf-c-txt-black-20))}html[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(var(--sf-c-txt-black-30))}html[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(var(--sf-c-txt-black-40))}html[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(var(--sf-c-txt-black-50))}html[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(var(--sf-c-txt-black-60))}html[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(var(--sf-c-txt-black-70))}html[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(var(--sf-c-txt-black-80))}html[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(var(--sf-c-txt-black-90))}html[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(var(--sf-c-txt-black-100))}html.var[data-theme='auto'] .sf-c-black,html.var.auto .sf-c-black{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0,html.var.auto .sf-c-black\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10,html.var.auto .sf-c-black\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20,html.var.auto .sf-c-black\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30,html.var.auto .sf-c-black\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40,html.var.auto .sf-c-black\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50,html.var.auto .sf-c-black\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60,html.var.auto .sf-c-black\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70,html.var.auto .sf-c-black\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80,html.var.auto .sf-c-black\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90,html.var.auto .sf-c-black\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100,html.var.auto .sf-c-black\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-black\:dark,html.var.auto .sf-c-black\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:0\:dark,html.var.auto .sf-c-black\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-black\:10\:dark,html.var.auto .sf-c-black\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-black\:20\:dark,html.var.auto .sf-c-black\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-black\:30\:dark,html.var.auto .sf-c-black\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-black\:40\:dark,html.var.auto .sf-c-black\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-black\:50\:dark,html.var.auto .sf-c-black\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-black\:60\:dark,html.var.auto .sf-c-black\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-black\:70\:dark,html.var.auto .sf-c-black\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-black\:80\:dark,html.var.auto .sf-c-black\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-black\:90\:dark,html.var.auto .sf-c-black\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-black\:100\:dark,html.var.auto .sf-c-black\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black,html.auto .sf-c-txt-black{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0,html.auto .sf-c-txt-black\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10,html.auto .sf-c-txt-black\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20,html.auto .sf-c-txt-black\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30,html.auto .sf-c-txt-black\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40,html.auto .sf-c-txt-black\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50,html.auto .sf-c-txt-black\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60,html.auto .sf-c-txt-black\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70,html.auto .sf-c-txt-black\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80,html.auto .sf-c-txt-black\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90,html.auto .sf-c-txt-black\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100,html.auto .sf-c-txt-black\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-black\:dark,html.auto .sf-c-txt-black\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:0\:dark,html.auto .sf-c-txt-black\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-black\:10\:dark,html.auto .sf-c-txt-black\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-black\:20\:dark,html.auto .sf-c-txt-black\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-black\:30\:dark,html.auto .sf-c-txt-black\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-black\:40\:dark,html.auto .sf-c-txt-black\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-black\:50\:dark,html.auto .sf-c-txt-black\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-black\:60\:dark,html.auto .sf-c-txt-black\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-black\:70\:dark,html.auto .sf-c-txt-black\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-black\:80\:dark,html.auto .sf-c-txt-black\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-black\:90\:dark,html.auto .sf-c-txt-black\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-black\:100\:dark,html.auto .sf-c-txt-black\:100\:dark{color:hsl(0,0%,100%)}}[class*='blue']{--sf-c-blue:240 100% 50%;--sf-c-blue-0:240 100% 0%;--sf-c-blue-10:240 100% 10%;--sf-c-blue-20:240 100% 20%;--sf-c-blue-30:240 100% 30%;--sf-c-blue-40:240 100% 40%;--sf-c-blue-50:240 100% 50%;--sf-c-blue-60:240 100% 60%;--sf-c-blue-70:240 100% 70%;--sf-c-blue-80:240 100% 80%;--sf-c-blue-90:240 100% 90%;--sf-c-blue-100:240 100% 100%;--sf-c-txt-blue:var(--sf-c-blue);--sf-c-txt-blue-0:var(--sf-c-blue-0);--sf-c-txt-blue-10:var(--sf-c-blue-10);--sf-c-txt-blue-20:var(--sf-c-blue-20);--sf-c-txt-blue-30:var(--sf-c-blue-30);--sf-c-txt-blue-40:var(--sf-c-blue-40);--sf-c-txt-blue-50:var(--sf-c-blue-50);--sf-c-txt-blue-60:var(--sf-c-blue-60);--sf-c-txt-blue-70:var(--sf-c-blue-70);--sf-c-txt-blue-80:var(--sf-c-blue-80);--sf-c-txt-blue-90:var(--sf-c-blue-90);--sf-c-txt-blue-100:var(--sf-c-blue-100);--sf-dark-c-blue:240 100% 50%;--sf-dark-c-blue-0:240 100% 0%;--sf-dark-c-blue-10:240 100% 10%;--sf-dark-c-blue-20:240 100% 20%;--sf-dark-c-blue-30:240 100% 30%;--sf-dark-c-blue-40:240 100% 40%;--sf-dark-c-blue-50:240 100% 50%;--sf-dark-c-blue-60:240 100% 60%;--sf-dark-c-blue-70:240 100% 70%;--sf-dark-c-blue-80:240 100% 80%;--sf-dark-c-blue-90:240 100% 90%;--sf-dark-c-blue-100:240 100% 100%;--sf-dark-c-txt-blue:var(--sf-dark-c-blue);--sf-dark-c-txt-blue-0:var(--sf-dark-c-blue-0);--sf-dark-c-txt-blue-10:var(--sf-dark-c-blue-10);--sf-dark-c-txt-blue-20:var(--sf-dark-c-blue-20);--sf-dark-c-txt-blue-30:var(--sf-dark-c-blue-30);--sf-dark-c-txt-blue-40:var(--sf-dark-c-blue-40);--sf-dark-c-txt-blue-50:var(--sf-dark-c-blue-50);--sf-dark-c-txt-blue-60:var(--sf-dark-c-blue-60);--sf-dark-c-txt-blue-70:var(--sf-dark-c-blue-70);--sf-dark-c-txt-blue-80:var(--sf-dark-c-blue-80);--sf-dark-c-txt-blue-90:var(--sf-dark-c-blue-90);--sf-dark-c-txt-blue-100:var(--sf-dark-c-blue-100)}.sf-c-blue{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}.sf-c-blue\:0{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}.sf-c-blue\:10{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}.sf-c-blue\:20{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}.sf-c-blue\:30{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}.sf-c-blue\:40{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}.sf-c-blue\:50{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}.sf-c-blue\:60{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}.sf-c-blue\:70{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-70))}.sf-c-blue\:80{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-80))}.sf-c-blue\:90{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}.sf-c-blue\:100{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-100))}html.var .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-blue\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-blue\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-blue\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-blue\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-blue\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-blue{color:hsl(var(--sf-dark-c-txt-blue))}.sf-c-txt-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-100))}.sf-c-txt-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-90))}.sf-c-txt-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-80))}.sf-c-txt-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-70))}.sf-c-txt-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-60))}.sf-c-txt-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-50))}.sf-c-txt-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-40))}.sf-c-txt-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-30))}.sf-c-txt-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-20))}.sf-c-txt-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-10))}.sf-c-txt-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-0))}html.var .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-blue\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-blue\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-blue\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-blue\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-blue\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-blue\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-blue\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-blue\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-blue\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-blue,html.dark .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='dark'] .sf-c-blue\:0,html.dark .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10,html.dark .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20,html.dark .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30,html.dark .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40,html.dark .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50,html.dark .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60,html.dark .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70,html.dark .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80,html.dark .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90,html.dark .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100,html.dark .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='dark'] .sf-c-blue\:dark,html.dark .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='dark'] .sf-c-blue\:0\:dark,html.dark .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='dark'] .sf-c-blue\:10\:dark,html.dark .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='dark'] .sf-c-blue\:20\:dark,html.dark .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='dark'] .sf-c-blue\:30\:dark,html.dark .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='dark'] .sf-c-blue\:40\:dark,html.dark .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='dark'] .sf-c-blue\:50\:dark,html.dark .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='dark'] .sf-c-blue\:60\:dark,html.dark .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='dark'] .sf-c-blue\:70\:dark,html.dark .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='dark'] .sf-c-blue\:80\:dark,html.dark .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='dark'] .sf-c-blue\:90\:dark,html.dark .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='dark'] .sf-c-blue\:100\:dark,html.dark .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-dark-c-txt-blue-0))}html[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-dark-c-txt-blue-10))}html[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-dark-c-txt-blue-20))}html[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-dark-c-txt-blue-30))}html[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-dark-c-txt-blue-40))}html[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-dark-c-txt-blue-50))}html[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-dark-c-txt-blue-60))}html[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-dark-c-txt-blue-70))}html[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-dark-c-txt-blue-80))}html[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-dark-c-txt-blue-90))}html[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-dark-c-txt-blue-100))}html.var[data-theme='dark'] .sf-c-blue,html.var.dark .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0,html.var.dark .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10,html.var.dark .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20,html.var.dark .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30,html.var.dark .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40,html.var.dark .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50,html.var.dark .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60,html.var.dark .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70,html.var.dark .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80,html.var.dark .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90,html.var.dark .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100,html.var.dark .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-blue\:dark,html.var.dark .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:0\:dark,html.var.dark .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-blue\:10\:dark,html.var.dark .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-blue\:20\:dark,html.var.dark .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-blue\:30\:dark,html.var.dark .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-blue\:40\:dark,html.var.dark .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-blue\:50\:dark,html.var.dark .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-blue\:60\:dark,html.var.dark .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-blue\:70\:dark,html.var.dark .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-blue\:80\:dark,html.var.dark .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-blue\:90\:dark,html.var.dark .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-blue\:100\:dark,html.var.dark .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue,html.dark .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0,html.dark .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10,html.dark .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20,html.dark .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30,html.dark .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40,html.dark .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50,html.dark .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60,html.dark .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70,html.dark .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80,html.dark .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90,html.dark .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100,html.dark .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-blue\:dark,html.dark .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:0\:dark,html.dark .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-blue\:10\:dark,html.dark .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-blue\:20\:dark,html.dark .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-blue\:30\:dark,html.dark .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-blue\:40\:dark,html.dark .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-blue\:50\:dark,html.dark .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-blue\:60\:dark,html.dark .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-blue\:70\:dark,html.dark .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-blue\:80\:dark,html.dark .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-blue\:90\:dark,html.dark .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-blue\:100\:dark,html.dark .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-blue,html.auto .sf-c-blue{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue))}html[data-theme='auto'] .sf-c-blue\:0,html.auto .sf-c-blue\:0{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10,html.auto .sf-c-blue\:10{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20,html.auto .sf-c-blue\:20{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30,html.auto .sf-c-blue\:30{color:hsl(var(--sf-dark-c-txt-blue-10));background:hsl(var(--sf-dark-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40,html.auto .sf-c-blue\:40{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50,html.auto .sf-c-blue\:50{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60,html.auto .sf-c-blue\:60{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70,html.auto .sf-c-blue\:70{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80,html.auto .sf-c-blue\:80{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90,html.auto .sf-c-blue\:90{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100,html.auto .sf-c-blue\:100{color:hsl(var(--sf-dark-c-txt-blue-90));background:hsl(var(--sf-dark-c-blue-0))}html[data-theme='auto'] .sf-c-blue\:dark,html.auto .sf-c-blue\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue))}html[data-theme='auto'] .sf-c-blue\:0\:dark,html.auto .sf-c-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-100))}html[data-theme='auto'] .sf-c-blue\:10\:dark,html.auto .sf-c-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-90))}html[data-theme='auto'] .sf-c-blue\:20\:dark,html.auto .sf-c-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-80))}html[data-theme='auto'] .sf-c-blue\:30\:dark,html.auto .sf-c-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-10));background:hsl(var(--sf-c-blue-70))}html[data-theme='auto'] .sf-c-blue\:40\:dark,html.auto .sf-c-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-60))}html[data-theme='auto'] .sf-c-blue\:50\:dark,html.auto .sf-c-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-50))}html[data-theme='auto'] .sf-c-blue\:60\:dark,html.auto .sf-c-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-40))}html[data-theme='auto'] .sf-c-blue\:70\:dark,html.auto .sf-c-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-30))}html[data-theme='auto'] .sf-c-blue\:80\:dark,html.auto .sf-c-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-20))}html[data-theme='auto'] .sf-c-blue\:90\:dark,html.auto .sf-c-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-10))}html[data-theme='auto'] .sf-c-blue\:100\:dark,html.auto .sf-c-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-90));background:hsl(var(--sf-c-blue-0))}html[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(var(--sf-c-txt-blue-100))}html[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(var(--sf-c-txt-blue))}html[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(var(--sf-c-txt-blue-0))}html[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(var(--sf-c-txt-blue-10))}html[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(var(--sf-c-txt-blue-20))}html[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(var(--sf-c-txt-blue-30))}html[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(var(--sf-c-txt-blue-40))}html[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(var(--sf-c-txt-blue-50))}html[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(var(--sf-c-txt-blue-60))}html[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(var(--sf-c-txt-blue-70))}html[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(var(--sf-c-txt-blue-80))}html[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(var(--sf-c-txt-blue-90))}html[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(var(--sf-c-txt-blue-100))}html.var[data-theme='auto'] .sf-c-blue,html.var.auto .sf-c-blue{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0,html.var.auto .sf-c-blue\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10,html.var.auto .sf-c-blue\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20,html.var.auto .sf-c-blue\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30,html.var.auto .sf-c-blue\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40,html.var.auto .sf-c-blue\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50,html.var.auto .sf-c-blue\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60,html.var.auto .sf-c-blue\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70,html.var.auto .sf-c-blue\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80,html.var.auto .sf-c-blue\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90,html.var.auto .sf-c-blue\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100,html.var.auto .sf-c-blue\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-blue\:dark,html.var.auto .sf-c-blue\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:0\:dark,html.var.auto .sf-c-blue\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-blue\:10\:dark,html.var.auto .sf-c-blue\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-blue\:20\:dark,html.var.auto .sf-c-blue\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-blue\:30\:dark,html.var.auto .sf-c-blue\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-blue\:40\:dark,html.var.auto .sf-c-blue\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-blue\:50\:dark,html.var.auto .sf-c-blue\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-blue\:60\:dark,html.var.auto .sf-c-blue\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-blue\:70\:dark,html.var.auto .sf-c-blue\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-blue\:80\:dark,html.var.auto .sf-c-blue\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-blue\:90\:dark,html.var.auto .sf-c-blue\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-blue\:100\:dark,html.var.auto .sf-c-blue\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue,html.auto .sf-c-txt-blue{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0,html.auto .sf-c-txt-blue\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10,html.auto .sf-c-txt-blue\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20,html.auto .sf-c-txt-blue\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30,html.auto .sf-c-txt-blue\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40,html.auto .sf-c-txt-blue\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50,html.auto .sf-c-txt-blue\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60,html.auto .sf-c-txt-blue\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70,html.auto .sf-c-txt-blue\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80,html.auto .sf-c-txt-blue\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90,html.auto .sf-c-txt-blue\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100,html.auto .sf-c-txt-blue\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-blue\:dark,html.auto .sf-c-txt-blue\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:0\:dark,html.auto .sf-c-txt-blue\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-blue\:10\:dark,html.auto .sf-c-txt-blue\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-blue\:20\:dark,html.auto .sf-c-txt-blue\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-blue\:30\:dark,html.auto .sf-c-txt-blue\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-blue\:40\:dark,html.auto .sf-c-txt-blue\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-blue\:50\:dark,html.auto .sf-c-txt-blue\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-blue\:60\:dark,html.auto .sf-c-txt-blue\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-blue\:70\:dark,html.auto .sf-c-txt-blue\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-blue\:80\:dark,html.auto .sf-c-txt-blue\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-blue\:90\:dark,html.auto .sf-c-txt-blue\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-blue\:100\:dark,html.auto .sf-c-txt-blue\:100\:dark{color:hsl(240,100%,100%)}}[class*='fuchsia']{--sf-c-fuchsia:300 100% 50%;--sf-c-fuchsia-0:300 100% 0%;--sf-c-fuchsia-10:300 100% 10%;--sf-c-fuchsia-20:300 100% 20%;--sf-c-fuchsia-30:300 100% 30%;--sf-c-fuchsia-40:300 100% 40%;--sf-c-fuchsia-50:300 100% 50%;--sf-c-fuchsia-60:300 100% 60%;--sf-c-fuchsia-70:300 100% 70%;--sf-c-fuchsia-80:300 100% 80%;--sf-c-fuchsia-90:300 100% 90%;--sf-c-fuchsia-100:300 100% 100%;--sf-c-txt-fuchsia:var(--sf-c-fuchsia);--sf-c-txt-fuchsia-0:var(--sf-c-fuchsia-0);--sf-c-txt-fuchsia-10:var(--sf-c-fuchsia-10);--sf-c-txt-fuchsia-20:var(--sf-c-fuchsia-20);--sf-c-txt-fuchsia-30:var(--sf-c-fuchsia-30);--sf-c-txt-fuchsia-40:var(--sf-c-fuchsia-40);--sf-c-txt-fuchsia-50:var(--sf-c-fuchsia-50);--sf-c-txt-fuchsia-60:var(--sf-c-fuchsia-60);--sf-c-txt-fuchsia-70:var(--sf-c-fuchsia-70);--sf-c-txt-fuchsia-80:var(--sf-c-fuchsia-80);--sf-c-txt-fuchsia-90:var(--sf-c-fuchsia-90);--sf-c-txt-fuchsia-100:var(--sf-c-fuchsia-100);--sf-dark-c-fuchsia:300 100% 50%;--sf-dark-c-fuchsia-0:300 100% 0%;--sf-dark-c-fuchsia-10:300 100% 10%;--sf-dark-c-fuchsia-20:300 100% 20%;--sf-dark-c-fuchsia-30:300 100% 30%;--sf-dark-c-fuchsia-40:300 100% 40%;--sf-dark-c-fuchsia-50:300 100% 50%;--sf-dark-c-fuchsia-60:300 100% 60%;--sf-dark-c-fuchsia-70:300 100% 70%;--sf-dark-c-fuchsia-80:300 100% 80%;--sf-dark-c-fuchsia-90:300 100% 90%;--sf-dark-c-fuchsia-100:300 100% 100%;--sf-dark-c-txt-fuchsia:var(--sf-dark-c-fuchsia);--sf-dark-c-txt-fuchsia-0:var(--sf-dark-c-fuchsia-0);--sf-dark-c-txt-fuchsia-10:var(--sf-dark-c-fuchsia-10);--sf-dark-c-txt-fuchsia-20:var(--sf-dark-c-fuchsia-20);--sf-dark-c-txt-fuchsia-30:var(--sf-dark-c-fuchsia-30);--sf-dark-c-txt-fuchsia-40:var(--sf-dark-c-fuchsia-40);--sf-dark-c-txt-fuchsia-50:var(--sf-dark-c-fuchsia-50);--sf-dark-c-txt-fuchsia-60:var(--sf-dark-c-fuchsia-60);--sf-dark-c-txt-fuchsia-70:var(--sf-dark-c-fuchsia-70);--sf-dark-c-txt-fuchsia-80:var(--sf-dark-c-fuchsia-80);--sf-dark-c-txt-fuchsia-90:var(--sf-dark-c-fuchsia-90);--sf-dark-c-txt-fuchsia-100:var(--sf-dark-c-fuchsia-100)}.sf-c-fuchsia{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}.sf-c-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}.sf-c-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}.sf-c-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}.sf-c-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}.sf-c-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}.sf-c-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-50))}.sf-c-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-60))}.sf-c-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}.sf-c-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}.sf-c-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}.sf-c-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-100))}html.var .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var .sf-c-fuchsia\:10{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var .sf-c-fuchsia\:20{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var .sf-c-fuchsia\:30{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var .sf-c-fuchsia\:40{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var .sf-c-fuchsia\:50{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,60%)}html.var .sf-c-fuchsia\:70{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var .sf-c-fuchsia\:80{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var .sf-c-fuchsia\:90{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var .sf-c-fuchsia\:100{color:hsl(300,100%,10%);background:hsl(300,100%,100%)}.sf-c-txt-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia))}.sf-c-txt-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-100))}.sf-c-txt-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-90))}.sf-c-txt-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-80))}.sf-c-txt-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-70))}.sf-c-txt-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-60))}.sf-c-txt-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-50))}.sf-c-txt-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-40))}.sf-c-txt-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-30))}.sf-c-txt-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-20))}.sf-c-txt-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-10))}.sf-c-txt-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-0))}html.var .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var .sf-c-txt-fuchsia\:0{color:hsl(300,100%,100%)}html.var .sf-c-txt-fuchsia\:10{color:hsl(300,100%,90%)}html.var .sf-c-txt-fuchsia\:20{color:hsl(300,100%,80%)}html.var .sf-c-txt-fuchsia\:30{color:hsl(300,100%,70%)}html.var .sf-c-txt-fuchsia\:40{color:hsl(300,100%,60%)}html.var .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var .sf-c-txt-fuchsia\:60{color:hsl(300,100%,40%)}html.var .sf-c-txt-fuchsia\:70{color:hsl(300,100%,30%)}html.var .sf-c-txt-fuchsia\:80{color:hsl(300,100%,20%)}html.var .sf-c-txt-fuchsia\:90{color:hsl(300,100%,10%)}html.var .sf-c-txt-fuchsia\:100{color:hsl(300,100%,0%)}html[data-theme='dark'] .sf-c-fuchsia,html.dark .sf-c-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia))}html[data-theme='dark'] .sf-c-fuchsia\:0,html.dark .sf-c-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-100))}html[data-theme='dark'] .sf-c-fuchsia\:10,html.dark .sf-c-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-90))}html[data-theme='dark'] .sf-c-fuchsia\:20,html.dark .sf-c-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-80))}html[data-theme='dark'] .sf-c-fuchsia\:30,html.dark .sf-c-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-70))}html[data-theme='dark'] .sf-c-fuchsia\:40,html.dark .sf-c-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-60))}html[data-theme='dark'] .sf-c-fuchsia\:50,html.dark .sf-c-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-50))}html[data-theme='dark'] .sf-c-fuchsia\:60,html.dark .sf-c-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-40))}html[data-theme='dark'] .sf-c-fuchsia\:70,html.dark .sf-c-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-30))}html[data-theme='dark'] .sf-c-fuchsia\:80,html.dark .sf-c-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-20))}html[data-theme='dark'] .sf-c-fuchsia\:90,html.dark .sf-c-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-10))}html[data-theme='dark'] .sf-c-fuchsia\:100,html.dark .sf-c-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-0))}html[data-theme='dark'] .sf-c-fuchsia\:dark,html.dark .sf-c-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}html[data-theme='dark'] .sf-c-fuchsia\:0\:dark,html.dark .sf-c-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-100))}html[data-theme='dark'] .sf-c-fuchsia\:10\:dark,html.dark .sf-c-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}html[data-theme='dark'] .sf-c-fuchsia\:20\:dark,html.dark .sf-c-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}html[data-theme='dark'] .sf-c-fuchsia\:30\:dark,html.dark .sf-c-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}html[data-theme='dark'] .sf-c-fuchsia\:40\:dark,html.dark .sf-c-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-60))}html[data-theme='dark'] .sf-c-fuchsia\:50\:dark,html.dark .sf-c-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-50))}html[data-theme='dark'] .sf-c-fuchsia\:60\:dark,html.dark .sf-c-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}html[data-theme='dark'] .sf-c-fuchsia\:70\:dark,html.dark .sf-c-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}html[data-theme='dark'] .sf-c-fuchsia\:80\:dark,html.dark .sf-c-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}html[data-theme='dark'] .sf-c-fuchsia\:90\:dark,html.dark .sf-c-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}html[data-theme='dark'] .sf-c-fuchsia\:100\:dark,html.dark .sf-c-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia,html.dark .sf-c-txt-fuchsia{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='dark'] .sf-c-txt-fuchsia\:0,html.dark .sf-c-txt-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia\:10,html.dark .sf-c-txt-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='dark'] .sf-c-txt-fuchsia\:20,html.dark .sf-c-txt-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='dark'] .sf-c-txt-fuchsia\:30,html.dark .sf-c-txt-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='dark'] .sf-c-txt-fuchsia\:40,html.dark .sf-c-txt-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='dark'] .sf-c-txt-fuchsia\:50,html.dark .sf-c-txt-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='dark'] .sf-c-txt-fuchsia\:60,html.dark .sf-c-txt-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='dark'] .sf-c-txt-fuchsia\:70,html.dark .sf-c-txt-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='dark'] .sf-c-txt-fuchsia\:80,html.dark .sf-c-txt-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='dark'] .sf-c-txt-fuchsia\:90,html.dark .sf-c-txt-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='dark'] .sf-c-txt-fuchsia\:100,html.dark .sf-c-txt-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-100))}html[data-theme='dark'] .sf-c-txt-fuchsia\:dark,html.dark .sf-c-txt-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='dark'] .sf-c-txt-fuchsia\:0\:dark,html.dark .sf-c-txt-fuchsia\:0\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-0))}html[data-theme='dark'] .sf-c-txt-fuchsia\:10\:dark,html.dark .sf-c-txt-fuchsia\:10\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-10))}html[data-theme='dark'] .sf-c-txt-fuchsia\:20\:dark,html.dark .sf-c-txt-fuchsia\:20\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-20))}html[data-theme='dark'] .sf-c-txt-fuchsia\:30\:dark,html.dark .sf-c-txt-fuchsia\:30\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-30))}html[data-theme='dark'] .sf-c-txt-fuchsia\:40\:dark,html.dark .sf-c-txt-fuchsia\:40\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-40))}html[data-theme='dark'] .sf-c-txt-fuchsia\:50\:dark,html.dark .sf-c-txt-fuchsia\:50\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-50))}html[data-theme='dark'] .sf-c-txt-fuchsia\:60\:dark,html.dark .sf-c-txt-fuchsia\:60\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-60))}html[data-theme='dark'] .sf-c-txt-fuchsia\:70\:dark,html.dark .sf-c-txt-fuchsia\:70\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-70))}html[data-theme='dark'] .sf-c-txt-fuchsia\:80\:dark,html.dark .sf-c-txt-fuchsia\:80\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-80))}html[data-theme='dark'] .sf-c-txt-fuchsia\:90\:dark,html.dark .sf-c-txt-fuchsia\:90\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-90))}html[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark,html.dark .sf-c-txt-fuchsia\:100\:dark{color:hsl(var(--sf-dark-c-txt-fuchsia-100))}html.var[data-theme='dark'] .sf-c-fuchsia,html.var.dark .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:0,html.var.dark .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-fuchsia\:10,html.var.dark .sf-c-fuchsia\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-fuchsia\:20,html.var.dark .sf-c-fuchsia\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-fuchsia\:30,html.var.dark .sf-c-fuchsia\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-fuchsia\:40,html.var.dark .sf-c-fuchsia\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-fuchsia\:50,html.var.dark .sf-c-fuchsia\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:60,html.var.dark .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-fuchsia\:70,html.var.dark .sf-c-fuchsia\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-fuchsia\:80,html.var.dark .sf-c-fuchsia\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-fuchsia\:90,html.var.dark .sf-c-fuchsia\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-fuchsia\:100,html.var.dark .sf-c-fuchsia\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-fuchsia\:dark,html.var.dark .sf-c-fuchsia\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:0\:dark,html.var.dark .sf-c-fuchsia\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-fuchsia\:10\:dark,html.var.dark .sf-c-fuchsia\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-fuchsia\:20\:dark,html.var.dark .sf-c-fuchsia\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-fuchsia\:30\:dark,html.var.dark .sf-c-fuchsia\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-fuchsia\:40\:dark,html.var.dark .sf-c-fuchsia\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-fuchsia\:50\:dark,html.var.dark .sf-c-fuchsia\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-fuchsia\:60\:dark,html.var.dark .sf-c-fuchsia\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-fuchsia\:70\:dark,html.var.dark .sf-c-fuchsia\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-fuchsia\:80\:dark,html.var.dark .sf-c-fuchsia\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-fuchsia\:90\:dark,html.var.dark .sf-c-fuchsia\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-fuchsia\:100\:dark,html.var.dark .sf-c-fuchsia\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia,html.dark .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:0,html.dark .sf-c-txt-fuchsia\:0{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:10,html.dark .sf-c-txt-fuchsia\:10{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:20,html.dark .sf-c-txt-fuchsia\:20{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:30,html.dark .sf-c-txt-fuchsia\:30{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:40,html.dark .sf-c-txt-fuchsia\:40{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:50,html.dark .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:60,html.dark .sf-c-txt-fuchsia\:60{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:70,html.dark .sf-c-txt-fuchsia\:70{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:80,html.dark .sf-c-txt-fuchsia\:80{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:90,html.dark .sf-c-txt-fuchsia\:90{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100,html.dark .sf-c-txt-fuchsia\:100{color:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:dark,html.dark .sf-c-txt-fuchsia\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:0\:dark,html.dark .sf-c-txt-fuchsia\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:10\:dark,html.dark .sf-c-txt-fuchsia\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:20\:dark,html.dark .sf-c-txt-fuchsia\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:30\:dark,html.dark .sf-c-txt-fuchsia\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:40\:dark,html.dark .sf-c-txt-fuchsia\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:50\:dark,html.dark .sf-c-txt-fuchsia\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:60\:dark,html.dark .sf-c-txt-fuchsia\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:70\:dark,html.dark .sf-c-txt-fuchsia\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:80\:dark,html.dark .sf-c-txt-fuchsia\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:90\:dark,html.dark .sf-c-txt-fuchsia\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-fuchsia\:100\:dark,html.dark .sf-c-txt-fuchsia\:100\:dark{color:hsl(300,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-fuchsia,html.auto .sf-c-fuchsia{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia))}html[data-theme='auto'] .sf-c-fuchsia\:0,html.auto .sf-c-fuchsia\:0{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-100))}html[data-theme='auto'] .sf-c-fuchsia\:10,html.auto .sf-c-fuchsia\:10{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-90))}html[data-theme='auto'] .sf-c-fuchsia\:20,html.auto .sf-c-fuchsia\:20{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-80))}html[data-theme='auto'] .sf-c-fuchsia\:30,html.auto .sf-c-fuchsia\:30{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-70))}html[data-theme='auto'] .sf-c-fuchsia\:40,html.auto .sf-c-fuchsia\:40{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-60))}html[data-theme='auto'] .sf-c-fuchsia\:50,html.auto .sf-c-fuchsia\:50{color:hsl(var(--sf-dark-c-txt-fuchsia-10));background:hsl(var(--sf-dark-c-fuchsia-50))}html[data-theme='auto'] .sf-c-fuchsia\:60,html.auto .sf-c-fuchsia\:60{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-40))}html[data-theme='auto'] .sf-c-fuchsia\:70,html.auto .sf-c-fuchsia\:70{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-30))}html[data-theme='auto'] .sf-c-fuchsia\:80,html.auto .sf-c-fuchsia\:80{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-20))}html[data-theme='auto'] .sf-c-fuchsia\:90,html.auto .sf-c-fuchsia\:90{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-10))}html[data-theme='auto'] .sf-c-fuchsia\:100,html.auto .sf-c-fuchsia\:100{color:hsl(var(--sf-dark-c-txt-fuchsia-90));background:hsl(var(--sf-dark-c-fuchsia-0))}html[data-theme='auto'] .sf-c-fuchsia\:dark,html.auto .sf-c-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia))}html[data-theme='auto'] .sf-c-fuchsia\:0\:dark,html.auto .sf-c-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-100))}html[data-theme='auto'] .sf-c-fuchsia\:10\:dark,html.auto .sf-c-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-90))}html[data-theme='auto'] .sf-c-fuchsia\:20\:dark,html.auto .sf-c-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-80))}html[data-theme='auto'] .sf-c-fuchsia\:30\:dark,html.auto .sf-c-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-70))}html[data-theme='auto'] .sf-c-fuchsia\:40\:dark,html.auto .sf-c-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-60))}html[data-theme='auto'] .sf-c-fuchsia\:50\:dark,html.auto .sf-c-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-10));background:hsl(var(--sf-c-fuchsia-50))}html[data-theme='auto'] .sf-c-fuchsia\:60\:dark,html.auto .sf-c-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-40))}html[data-theme='auto'] .sf-c-fuchsia\:70\:dark,html.auto .sf-c-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-30))}html[data-theme='auto'] .sf-c-fuchsia\:80\:dark,html.auto .sf-c-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-20))}html[data-theme='auto'] .sf-c-fuchsia\:90\:dark,html.auto .sf-c-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-10))}html[data-theme='auto'] .sf-c-fuchsia\:100\:dark,html.auto .sf-c-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-90));background:hsl(var(--sf-c-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia,html.auto .sf-c-txt-fuchsia{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='auto'] .sf-c-txt-fuchsia\:0,html.auto .sf-c-txt-fuchsia\:0{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia\:10,html.auto .sf-c-txt-fuchsia\:10{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='auto'] .sf-c-txt-fuchsia\:20,html.auto .sf-c-txt-fuchsia\:20{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='auto'] .sf-c-txt-fuchsia\:30,html.auto .sf-c-txt-fuchsia\:30{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='auto'] .sf-c-txt-fuchsia\:40,html.auto .sf-c-txt-fuchsia\:40{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='auto'] .sf-c-txt-fuchsia\:50,html.auto .sf-c-txt-fuchsia\:50{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='auto'] .sf-c-txt-fuchsia\:60,html.auto .sf-c-txt-fuchsia\:60{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='auto'] .sf-c-txt-fuchsia\:70,html.auto .sf-c-txt-fuchsia\:70{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='auto'] .sf-c-txt-fuchsia\:80,html.auto .sf-c-txt-fuchsia\:80{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='auto'] .sf-c-txt-fuchsia\:90,html.auto .sf-c-txt-fuchsia\:90{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='auto'] .sf-c-txt-fuchsia\:100,html.auto .sf-c-txt-fuchsia\:100{color:hsl(var(--sf-c-txt-fuchsia-100))}html[data-theme='auto'] .sf-c-txt-fuchsia\:dark,html.auto .sf-c-txt-fuchsia\:dark{color:hsl(var(--sf-c-txt-fuchsia))}html[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark,html.auto .sf-c-txt-fuchsia\:0\:dark{color:hsl(var(--sf-c-txt-fuchsia-0))}html[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark,html.auto .sf-c-txt-fuchsia\:10\:dark{color:hsl(var(--sf-c-txt-fuchsia-10))}html[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark,html.auto .sf-c-txt-fuchsia\:20\:dark{color:hsl(var(--sf-c-txt-fuchsia-20))}html[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark,html.auto .sf-c-txt-fuchsia\:30\:dark{color:hsl(var(--sf-c-txt-fuchsia-30))}html[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark,html.auto .sf-c-txt-fuchsia\:40\:dark{color:hsl(var(--sf-c-txt-fuchsia-40))}html[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark,html.auto .sf-c-txt-fuchsia\:50\:dark{color:hsl(var(--sf-c-txt-fuchsia-50))}html[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark,html.auto .sf-c-txt-fuchsia\:60\:dark{color:hsl(var(--sf-c-txt-fuchsia-60))}html[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark,html.auto .sf-c-txt-fuchsia\:70\:dark{color:hsl(var(--sf-c-txt-fuchsia-70))}html[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark,html.auto .sf-c-txt-fuchsia\:80\:dark{color:hsl(var(--sf-c-txt-fuchsia-80))}html[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark,html.auto .sf-c-txt-fuchsia\:90\:dark{color:hsl(var(--sf-c-txt-fuchsia-90))}html[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark,html.auto .sf-c-txt-fuchsia\:100\:dark{color:hsl(var(--sf-c-txt-fuchsia-100))}html.var[data-theme='auto'] .sf-c-fuchsia,html.var.auto .sf-c-fuchsia{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:0,html.var.auto .sf-c-fuchsia\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-fuchsia\:10,html.var.auto .sf-c-fuchsia\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-fuchsia\:20,html.var.auto .sf-c-fuchsia\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-fuchsia\:30,html.var.auto .sf-c-fuchsia\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-fuchsia\:40,html.var.auto .sf-c-fuchsia\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-fuchsia\:50,html.var.auto .sf-c-fuchsia\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:60,html.var.auto .sf-c-fuchsia\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-fuchsia\:70,html.var.auto .sf-c-fuchsia\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-fuchsia\:80,html.var.auto .sf-c-fuchsia\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-fuchsia\:90,html.var.auto .sf-c-fuchsia\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-fuchsia\:100,html.var.auto .sf-c-fuchsia\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-fuchsia\:dark,html.var.auto .sf-c-fuchsia\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:0\:dark,html.var.auto .sf-c-fuchsia\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-fuchsia\:10\:dark,html.var.auto .sf-c-fuchsia\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-fuchsia\:20\:dark,html.var.auto .sf-c-fuchsia\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-fuchsia\:30\:dark,html.var.auto .sf-c-fuchsia\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-fuchsia\:40\:dark,html.var.auto .sf-c-fuchsia\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-fuchsia\:50\:dark,html.var.auto .sf-c-fuchsia\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-fuchsia\:60\:dark,html.var.auto .sf-c-fuchsia\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-fuchsia\:70\:dark,html.var.auto .sf-c-fuchsia\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-fuchsia\:80\:dark,html.var.auto .sf-c-fuchsia\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-fuchsia\:90\:dark,html.var.auto .sf-c-fuchsia\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-fuchsia\:100\:dark,html.var.auto .sf-c-fuchsia\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia,html.auto .sf-c-txt-fuchsia{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0,html.auto .sf-c-txt-fuchsia\:0{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10,html.auto .sf-c-txt-fuchsia\:10{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20,html.auto .sf-c-txt-fuchsia\:20{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30,html.auto .sf-c-txt-fuchsia\:30{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40,html.auto .sf-c-txt-fuchsia\:40{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50,html.auto .sf-c-txt-fuchsia\:50{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60,html.auto .sf-c-txt-fuchsia\:60{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70,html.auto .sf-c-txt-fuchsia\:70{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80,html.auto .sf-c-txt-fuchsia\:80{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90,html.auto .sf-c-txt-fuchsia\:90{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100,html.auto .sf-c-txt-fuchsia\:100{color:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:dark,html.auto .sf-c-txt-fuchsia\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:0\:dark,html.auto .sf-c-txt-fuchsia\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:10\:dark,html.auto .sf-c-txt-fuchsia\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:20\:dark,html.auto .sf-c-txt-fuchsia\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:30\:dark,html.auto .sf-c-txt-fuchsia\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:40\:dark,html.auto .sf-c-txt-fuchsia\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:50\:dark,html.auto .sf-c-txt-fuchsia\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:60\:dark,html.auto .sf-c-txt-fuchsia\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:70\:dark,html.auto .sf-c-txt-fuchsia\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:80\:dark,html.auto .sf-c-txt-fuchsia\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:90\:dark,html.auto .sf-c-txt-fuchsia\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-fuchsia\:100\:dark,html.auto .sf-c-txt-fuchsia\:100\:dark{color:hsl(300,100%,100%)}}[class*='gray']{--sf-c-gray:0 0% 50%;--sf-c-gray-0:0 0% 0%;--sf-c-gray-10:0 0% 10%;--sf-c-gray-20:0 0% 20%;--sf-c-gray-30:0 0% 30%;--sf-c-gray-40:0 0% 40%;--sf-c-gray-50:0 0% 50%;--sf-c-gray-60:0 0% 60%;--sf-c-gray-70:0 0% 70%;--sf-c-gray-80:0 0% 80%;--sf-c-gray-90:0 0% 90%;--sf-c-gray-100:0 0% 100%;--sf-c-txt-gray:var(--sf-c-gray);--sf-c-txt-gray-0:var(--sf-c-gray-0);--sf-c-txt-gray-10:var(--sf-c-gray-10);--sf-c-txt-gray-20:var(--sf-c-gray-20);--sf-c-txt-gray-30:var(--sf-c-gray-30);--sf-c-txt-gray-40:var(--sf-c-gray-40);--sf-c-txt-gray-50:var(--sf-c-gray-50);--sf-c-txt-gray-60:var(--sf-c-gray-60);--sf-c-txt-gray-70:var(--sf-c-gray-70);--sf-c-txt-gray-80:var(--sf-c-gray-80);--sf-c-txt-gray-90:var(--sf-c-gray-90);--sf-c-txt-gray-100:var(--sf-c-gray-100);--sf-dark-c-gray:0 0% 50%;--sf-dark-c-gray-0:0 0% 0%;--sf-dark-c-gray-10:0 0% 10%;--sf-dark-c-gray-20:0 0% 20%;--sf-dark-c-gray-30:0 0% 30%;--sf-dark-c-gray-40:0 0% 40%;--sf-dark-c-gray-50:0 0% 50%;--sf-dark-c-gray-60:0 0% 60%;--sf-dark-c-gray-70:0 0% 70%;--sf-dark-c-gray-80:0 0% 80%;--sf-dark-c-gray-90:0 0% 90%;--sf-dark-c-gray-100:0 0% 100%;--sf-dark-c-txt-gray:var(--sf-dark-c-gray);--sf-dark-c-txt-gray-0:var(--sf-dark-c-gray-0);--sf-dark-c-txt-gray-10:var(--sf-dark-c-gray-10);--sf-dark-c-txt-gray-20:var(--sf-dark-c-gray-20);--sf-dark-c-txt-gray-30:var(--sf-dark-c-gray-30);--sf-dark-c-txt-gray-40:var(--sf-dark-c-gray-40);--sf-dark-c-txt-gray-50:var(--sf-dark-c-gray-50);--sf-dark-c-txt-gray-60:var(--sf-dark-c-gray-60);--sf-dark-c-txt-gray-70:var(--sf-dark-c-gray-70);--sf-dark-c-txt-gray-80:var(--sf-dark-c-gray-80);--sf-dark-c-txt-gray-90:var(--sf-dark-c-gray-90);--sf-dark-c-txt-gray-100:var(--sf-dark-c-gray-100)}.sf-c-gray{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}.sf-c-gray\:0{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}.sf-c-gray\:10{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}.sf-c-gray\:20{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}.sf-c-gray\:30{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}.sf-c-gray\:40{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}.sf-c-gray\:50{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-50))}.sf-c-gray\:60{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-60))}.sf-c-gray\:70{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}.sf-c-gray\:80{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}.sf-c-gray\:90{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}.sf-c-gray\:100{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-100))}html.var .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-gray\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-gray\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-gray\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-gray\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-gray\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-gray\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-gray\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-gray\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-gray\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-gray{color:hsl(var(--sf-dark-c-txt-gray))}.sf-c-txt-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-100))}.sf-c-txt-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-90))}.sf-c-txt-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-80))}.sf-c-txt-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-70))}.sf-c-txt-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-60))}.sf-c-txt-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-50))}.sf-c-txt-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-40))}.sf-c-txt-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-30))}.sf-c-txt-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-20))}.sf-c-txt-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-10))}.sf-c-txt-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-0))}html.var .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var .sf-c-txt-gray\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-gray\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-gray\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-gray\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-gray\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-gray\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-gray\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-gray\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-gray\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-gray\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-gray,html.dark .sf-c-gray{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray))}html[data-theme='dark'] .sf-c-gray\:0,html.dark .sf-c-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-100))}html[data-theme='dark'] .sf-c-gray\:10,html.dark .sf-c-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-90))}html[data-theme='dark'] .sf-c-gray\:20,html.dark .sf-c-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-80))}html[data-theme='dark'] .sf-c-gray\:30,html.dark .sf-c-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-70))}html[data-theme='dark'] .sf-c-gray\:40,html.dark .sf-c-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-60))}html[data-theme='dark'] .sf-c-gray\:50,html.dark .sf-c-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-50))}html[data-theme='dark'] .sf-c-gray\:60,html.dark .sf-c-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-40))}html[data-theme='dark'] .sf-c-gray\:70,html.dark .sf-c-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-30))}html[data-theme='dark'] .sf-c-gray\:80,html.dark .sf-c-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-20))}html[data-theme='dark'] .sf-c-gray\:90,html.dark .sf-c-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-10))}html[data-theme='dark'] .sf-c-gray\:100,html.dark .sf-c-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-0))}html[data-theme='dark'] .sf-c-gray\:dark,html.dark .sf-c-gray\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}html[data-theme='dark'] .sf-c-gray\:0\:dark,html.dark .sf-c-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-100))}html[data-theme='dark'] .sf-c-gray\:10\:dark,html.dark .sf-c-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}html[data-theme='dark'] .sf-c-gray\:20\:dark,html.dark .sf-c-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}html[data-theme='dark'] .sf-c-gray\:30\:dark,html.dark .sf-c-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}html[data-theme='dark'] .sf-c-gray\:40\:dark,html.dark .sf-c-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-60))}html[data-theme='dark'] .sf-c-gray\:50\:dark,html.dark .sf-c-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-50))}html[data-theme='dark'] .sf-c-gray\:60\:dark,html.dark .sf-c-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}html[data-theme='dark'] .sf-c-gray\:70\:dark,html.dark .sf-c-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}html[data-theme='dark'] .sf-c-gray\:80\:dark,html.dark .sf-c-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}html[data-theme='dark'] .sf-c-gray\:90\:dark,html.dark .sf-c-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}html[data-theme='dark'] .sf-c-gray\:100\:dark,html.dark .sf-c-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}html[data-theme='dark'] .sf-c-txt-gray,html.dark .sf-c-txt-gray{color:hsl(var(--sf-c-txt-gray))}html[data-theme='dark'] .sf-c-txt-gray\:0,html.dark .sf-c-txt-gray\:0{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='dark'] .sf-c-txt-gray\:10,html.dark .sf-c-txt-gray\:10{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='dark'] .sf-c-txt-gray\:20,html.dark .sf-c-txt-gray\:20{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='dark'] .sf-c-txt-gray\:30,html.dark .sf-c-txt-gray\:30{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='dark'] .sf-c-txt-gray\:40,html.dark .sf-c-txt-gray\:40{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='dark'] .sf-c-txt-gray\:50,html.dark .sf-c-txt-gray\:50{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='dark'] .sf-c-txt-gray\:60,html.dark .sf-c-txt-gray\:60{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='dark'] .sf-c-txt-gray\:70,html.dark .sf-c-txt-gray\:70{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='dark'] .sf-c-txt-gray\:80,html.dark .sf-c-txt-gray\:80{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='dark'] .sf-c-txt-gray\:90,html.dark .sf-c-txt-gray\:90{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='dark'] .sf-c-txt-gray\:100,html.dark .sf-c-txt-gray\:100{color:hsl(var(--sf-c-txt-gray-100))}html[data-theme='dark'] .sf-c-txt-gray\:dark,html.dark .sf-c-txt-gray\:dark{color:hsl(var(--sf-c-txt-gray))}html[data-theme='dark'] .sf-c-txt-gray\:0\:dark,html.dark .sf-c-txt-gray\:0\:dark{color:hsl(var(--sf-dark-c-txt-gray-0))}html[data-theme='dark'] .sf-c-txt-gray\:10\:dark,html.dark .sf-c-txt-gray\:10\:dark{color:hsl(var(--sf-dark-c-txt-gray-10))}html[data-theme='dark'] .sf-c-txt-gray\:20\:dark,html.dark .sf-c-txt-gray\:20\:dark{color:hsl(var(--sf-dark-c-txt-gray-20))}html[data-theme='dark'] .sf-c-txt-gray\:30\:dark,html.dark .sf-c-txt-gray\:30\:dark{color:hsl(var(--sf-dark-c-txt-gray-30))}html[data-theme='dark'] .sf-c-txt-gray\:40\:dark,html.dark .sf-c-txt-gray\:40\:dark{color:hsl(var(--sf-dark-c-txt-gray-40))}html[data-theme='dark'] .sf-c-txt-gray\:50\:dark,html.dark .sf-c-txt-gray\:50\:dark{color:hsl(var(--sf-dark-c-txt-gray-50))}html[data-theme='dark'] .sf-c-txt-gray\:60\:dark,html.dark .sf-c-txt-gray\:60\:dark{color:hsl(var(--sf-dark-c-txt-gray-60))}html[data-theme='dark'] .sf-c-txt-gray\:70\:dark,html.dark .sf-c-txt-gray\:70\:dark{color:hsl(var(--sf-dark-c-txt-gray-70))}html[data-theme='dark'] .sf-c-txt-gray\:80\:dark,html.dark .sf-c-txt-gray\:80\:dark{color:hsl(var(--sf-dark-c-txt-gray-80))}html[data-theme='dark'] .sf-c-txt-gray\:90\:dark,html.dark .sf-c-txt-gray\:90\:dark{color:hsl(var(--sf-dark-c-txt-gray-90))}html[data-theme='dark'] .sf-c-txt-gray\:100\:dark,html.dark .sf-c-txt-gray\:100\:dark{color:hsl(var(--sf-dark-c-txt-gray-100))}html.var[data-theme='dark'] .sf-c-gray,html.var.dark .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:0,html.var.dark .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-gray\:10,html.var.dark .sf-c-gray\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-gray\:20,html.var.dark .sf-c-gray\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-gray\:30,html.var.dark .sf-c-gray\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-gray\:40,html.var.dark .sf-c-gray\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-gray\:50,html.var.dark .sf-c-gray\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:60,html.var.dark .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-gray\:70,html.var.dark .sf-c-gray\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-gray\:80,html.var.dark .sf-c-gray\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-gray\:90,html.var.dark .sf-c-gray\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-gray\:100,html.var.dark .sf-c-gray\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-gray\:dark,html.var.dark .sf-c-gray\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:0\:dark,html.var.dark .sf-c-gray\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-gray\:10\:dark,html.var.dark .sf-c-gray\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-gray\:20\:dark,html.var.dark .sf-c-gray\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-gray\:30\:dark,html.var.dark .sf-c-gray\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-gray\:40\:dark,html.var.dark .sf-c-gray\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-gray\:50\:dark,html.var.dark .sf-c-gray\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-gray\:60\:dark,html.var.dark .sf-c-gray\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-gray\:70\:dark,html.var.dark .sf-c-gray\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-gray\:80\:dark,html.var.dark .sf-c-gray\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-gray\:90\:dark,html.var.dark .sf-c-gray\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-gray\:100\:dark,html.var.dark .sf-c-gray\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray,html.dark .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:0,html.dark .sf-c-txt-gray\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray\:10,html.dark .sf-c-txt-gray\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-gray\:20,html.dark .sf-c-txt-gray\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-gray\:30,html.dark .sf-c-txt-gray\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-gray\:40,html.dark .sf-c-txt-gray\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-gray\:50,html.dark .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:60,html.dark .sf-c-txt-gray\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-gray\:70,html.dark .sf-c-txt-gray\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-gray\:80,html.dark .sf-c-txt-gray\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-gray\:90,html.dark .sf-c-txt-gray\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-gray\:100,html.dark .sf-c-txt-gray\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-gray\:dark,html.dark .sf-c-txt-gray\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:0\:dark,html.dark .sf-c-txt-gray\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-gray\:10\:dark,html.dark .sf-c-txt-gray\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-gray\:20\:dark,html.dark .sf-c-txt-gray\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-gray\:30\:dark,html.dark .sf-c-txt-gray\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-gray\:40\:dark,html.dark .sf-c-txt-gray\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-gray\:50\:dark,html.dark .sf-c-txt-gray\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-gray\:60\:dark,html.dark .sf-c-txt-gray\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-gray\:70\:dark,html.dark .sf-c-txt-gray\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-gray\:80\:dark,html.dark .sf-c-txt-gray\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-gray\:90\:dark,html.dark .sf-c-txt-gray\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-gray\:100\:dark,html.dark .sf-c-txt-gray\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-gray,html.auto .sf-c-gray{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray))}html[data-theme='auto'] .sf-c-gray\:0,html.auto .sf-c-gray\:0{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-100))}html[data-theme='auto'] .sf-c-gray\:10,html.auto .sf-c-gray\:10{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-90))}html[data-theme='auto'] .sf-c-gray\:20,html.auto .sf-c-gray\:20{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-80))}html[data-theme='auto'] .sf-c-gray\:30,html.auto .sf-c-gray\:30{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-70))}html[data-theme='auto'] .sf-c-gray\:40,html.auto .sf-c-gray\:40{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-60))}html[data-theme='auto'] .sf-c-gray\:50,html.auto .sf-c-gray\:50{color:hsl(var(--sf-dark-c-txt-gray-10));background:hsl(var(--sf-dark-c-gray-50))}html[data-theme='auto'] .sf-c-gray\:60,html.auto .sf-c-gray\:60{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-40))}html[data-theme='auto'] .sf-c-gray\:70,html.auto .sf-c-gray\:70{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-30))}html[data-theme='auto'] .sf-c-gray\:80,html.auto .sf-c-gray\:80{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-20))}html[data-theme='auto'] .sf-c-gray\:90,html.auto .sf-c-gray\:90{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-10))}html[data-theme='auto'] .sf-c-gray\:100,html.auto .sf-c-gray\:100{color:hsl(var(--sf-dark-c-txt-gray-90));background:hsl(var(--sf-dark-c-gray-0))}html[data-theme='auto'] .sf-c-gray\:dark,html.auto .sf-c-gray\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray))}html[data-theme='auto'] .sf-c-gray\:0\:dark,html.auto .sf-c-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-100))}html[data-theme='auto'] .sf-c-gray\:10\:dark,html.auto .sf-c-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-90))}html[data-theme='auto'] .sf-c-gray\:20\:dark,html.auto .sf-c-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-80))}html[data-theme='auto'] .sf-c-gray\:30\:dark,html.auto .sf-c-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-70))}html[data-theme='auto'] .sf-c-gray\:40\:dark,html.auto .sf-c-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-60))}html[data-theme='auto'] .sf-c-gray\:50\:dark,html.auto .sf-c-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-10));background:hsl(var(--sf-c-gray-50))}html[data-theme='auto'] .sf-c-gray\:60\:dark,html.auto .sf-c-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-40))}html[data-theme='auto'] .sf-c-gray\:70\:dark,html.auto .sf-c-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-30))}html[data-theme='auto'] .sf-c-gray\:80\:dark,html.auto .sf-c-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-20))}html[data-theme='auto'] .sf-c-gray\:90\:dark,html.auto .sf-c-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-10))}html[data-theme='auto'] .sf-c-gray\:100\:dark,html.auto .sf-c-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-90));background:hsl(var(--sf-c-gray-0))}html[data-theme='auto'] .sf-c-txt-gray,html.auto .sf-c-txt-gray{color:hsl(var(--sf-c-txt-gray))}html[data-theme='auto'] .sf-c-txt-gray\:0,html.auto .sf-c-txt-gray\:0{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='auto'] .sf-c-txt-gray\:10,html.auto .sf-c-txt-gray\:10{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='auto'] .sf-c-txt-gray\:20,html.auto .sf-c-txt-gray\:20{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='auto'] .sf-c-txt-gray\:30,html.auto .sf-c-txt-gray\:30{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='auto'] .sf-c-txt-gray\:40,html.auto .sf-c-txt-gray\:40{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='auto'] .sf-c-txt-gray\:50,html.auto .sf-c-txt-gray\:50{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='auto'] .sf-c-txt-gray\:60,html.auto .sf-c-txt-gray\:60{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='auto'] .sf-c-txt-gray\:70,html.auto .sf-c-txt-gray\:70{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='auto'] .sf-c-txt-gray\:80,html.auto .sf-c-txt-gray\:80{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='auto'] .sf-c-txt-gray\:90,html.auto .sf-c-txt-gray\:90{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='auto'] .sf-c-txt-gray\:100,html.auto .sf-c-txt-gray\:100{color:hsl(var(--sf-c-txt-gray-100))}html[data-theme='auto'] .sf-c-txt-gray\:dark,html.auto .sf-c-txt-gray\:dark{color:hsl(var(--sf-c-txt-gray))}html[data-theme='auto'] .sf-c-txt-gray\:0\:dark,html.auto .sf-c-txt-gray\:0\:dark{color:hsl(var(--sf-c-txt-gray-0))}html[data-theme='auto'] .sf-c-txt-gray\:10\:dark,html.auto .sf-c-txt-gray\:10\:dark{color:hsl(var(--sf-c-txt-gray-10))}html[data-theme='auto'] .sf-c-txt-gray\:20\:dark,html.auto .sf-c-txt-gray\:20\:dark{color:hsl(var(--sf-c-txt-gray-20))}html[data-theme='auto'] .sf-c-txt-gray\:30\:dark,html.auto .sf-c-txt-gray\:30\:dark{color:hsl(var(--sf-c-txt-gray-30))}html[data-theme='auto'] .sf-c-txt-gray\:40\:dark,html.auto .sf-c-txt-gray\:40\:dark{color:hsl(var(--sf-c-txt-gray-40))}html[data-theme='auto'] .sf-c-txt-gray\:50\:dark,html.auto .sf-c-txt-gray\:50\:dark{color:hsl(var(--sf-c-txt-gray-50))}html[data-theme='auto'] .sf-c-txt-gray\:60\:dark,html.auto .sf-c-txt-gray\:60\:dark{color:hsl(var(--sf-c-txt-gray-60))}html[data-theme='auto'] .sf-c-txt-gray\:70\:dark,html.auto .sf-c-txt-gray\:70\:dark{color:hsl(var(--sf-c-txt-gray-70))}html[data-theme='auto'] .sf-c-txt-gray\:80\:dark,html.auto .sf-c-txt-gray\:80\:dark{color:hsl(var(--sf-c-txt-gray-80))}html[data-theme='auto'] .sf-c-txt-gray\:90\:dark,html.auto .sf-c-txt-gray\:90\:dark{color:hsl(var(--sf-c-txt-gray-90))}html[data-theme='auto'] .sf-c-txt-gray\:100\:dark,html.auto .sf-c-txt-gray\:100\:dark{color:hsl(var(--sf-c-txt-gray-100))}html.var[data-theme='auto'] .sf-c-gray,html.var.auto .sf-c-gray{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:0,html.var.auto .sf-c-gray\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-gray\:10,html.var.auto .sf-c-gray\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-gray\:20,html.var.auto .sf-c-gray\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-gray\:30,html.var.auto .sf-c-gray\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-gray\:40,html.var.auto .sf-c-gray\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-gray\:50,html.var.auto .sf-c-gray\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:60,html.var.auto .sf-c-gray\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-gray\:70,html.var.auto .sf-c-gray\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-gray\:80,html.var.auto .sf-c-gray\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-gray\:90,html.var.auto .sf-c-gray\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-gray\:100,html.var.auto .sf-c-gray\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-gray\:dark,html.var.auto .sf-c-gray\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:0\:dark,html.var.auto .sf-c-gray\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-gray\:10\:dark,html.var.auto .sf-c-gray\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-gray\:20\:dark,html.var.auto .sf-c-gray\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-gray\:30\:dark,html.var.auto .sf-c-gray\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-gray\:40\:dark,html.var.auto .sf-c-gray\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-gray\:50\:dark,html.var.auto .sf-c-gray\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-gray\:60\:dark,html.var.auto .sf-c-gray\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-gray\:70\:dark,html.var.auto .sf-c-gray\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-gray\:80\:dark,html.var.auto .sf-c-gray\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-gray\:90\:dark,html.var.auto .sf-c-gray\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-gray\:100\:dark,html.var.auto .sf-c-gray\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray,html.auto .sf-c-txt-gray{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:0,html.auto .sf-c-txt-gray\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray\:10,html.auto .sf-c-txt-gray\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-gray\:20,html.auto .sf-c-txt-gray\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-gray\:30,html.auto .sf-c-txt-gray\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-gray\:40,html.auto .sf-c-txt-gray\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-gray\:50,html.auto .sf-c-txt-gray\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:60,html.auto .sf-c-txt-gray\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-gray\:70,html.auto .sf-c-txt-gray\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-gray\:80,html.auto .sf-c-txt-gray\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-gray\:90,html.auto .sf-c-txt-gray\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-gray\:100,html.auto .sf-c-txt-gray\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-gray\:dark,html.auto .sf-c-txt-gray\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:0\:dark,html.auto .sf-c-txt-gray\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-gray\:10\:dark,html.auto .sf-c-txt-gray\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-gray\:20\:dark,html.auto .sf-c-txt-gray\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-gray\:30\:dark,html.auto .sf-c-txt-gray\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-gray\:40\:dark,html.auto .sf-c-txt-gray\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-gray\:50\:dark,html.auto .sf-c-txt-gray\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-gray\:60\:dark,html.auto .sf-c-txt-gray\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-gray\:70\:dark,html.auto .sf-c-txt-gray\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-gray\:80\:dark,html.auto .sf-c-txt-gray\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-gray\:90\:dark,html.auto .sf-c-txt-gray\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-gray\:100\:dark,html.auto .sf-c-txt-gray\:100\:dark{color:hsl(0,0%,100%)}}[class*='green']{--sf-c-green:120 100% 25%;--sf-c-green-0:120 100% 0%;--sf-c-green-10:120 100% 10%;--sf-c-green-20:120 100% 20%;--sf-c-green-30:120 100% 30%;--sf-c-green-40:120 100% 40%;--sf-c-green-50:120 100% 50%;--sf-c-green-60:120 100% 60%;--sf-c-green-70:120 100% 70%;--sf-c-green-80:120 100% 80%;--sf-c-green-90:120 100% 90%;--sf-c-green-100:120 100% 100%;--sf-c-txt-green:var(--sf-c-green);--sf-c-txt-green-0:var(--sf-c-green-0);--sf-c-txt-green-10:var(--sf-c-green-10);--sf-c-txt-green-20:var(--sf-c-green-20);--sf-c-txt-green-30:var(--sf-c-green-30);--sf-c-txt-green-40:var(--sf-c-green-40);--sf-c-txt-green-50:var(--sf-c-green-50);--sf-c-txt-green-60:var(--sf-c-green-60);--sf-c-txt-green-70:var(--sf-c-green-70);--sf-c-txt-green-80:var(--sf-c-green-80);--sf-c-txt-green-90:var(--sf-c-green-90);--sf-c-txt-green-100:var(--sf-c-green-100);--sf-dark-c-green:120 100% 75%;--sf-dark-c-green-0:120 100% 0%;--sf-dark-c-green-10:120 100% 10%;--sf-dark-c-green-20:120 100% 20%;--sf-dark-c-green-30:120 100% 30%;--sf-dark-c-green-40:120 100% 40%;--sf-dark-c-green-50:120 100% 50%;--sf-dark-c-green-60:120 100% 60%;--sf-dark-c-green-70:120 100% 70%;--sf-dark-c-green-80:120 100% 80%;--sf-dark-c-green-90:120 100% 90%;--sf-dark-c-green-100:120 100% 100%;--sf-dark-c-txt-green:var(--sf-dark-c-green);--sf-dark-c-txt-green-0:var(--sf-dark-c-green-0);--sf-dark-c-txt-green-10:var(--sf-dark-c-green-10);--sf-dark-c-txt-green-20:var(--sf-dark-c-green-20);--sf-dark-c-txt-green-30:var(--sf-dark-c-green-30);--sf-dark-c-txt-green-40:var(--sf-dark-c-green-40);--sf-dark-c-txt-green-50:var(--sf-dark-c-green-50);--sf-dark-c-txt-green-60:var(--sf-dark-c-green-60);--sf-dark-c-txt-green-70:var(--sf-dark-c-green-70);--sf-dark-c-txt-green-80:var(--sf-dark-c-green-80);--sf-dark-c-txt-green-90:var(--sf-dark-c-green-90);--sf-dark-c-txt-green-100:var(--sf-dark-c-green-100)}.sf-c-green{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green))}.sf-c-green\:0{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}.sf-c-green\:10{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}.sf-c-green\:20{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}.sf-c-green\:30{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-30))}.sf-c-green\:40{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-40))}.sf-c-green\:50{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}.sf-c-green\:60{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}.sf-c-green\:70{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}.sf-c-green\:80{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}.sf-c-green\:90{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}.sf-c-green\:100{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-100))}html.var .sf-c-green{color:hsl(120,100%,90%);background:hsl(120,100%,25%)}html.var .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-green\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-green\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-green\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-green\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-green\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-green\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-green\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-green{color:hsl(var(--sf-dark-c-txt-green))}.sf-c-txt-green\:0{color:hsl(var(--sf-dark-c-txt-green-100))}.sf-c-txt-green\:10{color:hsl(var(--sf-dark-c-txt-green-90))}.sf-c-txt-green\:20{color:hsl(var(--sf-dark-c-txt-green-80))}.sf-c-txt-green\:30{color:hsl(var(--sf-dark-c-txt-green-70))}.sf-c-txt-green\:40{color:hsl(var(--sf-dark-c-txt-green-60))}.sf-c-txt-green\:50{color:hsl(var(--sf-dark-c-txt-green-50))}.sf-c-txt-green\:60{color:hsl(var(--sf-dark-c-txt-green-40))}.sf-c-txt-green\:70{color:hsl(var(--sf-dark-c-txt-green-30))}.sf-c-txt-green\:80{color:hsl(var(--sf-dark-c-txt-green-20))}.sf-c-txt-green\:90{color:hsl(var(--sf-dark-c-txt-green-10))}.sf-c-txt-green\:100{color:hsl(var(--sf-dark-c-txt-green-0))}html.var .sf-c-txt-green{color:hsl(120,100%,75%)}html.var .sf-c-txt-green\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-green\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-green\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-green\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-green\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-green\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-green\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-green\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-green\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-green\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-green,html.dark .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='dark'] .sf-c-green\:0,html.dark .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='dark'] .sf-c-green\:10,html.dark .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='dark'] .sf-c-green\:20,html.dark .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='dark'] .sf-c-green\:30,html.dark .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='dark'] .sf-c-green\:40,html.dark .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='dark'] .sf-c-green\:50,html.dark .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='dark'] .sf-c-green\:60,html.dark .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='dark'] .sf-c-green\:70,html.dark .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='dark'] .sf-c-green\:80,html.dark .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='dark'] .sf-c-green\:90,html.dark .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='dark'] .sf-c-green\:100,html.dark .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='dark'] .sf-c-green\:dark,html.dark .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='dark'] .sf-c-green\:0\:dark,html.dark .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='dark'] .sf-c-green\:10\:dark,html.dark .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='dark'] .sf-c-green\:20\:dark,html.dark .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='dark'] .sf-c-green\:30\:dark,html.dark .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='dark'] .sf-c-green\:40\:dark,html.dark .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='dark'] .sf-c-green\:50\:dark,html.dark .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='dark'] .sf-c-green\:60\:dark,html.dark .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='dark'] .sf-c-green\:70\:dark,html.dark .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='dark'] .sf-c-green\:80\:dark,html.dark .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='dark'] .sf-c-green\:90\:dark,html.dark .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='dark'] .sf-c-green\:100\:dark,html.dark .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-dark-c-txt-green-0))}html[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-dark-c-txt-green-10))}html[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-dark-c-txt-green-20))}html[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-dark-c-txt-green-30))}html[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-dark-c-txt-green-40))}html[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-dark-c-txt-green-50))}html[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-dark-c-txt-green-60))}html[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-dark-c-txt-green-70))}html[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-dark-c-txt-green-80))}html[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-dark-c-txt-green-90))}html[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-dark-c-txt-green-100))}html.var[data-theme='dark'] .sf-c-green,html.var.dark .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0,html.var.dark .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10,html.var.dark .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20,html.var.dark .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30,html.var.dark .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40,html.var.dark .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50,html.var.dark .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60,html.var.dark .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70,html.var.dark .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80,html.var.dark .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90,html.var.dark .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100,html.var.dark .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-green\:dark,html.var.dark .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='dark'] .sf-c-green\:0\:dark,html.var.dark .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-green\:10\:dark,html.var.dark .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-green\:20\:dark,html.var.dark .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-green\:30\:dark,html.var.dark .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-green\:40\:dark,html.var.dark .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-green\:50\:dark,html.var.dark .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-green\:60\:dark,html.var.dark .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-green\:70\:dark,html.var.dark .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-green\:80\:dark,html.var.dark .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-green\:90\:dark,html.var.dark .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-green\:100\:dark,html.var.dark .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green,html.dark .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0,html.dark .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10,html.dark .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20,html.dark .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30,html.dark .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40,html.dark .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50,html.dark .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60,html.dark .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70,html.dark .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80,html.dark .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90,html.dark .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100,html.dark .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-green\:dark,html.dark .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-green\:0\:dark,html.dark .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-green\:10\:dark,html.dark .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-green\:20\:dark,html.dark .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-green\:30\:dark,html.dark .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-green\:40\:dark,html.dark .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-green\:50\:dark,html.dark .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-green\:60\:dark,html.dark .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-green\:70\:dark,html.dark .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-green\:80\:dark,html.dark .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-green\:90\:dark,html.dark .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-green\:100\:dark,html.dark .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-green,html.auto .sf-c-green{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green))}html[data-theme='auto'] .sf-c-green\:0,html.auto .sf-c-green\:0{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-100))}html[data-theme='auto'] .sf-c-green\:10,html.auto .sf-c-green\:10{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-90))}html[data-theme='auto'] .sf-c-green\:20,html.auto .sf-c-green\:20{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-80))}html[data-theme='auto'] .sf-c-green\:30,html.auto .sf-c-green\:30{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-70))}html[data-theme='auto'] .sf-c-green\:40,html.auto .sf-c-green\:40{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-60))}html[data-theme='auto'] .sf-c-green\:50,html.auto .sf-c-green\:50{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-50))}html[data-theme='auto'] .sf-c-green\:60,html.auto .sf-c-green\:60{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-40))}html[data-theme='auto'] .sf-c-green\:70,html.auto .sf-c-green\:70{color:hsl(var(--sf-dark-c-txt-green-10));background:hsl(var(--sf-dark-c-green-30))}html[data-theme='auto'] .sf-c-green\:80,html.auto .sf-c-green\:80{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-20))}html[data-theme='auto'] .sf-c-green\:90,html.auto .sf-c-green\:90{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-10))}html[data-theme='auto'] .sf-c-green\:100,html.auto .sf-c-green\:100{color:hsl(var(--sf-dark-c-txt-green-90));background:hsl(var(--sf-dark-c-green-0))}html[data-theme='auto'] .sf-c-green\:dark,html.auto .sf-c-green\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green))}html[data-theme='auto'] .sf-c-green\:0\:dark,html.auto .sf-c-green\:0\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-100))}html[data-theme='auto'] .sf-c-green\:10\:dark,html.auto .sf-c-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-90))}html[data-theme='auto'] .sf-c-green\:20\:dark,html.auto .sf-c-green\:20\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-80))}html[data-theme='auto'] .sf-c-green\:30\:dark,html.auto .sf-c-green\:30\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-70))}html[data-theme='auto'] .sf-c-green\:40\:dark,html.auto .sf-c-green\:40\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-60))}html[data-theme='auto'] .sf-c-green\:50\:dark,html.auto .sf-c-green\:50\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-50))}html[data-theme='auto'] .sf-c-green\:60\:dark,html.auto .sf-c-green\:60\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-40))}html[data-theme='auto'] .sf-c-green\:70\:dark,html.auto .sf-c-green\:70\:dark{color:hsl(var(--sf-c-txt-green-10));background:hsl(var(--sf-c-green-30))}html[data-theme='auto'] .sf-c-green\:80\:dark,html.auto .sf-c-green\:80\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-20))}html[data-theme='auto'] .sf-c-green\:90\:dark,html.auto .sf-c-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-10))}html[data-theme='auto'] .sf-c-green\:100\:dark,html.auto .sf-c-green\:100\:dark{color:hsl(var(--sf-c-txt-green-90));background:hsl(var(--sf-c-green-0))}html[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(var(--sf-c-txt-green-100))}html[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(var(--sf-c-txt-green))}html[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(var(--sf-c-txt-green-0))}html[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(var(--sf-c-txt-green-10))}html[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(var(--sf-c-txt-green-20))}html[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(var(--sf-c-txt-green-30))}html[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(var(--sf-c-txt-green-40))}html[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(var(--sf-c-txt-green-50))}html[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(var(--sf-c-txt-green-60))}html[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(var(--sf-c-txt-green-70))}html[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(var(--sf-c-txt-green-80))}html[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(var(--sf-c-txt-green-90))}html[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(var(--sf-c-txt-green-100))}html.var[data-theme='auto'] .sf-c-green,html.var.auto .sf-c-green{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0,html.var.auto .sf-c-green\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10,html.var.auto .sf-c-green\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20,html.var.auto .sf-c-green\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30,html.var.auto .sf-c-green\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40,html.var.auto .sf-c-green\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50,html.var.auto .sf-c-green\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60,html.var.auto .sf-c-green\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70,html.var.auto .sf-c-green\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80,html.var.auto .sf-c-green\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90,html.var.auto .sf-c-green\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100,html.var.auto .sf-c-green\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-green\:dark,html.var.auto .sf-c-green\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,75%)}html.var[data-theme='auto'] .sf-c-green\:0\:dark,html.var.auto .sf-c-green\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-green\:10\:dark,html.var.auto .sf-c-green\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-green\:20\:dark,html.var.auto .sf-c-green\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-green\:30\:dark,html.var.auto .sf-c-green\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-green\:40\:dark,html.var.auto .sf-c-green\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-green\:50\:dark,html.var.auto .sf-c-green\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-green\:60\:dark,html.var.auto .sf-c-green\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-green\:70\:dark,html.var.auto .sf-c-green\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-green\:80\:dark,html.var.auto .sf-c-green\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-green\:90\:dark,html.var.auto .sf-c-green\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-green\:100\:dark,html.var.auto .sf-c-green\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green,html.auto .sf-c-txt-green{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0,html.auto .sf-c-txt-green\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10,html.auto .sf-c-txt-green\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20,html.auto .sf-c-txt-green\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30,html.auto .sf-c-txt-green\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40,html.auto .sf-c-txt-green\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50,html.auto .sf-c-txt-green\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60,html.auto .sf-c-txt-green\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70,html.auto .sf-c-txt-green\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80,html.auto .sf-c-txt-green\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90,html.auto .sf-c-txt-green\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100,html.auto .sf-c-txt-green\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-green\:dark,html.auto .sf-c-txt-green\:dark{color:hsl(120,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-green\:0\:dark,html.auto .sf-c-txt-green\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-green\:10\:dark,html.auto .sf-c-txt-green\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-green\:20\:dark,html.auto .sf-c-txt-green\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-green\:30\:dark,html.auto .sf-c-txt-green\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-green\:40\:dark,html.auto .sf-c-txt-green\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-green\:50\:dark,html.auto .sf-c-txt-green\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-green\:60\:dark,html.auto .sf-c-txt-green\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-green\:70\:dark,html.auto .sf-c-txt-green\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-green\:80\:dark,html.auto .sf-c-txt-green\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-green\:90\:dark,html.auto .sf-c-txt-green\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-green\:100\:dark,html.auto .sf-c-txt-green\:100\:dark{color:hsl(120,100%,100%)}}[class*='lime']{--sf-c-lime:120 100% 50%;--sf-c-lime-0:120 100% 0%;--sf-c-lime-10:120 100% 10%;--sf-c-lime-20:120 100% 20%;--sf-c-lime-30:120 100% 30%;--sf-c-lime-40:120 100% 40%;--sf-c-lime-50:120 100% 50%;--sf-c-lime-60:120 100% 60%;--sf-c-lime-70:120 100% 70%;--sf-c-lime-80:120 100% 80%;--sf-c-lime-90:120 100% 90%;--sf-c-lime-100:120 100% 100%;--sf-c-txt-lime:var(--sf-c-lime);--sf-c-txt-lime-0:var(--sf-c-lime-0);--sf-c-txt-lime-10:var(--sf-c-lime-10);--sf-c-txt-lime-20:var(--sf-c-lime-20);--sf-c-txt-lime-30:var(--sf-c-lime-30);--sf-c-txt-lime-40:var(--sf-c-lime-40);--sf-c-txt-lime-50:var(--sf-c-lime-50);--sf-c-txt-lime-60:var(--sf-c-lime-60);--sf-c-txt-lime-70:var(--sf-c-lime-70);--sf-c-txt-lime-80:var(--sf-c-lime-80);--sf-c-txt-lime-90:var(--sf-c-lime-90);--sf-c-txt-lime-100:var(--sf-c-lime-100);--sf-dark-c-lime:120 100% 50%;--sf-dark-c-lime-0:120 100% 0%;--sf-dark-c-lime-10:120 100% 10%;--sf-dark-c-lime-20:120 100% 20%;--sf-dark-c-lime-30:120 100% 30%;--sf-dark-c-lime-40:120 100% 40%;--sf-dark-c-lime-50:120 100% 50%;--sf-dark-c-lime-60:120 100% 60%;--sf-dark-c-lime-70:120 100% 70%;--sf-dark-c-lime-80:120 100% 80%;--sf-dark-c-lime-90:120 100% 90%;--sf-dark-c-lime-100:120 100% 100%;--sf-dark-c-txt-lime:var(--sf-dark-c-lime);--sf-dark-c-txt-lime-0:var(--sf-dark-c-lime-0);--sf-dark-c-txt-lime-10:var(--sf-dark-c-lime-10);--sf-dark-c-txt-lime-20:var(--sf-dark-c-lime-20);--sf-dark-c-txt-lime-30:var(--sf-dark-c-lime-30);--sf-dark-c-txt-lime-40:var(--sf-dark-c-lime-40);--sf-dark-c-txt-lime-50:var(--sf-dark-c-lime-50);--sf-dark-c-txt-lime-60:var(--sf-dark-c-lime-60);--sf-dark-c-txt-lime-70:var(--sf-dark-c-lime-70);--sf-dark-c-txt-lime-80:var(--sf-dark-c-lime-80);--sf-dark-c-txt-lime-90:var(--sf-dark-c-lime-90);--sf-dark-c-txt-lime-100:var(--sf-dark-c-lime-100)}.sf-c-lime{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}.sf-c-lime\:0{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}.sf-c-lime\:10{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}.sf-c-lime\:20{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}.sf-c-lime\:30{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-30))}.sf-c-lime\:40{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-40))}.sf-c-lime\:50{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}.sf-c-lime\:60{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}.sf-c-lime\:70{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}.sf-c-lime\:80{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}.sf-c-lime\:90{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}.sf-c-lime\:100{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-100))}html.var .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var .sf-c-lime\:10{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var .sf-c-lime\:20{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var .sf-c-lime\:30{color:hsl(120,100%,90%);background:hsl(120,100%,30%)}html.var .sf-c-lime\:40{color:hsl(120,100%,90%);background:hsl(120,100%,40%)}html.var .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var .sf-c-lime\:80{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var .sf-c-lime\:90{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var .sf-c-lime\:100{color:hsl(120,100%,10%);background:hsl(120,100%,100%)}.sf-c-txt-lime{color:hsl(var(--sf-dark-c-txt-lime))}.sf-c-txt-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-100))}.sf-c-txt-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-90))}.sf-c-txt-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-80))}.sf-c-txt-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-70))}.sf-c-txt-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-60))}.sf-c-txt-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-50))}.sf-c-txt-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-40))}.sf-c-txt-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-30))}.sf-c-txt-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-20))}.sf-c-txt-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-10))}.sf-c-txt-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-0))}html.var .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var .sf-c-txt-lime\:0{color:hsl(120,100%,100%)}html.var .sf-c-txt-lime\:10{color:hsl(120,100%,90%)}html.var .sf-c-txt-lime\:20{color:hsl(120,100%,80%)}html.var .sf-c-txt-lime\:30{color:hsl(120,100%,70%)}html.var .sf-c-txt-lime\:40{color:hsl(120,100%,60%)}html.var .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var .sf-c-txt-lime\:60{color:hsl(120,100%,40%)}html.var .sf-c-txt-lime\:70{color:hsl(120,100%,30%)}html.var .sf-c-txt-lime\:80{color:hsl(120,100%,20%)}html.var .sf-c-txt-lime\:90{color:hsl(120,100%,10%)}html.var .sf-c-txt-lime\:100{color:hsl(120,100%,0%)}html[data-theme='dark'] .sf-c-lime,html.dark .sf-c-lime{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime))}html[data-theme='dark'] .sf-c-lime\:0,html.dark .sf-c-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-100))}html[data-theme='dark'] .sf-c-lime\:10,html.dark .sf-c-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-90))}html[data-theme='dark'] .sf-c-lime\:20,html.dark .sf-c-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-80))}html[data-theme='dark'] .sf-c-lime\:30,html.dark .sf-c-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-70))}html[data-theme='dark'] .sf-c-lime\:40,html.dark .sf-c-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-60))}html[data-theme='dark'] .sf-c-lime\:50,html.dark .sf-c-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-50))}html[data-theme='dark'] .sf-c-lime\:60,html.dark .sf-c-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-40))}html[data-theme='dark'] .sf-c-lime\:70,html.dark .sf-c-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-30))}html[data-theme='dark'] .sf-c-lime\:80,html.dark .sf-c-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-20))}html[data-theme='dark'] .sf-c-lime\:90,html.dark .sf-c-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-10))}html[data-theme='dark'] .sf-c-lime\:100,html.dark .sf-c-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-0))}html[data-theme='dark'] .sf-c-lime\:dark,html.dark .sf-c-lime\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}html[data-theme='dark'] .sf-c-lime\:0\:dark,html.dark .sf-c-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-100))}html[data-theme='dark'] .sf-c-lime\:10\:dark,html.dark .sf-c-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}html[data-theme='dark'] .sf-c-lime\:20\:dark,html.dark .sf-c-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}html[data-theme='dark'] .sf-c-lime\:30\:dark,html.dark .sf-c-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}html[data-theme='dark'] .sf-c-lime\:40\:dark,html.dark .sf-c-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}html[data-theme='dark'] .sf-c-lime\:50\:dark,html.dark .sf-c-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}html[data-theme='dark'] .sf-c-lime\:60\:dark,html.dark .sf-c-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-40))}html[data-theme='dark'] .sf-c-lime\:70\:dark,html.dark .sf-c-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-30))}html[data-theme='dark'] .sf-c-lime\:80\:dark,html.dark .sf-c-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}html[data-theme='dark'] .sf-c-lime\:90\:dark,html.dark .sf-c-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}html[data-theme='dark'] .sf-c-lime\:100\:dark,html.dark .sf-c-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}html[data-theme='dark'] .sf-c-txt-lime,html.dark .sf-c-txt-lime{color:hsl(var(--sf-c-txt-lime))}html[data-theme='dark'] .sf-c-txt-lime\:0,html.dark .sf-c-txt-lime\:0{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='dark'] .sf-c-txt-lime\:10,html.dark .sf-c-txt-lime\:10{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='dark'] .sf-c-txt-lime\:20,html.dark .sf-c-txt-lime\:20{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='dark'] .sf-c-txt-lime\:30,html.dark .sf-c-txt-lime\:30{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='dark'] .sf-c-txt-lime\:40,html.dark .sf-c-txt-lime\:40{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='dark'] .sf-c-txt-lime\:50,html.dark .sf-c-txt-lime\:50{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='dark'] .sf-c-txt-lime\:60,html.dark .sf-c-txt-lime\:60{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='dark'] .sf-c-txt-lime\:70,html.dark .sf-c-txt-lime\:70{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='dark'] .sf-c-txt-lime\:80,html.dark .sf-c-txt-lime\:80{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='dark'] .sf-c-txt-lime\:90,html.dark .sf-c-txt-lime\:90{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='dark'] .sf-c-txt-lime\:100,html.dark .sf-c-txt-lime\:100{color:hsl(var(--sf-c-txt-lime-100))}html[data-theme='dark'] .sf-c-txt-lime\:dark,html.dark .sf-c-txt-lime\:dark{color:hsl(var(--sf-c-txt-lime))}html[data-theme='dark'] .sf-c-txt-lime\:0\:dark,html.dark .sf-c-txt-lime\:0\:dark{color:hsl(var(--sf-dark-c-txt-lime-0))}html[data-theme='dark'] .sf-c-txt-lime\:10\:dark,html.dark .sf-c-txt-lime\:10\:dark{color:hsl(var(--sf-dark-c-txt-lime-10))}html[data-theme='dark'] .sf-c-txt-lime\:20\:dark,html.dark .sf-c-txt-lime\:20\:dark{color:hsl(var(--sf-dark-c-txt-lime-20))}html[data-theme='dark'] .sf-c-txt-lime\:30\:dark,html.dark .sf-c-txt-lime\:30\:dark{color:hsl(var(--sf-dark-c-txt-lime-30))}html[data-theme='dark'] .sf-c-txt-lime\:40\:dark,html.dark .sf-c-txt-lime\:40\:dark{color:hsl(var(--sf-dark-c-txt-lime-40))}html[data-theme='dark'] .sf-c-txt-lime\:50\:dark,html.dark .sf-c-txt-lime\:50\:dark{color:hsl(var(--sf-dark-c-txt-lime-50))}html[data-theme='dark'] .sf-c-txt-lime\:60\:dark,html.dark .sf-c-txt-lime\:60\:dark{color:hsl(var(--sf-dark-c-txt-lime-60))}html[data-theme='dark'] .sf-c-txt-lime\:70\:dark,html.dark .sf-c-txt-lime\:70\:dark{color:hsl(var(--sf-dark-c-txt-lime-70))}html[data-theme='dark'] .sf-c-txt-lime\:80\:dark,html.dark .sf-c-txt-lime\:80\:dark{color:hsl(var(--sf-dark-c-txt-lime-80))}html[data-theme='dark'] .sf-c-txt-lime\:90\:dark,html.dark .sf-c-txt-lime\:90\:dark{color:hsl(var(--sf-dark-c-txt-lime-90))}html[data-theme='dark'] .sf-c-txt-lime\:100\:dark,html.dark .sf-c-txt-lime\:100\:dark{color:hsl(var(--sf-dark-c-txt-lime-100))}html.var[data-theme='dark'] .sf-c-lime,html.var.dark .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:0,html.var.dark .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-lime\:10,html.var.dark .sf-c-lime\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-lime\:20,html.var.dark .sf-c-lime\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-lime\:30,html.var.dark .sf-c-lime\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-lime\:40,html.var.dark .sf-c-lime\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-lime\:50,html.var.dark .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:60,html.var.dark .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-lime\:70,html.var.dark .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-lime\:80,html.var.dark .sf-c-lime\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-lime\:90,html.var.dark .sf-c-lime\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-lime\:100,html.var.dark .sf-c-lime\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-lime\:dark,html.var.dark .sf-c-lime\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:0\:dark,html.var.dark .sf-c-lime\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-lime\:10\:dark,html.var.dark .sf-c-lime\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-lime\:20\:dark,html.var.dark .sf-c-lime\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-lime\:30\:dark,html.var.dark .sf-c-lime\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-lime\:40\:dark,html.var.dark .sf-c-lime\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-lime\:50\:dark,html.var.dark .sf-c-lime\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-lime\:60\:dark,html.var.dark .sf-c-lime\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-lime\:70\:dark,html.var.dark .sf-c-lime\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-lime\:80\:dark,html.var.dark .sf-c-lime\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-lime\:90\:dark,html.var.dark .sf-c-lime\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-lime\:100\:dark,html.var.dark .sf-c-lime\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime,html.dark .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:0,html.dark .sf-c-txt-lime\:0{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime\:10,html.dark .sf-c-txt-lime\:10{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-lime\:20,html.dark .sf-c-txt-lime\:20{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-lime\:30,html.dark .sf-c-txt-lime\:30{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-lime\:40,html.dark .sf-c-txt-lime\:40{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-lime\:50,html.dark .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:60,html.dark .sf-c-txt-lime\:60{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-lime\:70,html.dark .sf-c-txt-lime\:70{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-lime\:80,html.dark .sf-c-txt-lime\:80{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-lime\:90,html.dark .sf-c-txt-lime\:90{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-lime\:100,html.dark .sf-c-txt-lime\:100{color:hsl(120,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-lime\:dark,html.dark .sf-c-txt-lime\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:0\:dark,html.dark .sf-c-txt-lime\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-lime\:10\:dark,html.dark .sf-c-txt-lime\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-lime\:20\:dark,html.dark .sf-c-txt-lime\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-lime\:30\:dark,html.dark .sf-c-txt-lime\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-lime\:40\:dark,html.dark .sf-c-txt-lime\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-lime\:50\:dark,html.dark .sf-c-txt-lime\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-lime\:60\:dark,html.dark .sf-c-txt-lime\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-lime\:70\:dark,html.dark .sf-c-txt-lime\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-lime\:80\:dark,html.dark .sf-c-txt-lime\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-lime\:90\:dark,html.dark .sf-c-txt-lime\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-lime\:100\:dark,html.dark .sf-c-txt-lime\:100\:dark{color:hsl(120,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-lime,html.auto .sf-c-lime{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime))}html[data-theme='auto'] .sf-c-lime\:0,html.auto .sf-c-lime\:0{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-100))}html[data-theme='auto'] .sf-c-lime\:10,html.auto .sf-c-lime\:10{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-90))}html[data-theme='auto'] .sf-c-lime\:20,html.auto .sf-c-lime\:20{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-80))}html[data-theme='auto'] .sf-c-lime\:30,html.auto .sf-c-lime\:30{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-70))}html[data-theme='auto'] .sf-c-lime\:40,html.auto .sf-c-lime\:40{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-60))}html[data-theme='auto'] .sf-c-lime\:50,html.auto .sf-c-lime\:50{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-50))}html[data-theme='auto'] .sf-c-lime\:60,html.auto .sf-c-lime\:60{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-40))}html[data-theme='auto'] .sf-c-lime\:70,html.auto .sf-c-lime\:70{color:hsl(var(--sf-dark-c-txt-lime-10));background:hsl(var(--sf-dark-c-lime-30))}html[data-theme='auto'] .sf-c-lime\:80,html.auto .sf-c-lime\:80{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-20))}html[data-theme='auto'] .sf-c-lime\:90,html.auto .sf-c-lime\:90{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-10))}html[data-theme='auto'] .sf-c-lime\:100,html.auto .sf-c-lime\:100{color:hsl(var(--sf-dark-c-txt-lime-90));background:hsl(var(--sf-dark-c-lime-0))}html[data-theme='auto'] .sf-c-lime\:dark,html.auto .sf-c-lime\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime))}html[data-theme='auto'] .sf-c-lime\:0\:dark,html.auto .sf-c-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-100))}html[data-theme='auto'] .sf-c-lime\:10\:dark,html.auto .sf-c-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-90))}html[data-theme='auto'] .sf-c-lime\:20\:dark,html.auto .sf-c-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-80))}html[data-theme='auto'] .sf-c-lime\:30\:dark,html.auto .sf-c-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-70))}html[data-theme='auto'] .sf-c-lime\:40\:dark,html.auto .sf-c-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-60))}html[data-theme='auto'] .sf-c-lime\:50\:dark,html.auto .sf-c-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-50))}html[data-theme='auto'] .sf-c-lime\:60\:dark,html.auto .sf-c-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-40))}html[data-theme='auto'] .sf-c-lime\:70\:dark,html.auto .sf-c-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-10));background:hsl(var(--sf-c-lime-30))}html[data-theme='auto'] .sf-c-lime\:80\:dark,html.auto .sf-c-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-20))}html[data-theme='auto'] .sf-c-lime\:90\:dark,html.auto .sf-c-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-10))}html[data-theme='auto'] .sf-c-lime\:100\:dark,html.auto .sf-c-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-90));background:hsl(var(--sf-c-lime-0))}html[data-theme='auto'] .sf-c-txt-lime,html.auto .sf-c-txt-lime{color:hsl(var(--sf-c-txt-lime))}html[data-theme='auto'] .sf-c-txt-lime\:0,html.auto .sf-c-txt-lime\:0{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='auto'] .sf-c-txt-lime\:10,html.auto .sf-c-txt-lime\:10{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='auto'] .sf-c-txt-lime\:20,html.auto .sf-c-txt-lime\:20{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='auto'] .sf-c-txt-lime\:30,html.auto .sf-c-txt-lime\:30{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='auto'] .sf-c-txt-lime\:40,html.auto .sf-c-txt-lime\:40{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='auto'] .sf-c-txt-lime\:50,html.auto .sf-c-txt-lime\:50{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='auto'] .sf-c-txt-lime\:60,html.auto .sf-c-txt-lime\:60{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='auto'] .sf-c-txt-lime\:70,html.auto .sf-c-txt-lime\:70{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='auto'] .sf-c-txt-lime\:80,html.auto .sf-c-txt-lime\:80{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='auto'] .sf-c-txt-lime\:90,html.auto .sf-c-txt-lime\:90{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='auto'] .sf-c-txt-lime\:100,html.auto .sf-c-txt-lime\:100{color:hsl(var(--sf-c-txt-lime-100))}html[data-theme='auto'] .sf-c-txt-lime\:dark,html.auto .sf-c-txt-lime\:dark{color:hsl(var(--sf-c-txt-lime))}html[data-theme='auto'] .sf-c-txt-lime\:0\:dark,html.auto .sf-c-txt-lime\:0\:dark{color:hsl(var(--sf-c-txt-lime-0))}html[data-theme='auto'] .sf-c-txt-lime\:10\:dark,html.auto .sf-c-txt-lime\:10\:dark{color:hsl(var(--sf-c-txt-lime-10))}html[data-theme='auto'] .sf-c-txt-lime\:20\:dark,html.auto .sf-c-txt-lime\:20\:dark{color:hsl(var(--sf-c-txt-lime-20))}html[data-theme='auto'] .sf-c-txt-lime\:30\:dark,html.auto .sf-c-txt-lime\:30\:dark{color:hsl(var(--sf-c-txt-lime-30))}html[data-theme='auto'] .sf-c-txt-lime\:40\:dark,html.auto .sf-c-txt-lime\:40\:dark{color:hsl(var(--sf-c-txt-lime-40))}html[data-theme='auto'] .sf-c-txt-lime\:50\:dark,html.auto .sf-c-txt-lime\:50\:dark{color:hsl(var(--sf-c-txt-lime-50))}html[data-theme='auto'] .sf-c-txt-lime\:60\:dark,html.auto .sf-c-txt-lime\:60\:dark{color:hsl(var(--sf-c-txt-lime-60))}html[data-theme='auto'] .sf-c-txt-lime\:70\:dark,html.auto .sf-c-txt-lime\:70\:dark{color:hsl(var(--sf-c-txt-lime-70))}html[data-theme='auto'] .sf-c-txt-lime\:80\:dark,html.auto .sf-c-txt-lime\:80\:dark{color:hsl(var(--sf-c-txt-lime-80))}html[data-theme='auto'] .sf-c-txt-lime\:90\:dark,html.auto .sf-c-txt-lime\:90\:dark{color:hsl(var(--sf-c-txt-lime-90))}html[data-theme='auto'] .sf-c-txt-lime\:100\:dark,html.auto .sf-c-txt-lime\:100\:dark{color:hsl(var(--sf-c-txt-lime-100))}html.var[data-theme='auto'] .sf-c-lime,html.var.auto .sf-c-lime{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:0,html.var.auto .sf-c-lime\:0{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-lime\:10,html.var.auto .sf-c-lime\:10{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-lime\:20,html.var.auto .sf-c-lime\:20{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-lime\:30,html.var.auto .sf-c-lime\:30{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-lime\:40,html.var.auto .sf-c-lime\:40{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-lime\:50,html.var.auto .sf-c-lime\:50{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:60,html.var.auto .sf-c-lime\:60{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-lime\:70,html.var.auto .sf-c-lime\:70{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-lime\:80,html.var.auto .sf-c-lime\:80{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-lime\:90,html.var.auto .sf-c-lime\:90{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-lime\:100,html.var.auto .sf-c-lime\:100{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-lime\:dark,html.var.auto .sf-c-lime\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:0\:dark,html.var.auto .sf-c-lime\:0\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-lime\:10\:dark,html.var.auto .sf-c-lime\:10\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-lime\:20\:dark,html.var.auto .sf-c-lime\:20\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-lime\:30\:dark,html.var.auto .sf-c-lime\:30\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-lime\:40\:dark,html.var.auto .sf-c-lime\:40\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-lime\:50\:dark,html.var.auto .sf-c-lime\:50\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-lime\:60\:dark,html.var.auto .sf-c-lime\:60\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-lime\:70\:dark,html.var.auto .sf-c-lime\:70\:dark{color:hsl(120,100%,10%);background:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-lime\:80\:dark,html.var.auto .sf-c-lime\:80\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-lime\:90\:dark,html.var.auto .sf-c-lime\:90\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-lime\:100\:dark,html.var.auto .sf-c-lime\:100\:dark{color:hsl(120,100%,90%);background:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime,html.auto .sf-c-txt-lime{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:0,html.auto .sf-c-txt-lime\:0{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime\:10,html.auto .sf-c-txt-lime\:10{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-lime\:20,html.auto .sf-c-txt-lime\:20{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-lime\:30,html.auto .sf-c-txt-lime\:30{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-lime\:40,html.auto .sf-c-txt-lime\:40{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-lime\:50,html.auto .sf-c-txt-lime\:50{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:60,html.auto .sf-c-txt-lime\:60{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-lime\:70,html.auto .sf-c-txt-lime\:70{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-lime\:80,html.auto .sf-c-txt-lime\:80{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-lime\:90,html.auto .sf-c-txt-lime\:90{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-lime\:100,html.auto .sf-c-txt-lime\:100{color:hsl(120,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-lime\:dark,html.auto .sf-c-txt-lime\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:0\:dark,html.auto .sf-c-txt-lime\:0\:dark{color:hsl(120,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-lime\:10\:dark,html.auto .sf-c-txt-lime\:10\:dark{color:hsl(120,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-lime\:20\:dark,html.auto .sf-c-txt-lime\:20\:dark{color:hsl(120,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-lime\:30\:dark,html.auto .sf-c-txt-lime\:30\:dark{color:hsl(120,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-lime\:40\:dark,html.auto .sf-c-txt-lime\:40\:dark{color:hsl(120,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-lime\:50\:dark,html.auto .sf-c-txt-lime\:50\:dark{color:hsl(120,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-lime\:60\:dark,html.auto .sf-c-txt-lime\:60\:dark{color:hsl(120,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-lime\:70\:dark,html.auto .sf-c-txt-lime\:70\:dark{color:hsl(120,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-lime\:80\:dark,html.auto .sf-c-txt-lime\:80\:dark{color:hsl(120,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-lime\:90\:dark,html.auto .sf-c-txt-lime\:90\:dark{color:hsl(120,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-lime\:100\:dark,html.auto .sf-c-txt-lime\:100\:dark{color:hsl(120,100%,100%)}}[class*='maroon']{--sf-c-maroon:0 100% 25%;--sf-c-maroon-0:0 100% 0%;--sf-c-maroon-10:0 100% 10%;--sf-c-maroon-20:0 100% 20%;--sf-c-maroon-30:0 100% 30%;--sf-c-maroon-40:0 100% 40%;--sf-c-maroon-50:0 100% 50%;--sf-c-maroon-60:0 100% 60%;--sf-c-maroon-70:0 100% 70%;--sf-c-maroon-80:0 100% 80%;--sf-c-maroon-90:0 100% 90%;--sf-c-maroon-100:0 100% 100%;--sf-c-txt-maroon:var(--sf-c-maroon);--sf-c-txt-maroon-0:var(--sf-c-maroon-0);--sf-c-txt-maroon-10:var(--sf-c-maroon-10);--sf-c-txt-maroon-20:var(--sf-c-maroon-20);--sf-c-txt-maroon-30:var(--sf-c-maroon-30);--sf-c-txt-maroon-40:var(--sf-c-maroon-40);--sf-c-txt-maroon-50:var(--sf-c-maroon-50);--sf-c-txt-maroon-60:var(--sf-c-maroon-60);--sf-c-txt-maroon-70:var(--sf-c-maroon-70);--sf-c-txt-maroon-80:var(--sf-c-maroon-80);--sf-c-txt-maroon-90:var(--sf-c-maroon-90);--sf-c-txt-maroon-100:var(--sf-c-maroon-100);--sf-dark-c-maroon:0 100% 75%;--sf-dark-c-maroon-0:0 100% 0%;--sf-dark-c-maroon-10:0 100% 10%;--sf-dark-c-maroon-20:0 100% 20%;--sf-dark-c-maroon-30:0 100% 30%;--sf-dark-c-maroon-40:0 100% 40%;--sf-dark-c-maroon-50:0 100% 50%;--sf-dark-c-maroon-60:0 100% 60%;--sf-dark-c-maroon-70:0 100% 70%;--sf-dark-c-maroon-80:0 100% 80%;--sf-dark-c-maroon-90:0 100% 90%;--sf-dark-c-maroon-100:0 100% 100%;--sf-dark-c-txt-maroon:var(--sf-dark-c-maroon);--sf-dark-c-txt-maroon-0:var(--sf-dark-c-maroon-0);--sf-dark-c-txt-maroon-10:var(--sf-dark-c-maroon-10);--sf-dark-c-txt-maroon-20:var(--sf-dark-c-maroon-20);--sf-dark-c-txt-maroon-30:var(--sf-dark-c-maroon-30);--sf-dark-c-txt-maroon-40:var(--sf-dark-c-maroon-40);--sf-dark-c-txt-maroon-50:var(--sf-dark-c-maroon-50);--sf-dark-c-txt-maroon-60:var(--sf-dark-c-maroon-60);--sf-dark-c-txt-maroon-70:var(--sf-dark-c-maroon-70);--sf-dark-c-txt-maroon-80:var(--sf-dark-c-maroon-80);--sf-dark-c-txt-maroon-90:var(--sf-dark-c-maroon-90);--sf-dark-c-txt-maroon-100:var(--sf-dark-c-maroon-100)}.sf-c-maroon{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon))}.sf-c-maroon\:0{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}.sf-c-maroon\:10{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}.sf-c-maroon\:20{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}.sf-c-maroon\:30{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}.sf-c-maroon\:40{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}.sf-c-maroon\:50{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}.sf-c-maroon\:60{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-60))}.sf-c-maroon\:70{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-70))}.sf-c-maroon\:80{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}.sf-c-maroon\:90{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}.sf-c-maroon\:100{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-100))}html.var .sf-c-maroon{color:hsl(0,100%,90%);background:hsl(0,100%,25%)}html.var .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-maroon\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-maroon\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-maroon\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-maroon\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-maroon\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-maroon\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-maroon\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-maroon{color:hsl(var(--sf-dark-c-txt-maroon))}.sf-c-txt-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-100))}.sf-c-txt-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-90))}.sf-c-txt-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-80))}.sf-c-txt-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-70))}.sf-c-txt-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-60))}.sf-c-txt-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-50))}.sf-c-txt-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-40))}.sf-c-txt-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-30))}.sf-c-txt-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-20))}.sf-c-txt-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-10))}.sf-c-txt-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-0))}html.var .sf-c-txt-maroon{color:hsl(0,100%,75%)}html.var .sf-c-txt-maroon\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-maroon\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-maroon\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-maroon\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-maroon\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-maroon\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-maroon\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-maroon\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-maroon\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-maroon\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-maroon,html.dark .sf-c-maroon{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon))}html[data-theme='dark'] .sf-c-maroon\:0,html.dark .sf-c-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-100))}html[data-theme='dark'] .sf-c-maroon\:10,html.dark .sf-c-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-90))}html[data-theme='dark'] .sf-c-maroon\:20,html.dark .sf-c-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-80))}html[data-theme='dark'] .sf-c-maroon\:30,html.dark .sf-c-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-70))}html[data-theme='dark'] .sf-c-maroon\:40,html.dark .sf-c-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-60))}html[data-theme='dark'] .sf-c-maroon\:50,html.dark .sf-c-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-50))}html[data-theme='dark'] .sf-c-maroon\:60,html.dark .sf-c-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-40))}html[data-theme='dark'] .sf-c-maroon\:70,html.dark .sf-c-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-30))}html[data-theme='dark'] .sf-c-maroon\:80,html.dark .sf-c-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-20))}html[data-theme='dark'] .sf-c-maroon\:90,html.dark .sf-c-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-10))}html[data-theme='dark'] .sf-c-maroon\:100,html.dark .sf-c-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-0))}html[data-theme='dark'] .sf-c-maroon\:dark,html.dark .sf-c-maroon\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon))}html[data-theme='dark'] .sf-c-maroon\:0\:dark,html.dark .sf-c-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-100))}html[data-theme='dark'] .sf-c-maroon\:10\:dark,html.dark .sf-c-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}html[data-theme='dark'] .sf-c-maroon\:20\:dark,html.dark .sf-c-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}html[data-theme='dark'] .sf-c-maroon\:30\:dark,html.dark .sf-c-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-70))}html[data-theme='dark'] .sf-c-maroon\:40\:dark,html.dark .sf-c-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-60))}html[data-theme='dark'] .sf-c-maroon\:50\:dark,html.dark .sf-c-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}html[data-theme='dark'] .sf-c-maroon\:60\:dark,html.dark .sf-c-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}html[data-theme='dark'] .sf-c-maroon\:70\:dark,html.dark .sf-c-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}html[data-theme='dark'] .sf-c-maroon\:80\:dark,html.dark .sf-c-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}html[data-theme='dark'] .sf-c-maroon\:90\:dark,html.dark .sf-c-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}html[data-theme='dark'] .sf-c-maroon\:100\:dark,html.dark .sf-c-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon,html.dark .sf-c-txt-maroon{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='dark'] .sf-c-txt-maroon\:0,html.dark .sf-c-txt-maroon\:0{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon\:10,html.dark .sf-c-txt-maroon\:10{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='dark'] .sf-c-txt-maroon\:20,html.dark .sf-c-txt-maroon\:20{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='dark'] .sf-c-txt-maroon\:30,html.dark .sf-c-txt-maroon\:30{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='dark'] .sf-c-txt-maroon\:40,html.dark .sf-c-txt-maroon\:40{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='dark'] .sf-c-txt-maroon\:50,html.dark .sf-c-txt-maroon\:50{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='dark'] .sf-c-txt-maroon\:60,html.dark .sf-c-txt-maroon\:60{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='dark'] .sf-c-txt-maroon\:70,html.dark .sf-c-txt-maroon\:70{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='dark'] .sf-c-txt-maroon\:80,html.dark .sf-c-txt-maroon\:80{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='dark'] .sf-c-txt-maroon\:90,html.dark .sf-c-txt-maroon\:90{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='dark'] .sf-c-txt-maroon\:100,html.dark .sf-c-txt-maroon\:100{color:hsl(var(--sf-c-txt-maroon-100))}html[data-theme='dark'] .sf-c-txt-maroon\:dark,html.dark .sf-c-txt-maroon\:dark{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='dark'] .sf-c-txt-maroon\:0\:dark,html.dark .sf-c-txt-maroon\:0\:dark{color:hsl(var(--sf-dark-c-txt-maroon-0))}html[data-theme='dark'] .sf-c-txt-maroon\:10\:dark,html.dark .sf-c-txt-maroon\:10\:dark{color:hsl(var(--sf-dark-c-txt-maroon-10))}html[data-theme='dark'] .sf-c-txt-maroon\:20\:dark,html.dark .sf-c-txt-maroon\:20\:dark{color:hsl(var(--sf-dark-c-txt-maroon-20))}html[data-theme='dark'] .sf-c-txt-maroon\:30\:dark,html.dark .sf-c-txt-maroon\:30\:dark{color:hsl(var(--sf-dark-c-txt-maroon-30))}html[data-theme='dark'] .sf-c-txt-maroon\:40\:dark,html.dark .sf-c-txt-maroon\:40\:dark{color:hsl(var(--sf-dark-c-txt-maroon-40))}html[data-theme='dark'] .sf-c-txt-maroon\:50\:dark,html.dark .sf-c-txt-maroon\:50\:dark{color:hsl(var(--sf-dark-c-txt-maroon-50))}html[data-theme='dark'] .sf-c-txt-maroon\:60\:dark,html.dark .sf-c-txt-maroon\:60\:dark{color:hsl(var(--sf-dark-c-txt-maroon-60))}html[data-theme='dark'] .sf-c-txt-maroon\:70\:dark,html.dark .sf-c-txt-maroon\:70\:dark{color:hsl(var(--sf-dark-c-txt-maroon-70))}html[data-theme='dark'] .sf-c-txt-maroon\:80\:dark,html.dark .sf-c-txt-maroon\:80\:dark{color:hsl(var(--sf-dark-c-txt-maroon-80))}html[data-theme='dark'] .sf-c-txt-maroon\:90\:dark,html.dark .sf-c-txt-maroon\:90\:dark{color:hsl(var(--sf-dark-c-txt-maroon-90))}html[data-theme='dark'] .sf-c-txt-maroon\:100\:dark,html.dark .sf-c-txt-maroon\:100\:dark{color:hsl(var(--sf-dark-c-txt-maroon-100))}html.var[data-theme='dark'] .sf-c-maroon,html.var.dark .sf-c-maroon{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='dark'] .sf-c-maroon\:0,html.var.dark .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-maroon\:10,html.var.dark .sf-c-maroon\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-maroon\:20,html.var.dark .sf-c-maroon\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-maroon\:30,html.var.dark .sf-c-maroon\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-maroon\:40,html.var.dark .sf-c-maroon\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-maroon\:50,html.var.dark .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-maroon\:60,html.var.dark .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-maroon\:70,html.var.dark .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-maroon\:80,html.var.dark .sf-c-maroon\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-maroon\:90,html.var.dark .sf-c-maroon\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-maroon\:100,html.var.dark .sf-c-maroon\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-maroon\:dark,html.var.dark .sf-c-maroon\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='dark'] .sf-c-maroon\:0\:dark,html.var.dark .sf-c-maroon\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-maroon\:10\:dark,html.var.dark .sf-c-maroon\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-maroon\:20\:dark,html.var.dark .sf-c-maroon\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-maroon\:30\:dark,html.var.dark .sf-c-maroon\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-maroon\:40\:dark,html.var.dark .sf-c-maroon\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-maroon\:50\:dark,html.var.dark .sf-c-maroon\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-maroon\:60\:dark,html.var.dark .sf-c-maroon\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-maroon\:70\:dark,html.var.dark .sf-c-maroon\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-maroon\:80\:dark,html.var.dark .sf-c-maroon\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-maroon\:90\:dark,html.var.dark .sf-c-maroon\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-maroon\:100\:dark,html.var.dark .sf-c-maroon\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon,html.dark .sf-c-txt-maroon{color:hsl(0,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:0,html.dark .sf-c-txt-maroon\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:10,html.dark .sf-c-txt-maroon\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:20,html.dark .sf-c-txt-maroon\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:30,html.dark .sf-c-txt-maroon\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:40,html.dark .sf-c-txt-maroon\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:50,html.dark .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:60,html.dark .sf-c-txt-maroon\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:70,html.dark .sf-c-txt-maroon\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:80,html.dark .sf-c-txt-maroon\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:90,html.dark .sf-c-txt-maroon\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:100,html.dark .sf-c-txt-maroon\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:dark,html.dark .sf-c-txt-maroon\:dark{color:hsl(0,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:0\:dark,html.dark .sf-c-txt-maroon\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:10\:dark,html.dark .sf-c-txt-maroon\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:20\:dark,html.dark .sf-c-txt-maroon\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:30\:dark,html.dark .sf-c-txt-maroon\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:40\:dark,html.dark .sf-c-txt-maroon\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:50\:dark,html.dark .sf-c-txt-maroon\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:60\:dark,html.dark .sf-c-txt-maroon\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:70\:dark,html.dark .sf-c-txt-maroon\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:80\:dark,html.dark .sf-c-txt-maroon\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:90\:dark,html.dark .sf-c-txt-maroon\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-maroon\:100\:dark,html.dark .sf-c-txt-maroon\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-maroon,html.auto .sf-c-maroon{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon))}html[data-theme='auto'] .sf-c-maroon\:0,html.auto .sf-c-maroon\:0{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-100))}html[data-theme='auto'] .sf-c-maroon\:10,html.auto .sf-c-maroon\:10{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-90))}html[data-theme='auto'] .sf-c-maroon\:20,html.auto .sf-c-maroon\:20{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-80))}html[data-theme='auto'] .sf-c-maroon\:30,html.auto .sf-c-maroon\:30{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-70))}html[data-theme='auto'] .sf-c-maroon\:40,html.auto .sf-c-maroon\:40{color:hsl(var(--sf-dark-c-txt-maroon-10));background:hsl(var(--sf-dark-c-maroon-60))}html[data-theme='auto'] .sf-c-maroon\:50,html.auto .sf-c-maroon\:50{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-50))}html[data-theme='auto'] .sf-c-maroon\:60,html.auto .sf-c-maroon\:60{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-40))}html[data-theme='auto'] .sf-c-maroon\:70,html.auto .sf-c-maroon\:70{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-30))}html[data-theme='auto'] .sf-c-maroon\:80,html.auto .sf-c-maroon\:80{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-20))}html[data-theme='auto'] .sf-c-maroon\:90,html.auto .sf-c-maroon\:90{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-10))}html[data-theme='auto'] .sf-c-maroon\:100,html.auto .sf-c-maroon\:100{color:hsl(var(--sf-dark-c-txt-maroon-90));background:hsl(var(--sf-dark-c-maroon-0))}html[data-theme='auto'] .sf-c-maroon\:dark,html.auto .sf-c-maroon\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon))}html[data-theme='auto'] .sf-c-maroon\:0\:dark,html.auto .sf-c-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-100))}html[data-theme='auto'] .sf-c-maroon\:10\:dark,html.auto .sf-c-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-90))}html[data-theme='auto'] .sf-c-maroon\:20\:dark,html.auto .sf-c-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-80))}html[data-theme='auto'] .sf-c-maroon\:30\:dark,html.auto .sf-c-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-70))}html[data-theme='auto'] .sf-c-maroon\:40\:dark,html.auto .sf-c-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-10));background:hsl(var(--sf-c-maroon-60))}html[data-theme='auto'] .sf-c-maroon\:50\:dark,html.auto .sf-c-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-50))}html[data-theme='auto'] .sf-c-maroon\:60\:dark,html.auto .sf-c-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-40))}html[data-theme='auto'] .sf-c-maroon\:70\:dark,html.auto .sf-c-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-30))}html[data-theme='auto'] .sf-c-maroon\:80\:dark,html.auto .sf-c-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-20))}html[data-theme='auto'] .sf-c-maroon\:90\:dark,html.auto .sf-c-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-10))}html[data-theme='auto'] .sf-c-maroon\:100\:dark,html.auto .sf-c-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-90));background:hsl(var(--sf-c-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon,html.auto .sf-c-txt-maroon{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='auto'] .sf-c-txt-maroon\:0,html.auto .sf-c-txt-maroon\:0{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon\:10,html.auto .sf-c-txt-maroon\:10{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='auto'] .sf-c-txt-maroon\:20,html.auto .sf-c-txt-maroon\:20{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='auto'] .sf-c-txt-maroon\:30,html.auto .sf-c-txt-maroon\:30{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='auto'] .sf-c-txt-maroon\:40,html.auto .sf-c-txt-maroon\:40{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='auto'] .sf-c-txt-maroon\:50,html.auto .sf-c-txt-maroon\:50{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='auto'] .sf-c-txt-maroon\:60,html.auto .sf-c-txt-maroon\:60{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='auto'] .sf-c-txt-maroon\:70,html.auto .sf-c-txt-maroon\:70{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='auto'] .sf-c-txt-maroon\:80,html.auto .sf-c-txt-maroon\:80{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='auto'] .sf-c-txt-maroon\:90,html.auto .sf-c-txt-maroon\:90{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='auto'] .sf-c-txt-maroon\:100,html.auto .sf-c-txt-maroon\:100{color:hsl(var(--sf-c-txt-maroon-100))}html[data-theme='auto'] .sf-c-txt-maroon\:dark,html.auto .sf-c-txt-maroon\:dark{color:hsl(var(--sf-c-txt-maroon))}html[data-theme='auto'] .sf-c-txt-maroon\:0\:dark,html.auto .sf-c-txt-maroon\:0\:dark{color:hsl(var(--sf-c-txt-maroon-0))}html[data-theme='auto'] .sf-c-txt-maroon\:10\:dark,html.auto .sf-c-txt-maroon\:10\:dark{color:hsl(var(--sf-c-txt-maroon-10))}html[data-theme='auto'] .sf-c-txt-maroon\:20\:dark,html.auto .sf-c-txt-maroon\:20\:dark{color:hsl(var(--sf-c-txt-maroon-20))}html[data-theme='auto'] .sf-c-txt-maroon\:30\:dark,html.auto .sf-c-txt-maroon\:30\:dark{color:hsl(var(--sf-c-txt-maroon-30))}html[data-theme='auto'] .sf-c-txt-maroon\:40\:dark,html.auto .sf-c-txt-maroon\:40\:dark{color:hsl(var(--sf-c-txt-maroon-40))}html[data-theme='auto'] .sf-c-txt-maroon\:50\:dark,html.auto .sf-c-txt-maroon\:50\:dark{color:hsl(var(--sf-c-txt-maroon-50))}html[data-theme='auto'] .sf-c-txt-maroon\:60\:dark,html.auto .sf-c-txt-maroon\:60\:dark{color:hsl(var(--sf-c-txt-maroon-60))}html[data-theme='auto'] .sf-c-txt-maroon\:70\:dark,html.auto .sf-c-txt-maroon\:70\:dark{color:hsl(var(--sf-c-txt-maroon-70))}html[data-theme='auto'] .sf-c-txt-maroon\:80\:dark,html.auto .sf-c-txt-maroon\:80\:dark{color:hsl(var(--sf-c-txt-maroon-80))}html[data-theme='auto'] .sf-c-txt-maroon\:90\:dark,html.auto .sf-c-txt-maroon\:90\:dark{color:hsl(var(--sf-c-txt-maroon-90))}html[data-theme='auto'] .sf-c-txt-maroon\:100\:dark,html.auto .sf-c-txt-maroon\:100\:dark{color:hsl(var(--sf-c-txt-maroon-100))}html.var[data-theme='auto'] .sf-c-maroon,html.var.auto .sf-c-maroon{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='auto'] .sf-c-maroon\:0,html.var.auto .sf-c-maroon\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-maroon\:10,html.var.auto .sf-c-maroon\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-maroon\:20,html.var.auto .sf-c-maroon\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-maroon\:30,html.var.auto .sf-c-maroon\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-maroon\:40,html.var.auto .sf-c-maroon\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-maroon\:50,html.var.auto .sf-c-maroon\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-maroon\:60,html.var.auto .sf-c-maroon\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-maroon\:70,html.var.auto .sf-c-maroon\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-maroon\:80,html.var.auto .sf-c-maroon\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-maroon\:90,html.var.auto .sf-c-maroon\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-maroon\:100,html.var.auto .sf-c-maroon\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-maroon\:dark,html.var.auto .sf-c-maroon\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,75%)}html.var[data-theme='auto'] .sf-c-maroon\:0\:dark,html.var.auto .sf-c-maroon\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-maroon\:10\:dark,html.var.auto .sf-c-maroon\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-maroon\:20\:dark,html.var.auto .sf-c-maroon\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-maroon\:30\:dark,html.var.auto .sf-c-maroon\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-maroon\:40\:dark,html.var.auto .sf-c-maroon\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-maroon\:50\:dark,html.var.auto .sf-c-maroon\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-maroon\:60\:dark,html.var.auto .sf-c-maroon\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-maroon\:70\:dark,html.var.auto .sf-c-maroon\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-maroon\:80\:dark,html.var.auto .sf-c-maroon\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-maroon\:90\:dark,html.var.auto .sf-c-maroon\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-maroon\:100\:dark,html.var.auto .sf-c-maroon\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon,html.auto .sf-c-txt-maroon{color:hsl(0,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:0,html.auto .sf-c-txt-maroon\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:10,html.auto .sf-c-txt-maroon\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:20,html.auto .sf-c-txt-maroon\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:30,html.auto .sf-c-txt-maroon\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:40,html.auto .sf-c-txt-maroon\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:50,html.auto .sf-c-txt-maroon\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:60,html.auto .sf-c-txt-maroon\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:70,html.auto .sf-c-txt-maroon\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:80,html.auto .sf-c-txt-maroon\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:90,html.auto .sf-c-txt-maroon\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:100,html.auto .sf-c-txt-maroon\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:dark,html.auto .sf-c-txt-maroon\:dark{color:hsl(0,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:0\:dark,html.auto .sf-c-txt-maroon\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:10\:dark,html.auto .sf-c-txt-maroon\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:20\:dark,html.auto .sf-c-txt-maroon\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:30\:dark,html.auto .sf-c-txt-maroon\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:40\:dark,html.auto .sf-c-txt-maroon\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:50\:dark,html.auto .sf-c-txt-maroon\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:60\:dark,html.auto .sf-c-txt-maroon\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:70\:dark,html.auto .sf-c-txt-maroon\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:80\:dark,html.auto .sf-c-txt-maroon\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:90\:dark,html.auto .sf-c-txt-maroon\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-maroon\:100\:dark,html.auto .sf-c-txt-maroon\:100\:dark{color:hsl(0,100%,100%)}}[class*='navy']{--sf-c-navy:240 100% 25%;--sf-c-navy-0:240 100% 0%;--sf-c-navy-10:240 100% 10%;--sf-c-navy-20:240 100% 20%;--sf-c-navy-30:240 100% 30%;--sf-c-navy-40:240 100% 40%;--sf-c-navy-50:240 100% 50%;--sf-c-navy-60:240 100% 60%;--sf-c-navy-70:240 100% 70%;--sf-c-navy-80:240 100% 80%;--sf-c-navy-90:240 100% 90%;--sf-c-navy-100:240 100% 100%;--sf-c-txt-navy:var(--sf-c-navy);--sf-c-txt-navy-0:var(--sf-c-navy-0);--sf-c-txt-navy-10:var(--sf-c-navy-10);--sf-c-txt-navy-20:var(--sf-c-navy-20);--sf-c-txt-navy-30:var(--sf-c-navy-30);--sf-c-txt-navy-40:var(--sf-c-navy-40);--sf-c-txt-navy-50:var(--sf-c-navy-50);--sf-c-txt-navy-60:var(--sf-c-navy-60);--sf-c-txt-navy-70:var(--sf-c-navy-70);--sf-c-txt-navy-80:var(--sf-c-navy-80);--sf-c-txt-navy-90:var(--sf-c-navy-90);--sf-c-txt-navy-100:var(--sf-c-navy-100);--sf-dark-c-navy:240 100% 75%;--sf-dark-c-navy-0:240 100% 0%;--sf-dark-c-navy-10:240 100% 10%;--sf-dark-c-navy-20:240 100% 20%;--sf-dark-c-navy-30:240 100% 30%;--sf-dark-c-navy-40:240 100% 40%;--sf-dark-c-navy-50:240 100% 50%;--sf-dark-c-navy-60:240 100% 60%;--sf-dark-c-navy-70:240 100% 70%;--sf-dark-c-navy-80:240 100% 80%;--sf-dark-c-navy-90:240 100% 90%;--sf-dark-c-navy-100:240 100% 100%;--sf-dark-c-txt-navy:var(--sf-dark-c-navy);--sf-dark-c-txt-navy-0:var(--sf-dark-c-navy-0);--sf-dark-c-txt-navy-10:var(--sf-dark-c-navy-10);--sf-dark-c-txt-navy-20:var(--sf-dark-c-navy-20);--sf-dark-c-txt-navy-30:var(--sf-dark-c-navy-30);--sf-dark-c-txt-navy-40:var(--sf-dark-c-navy-40);--sf-dark-c-txt-navy-50:var(--sf-dark-c-navy-50);--sf-dark-c-txt-navy-60:var(--sf-dark-c-navy-60);--sf-dark-c-txt-navy-70:var(--sf-dark-c-navy-70);--sf-dark-c-txt-navy-80:var(--sf-dark-c-navy-80);--sf-dark-c-txt-navy-90:var(--sf-dark-c-navy-90);--sf-dark-c-txt-navy-100:var(--sf-dark-c-navy-100)}.sf-c-navy{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}.sf-c-navy\:0{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}.sf-c-navy\:10{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}.sf-c-navy\:20{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}.sf-c-navy\:30{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}.sf-c-navy\:40{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}.sf-c-navy\:50{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}.sf-c-navy\:60{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}.sf-c-navy\:70{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-70))}.sf-c-navy\:80{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-80))}.sf-c-navy\:90{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}.sf-c-navy\:100{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-100))}html.var .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,25%)}html.var .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var .sf-c-navy\:10{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var .sf-c-navy\:20{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var .sf-c-navy\:30{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,70%)}html.var .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,80%)}html.var .sf-c-navy\:90{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var .sf-c-navy\:100{color:hsl(240,100%,10%);background:hsl(240,100%,100%)}.sf-c-txt-navy{color:hsl(var(--sf-dark-c-txt-navy))}.sf-c-txt-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-100))}.sf-c-txt-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-90))}.sf-c-txt-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-80))}.sf-c-txt-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-70))}.sf-c-txt-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-60))}.sf-c-txt-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-50))}.sf-c-txt-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-40))}.sf-c-txt-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-30))}.sf-c-txt-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-20))}.sf-c-txt-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-10))}.sf-c-txt-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-0))}html.var .sf-c-txt-navy{color:hsl(240,100%,75%)}html.var .sf-c-txt-navy\:0{color:hsl(240,100%,100%)}html.var .sf-c-txt-navy\:10{color:hsl(240,100%,90%)}html.var .sf-c-txt-navy\:20{color:hsl(240,100%,80%)}html.var .sf-c-txt-navy\:30{color:hsl(240,100%,70%)}html.var .sf-c-txt-navy\:40{color:hsl(240,100%,60%)}html.var .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var .sf-c-txt-navy\:60{color:hsl(240,100%,40%)}html.var .sf-c-txt-navy\:70{color:hsl(240,100%,30%)}html.var .sf-c-txt-navy\:80{color:hsl(240,100%,20%)}html.var .sf-c-txt-navy\:90{color:hsl(240,100%,10%)}html.var .sf-c-txt-navy\:100{color:hsl(240,100%,0%)}html[data-theme='dark'] .sf-c-navy,html.dark .sf-c-navy{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy))}html[data-theme='dark'] .sf-c-navy\:0,html.dark .sf-c-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-100))}html[data-theme='dark'] .sf-c-navy\:10,html.dark .sf-c-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-90))}html[data-theme='dark'] .sf-c-navy\:20,html.dark .sf-c-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-80))}html[data-theme='dark'] .sf-c-navy\:30,html.dark .sf-c-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-70))}html[data-theme='dark'] .sf-c-navy\:40,html.dark .sf-c-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-60))}html[data-theme='dark'] .sf-c-navy\:50,html.dark .sf-c-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-50))}html[data-theme='dark'] .sf-c-navy\:60,html.dark .sf-c-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-40))}html[data-theme='dark'] .sf-c-navy\:70,html.dark .sf-c-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-30))}html[data-theme='dark'] .sf-c-navy\:80,html.dark .sf-c-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-20))}html[data-theme='dark'] .sf-c-navy\:90,html.dark .sf-c-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-10))}html[data-theme='dark'] .sf-c-navy\:100,html.dark .sf-c-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-0))}html[data-theme='dark'] .sf-c-navy\:dark,html.dark .sf-c-navy\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}html[data-theme='dark'] .sf-c-navy\:0\:dark,html.dark .sf-c-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-100))}html[data-theme='dark'] .sf-c-navy\:10\:dark,html.dark .sf-c-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}html[data-theme='dark'] .sf-c-navy\:20\:dark,html.dark .sf-c-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-80))}html[data-theme='dark'] .sf-c-navy\:30\:dark,html.dark .sf-c-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-70))}html[data-theme='dark'] .sf-c-navy\:40\:dark,html.dark .sf-c-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}html[data-theme='dark'] .sf-c-navy\:50\:dark,html.dark .sf-c-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}html[data-theme='dark'] .sf-c-navy\:60\:dark,html.dark .sf-c-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}html[data-theme='dark'] .sf-c-navy\:70\:dark,html.dark .sf-c-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}html[data-theme='dark'] .sf-c-navy\:80\:dark,html.dark .sf-c-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}html[data-theme='dark'] .sf-c-navy\:90\:dark,html.dark .sf-c-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}html[data-theme='dark'] .sf-c-navy\:100\:dark,html.dark .sf-c-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}html[data-theme='dark'] .sf-c-txt-navy,html.dark .sf-c-txt-navy{color:hsl(var(--sf-c-txt-navy))}html[data-theme='dark'] .sf-c-txt-navy\:0,html.dark .sf-c-txt-navy\:0{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='dark'] .sf-c-txt-navy\:10,html.dark .sf-c-txt-navy\:10{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='dark'] .sf-c-txt-navy\:20,html.dark .sf-c-txt-navy\:20{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='dark'] .sf-c-txt-navy\:30,html.dark .sf-c-txt-navy\:30{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='dark'] .sf-c-txt-navy\:40,html.dark .sf-c-txt-navy\:40{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='dark'] .sf-c-txt-navy\:50,html.dark .sf-c-txt-navy\:50{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='dark'] .sf-c-txt-navy\:60,html.dark .sf-c-txt-navy\:60{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='dark'] .sf-c-txt-navy\:70,html.dark .sf-c-txt-navy\:70{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='dark'] .sf-c-txt-navy\:80,html.dark .sf-c-txt-navy\:80{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='dark'] .sf-c-txt-navy\:90,html.dark .sf-c-txt-navy\:90{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='dark'] .sf-c-txt-navy\:100,html.dark .sf-c-txt-navy\:100{color:hsl(var(--sf-c-txt-navy-100))}html[data-theme='dark'] .sf-c-txt-navy\:dark,html.dark .sf-c-txt-navy\:dark{color:hsl(var(--sf-c-txt-navy))}html[data-theme='dark'] .sf-c-txt-navy\:0\:dark,html.dark .sf-c-txt-navy\:0\:dark{color:hsl(var(--sf-dark-c-txt-navy-0))}html[data-theme='dark'] .sf-c-txt-navy\:10\:dark,html.dark .sf-c-txt-navy\:10\:dark{color:hsl(var(--sf-dark-c-txt-navy-10))}html[data-theme='dark'] .sf-c-txt-navy\:20\:dark,html.dark .sf-c-txt-navy\:20\:dark{color:hsl(var(--sf-dark-c-txt-navy-20))}html[data-theme='dark'] .sf-c-txt-navy\:30\:dark,html.dark .sf-c-txt-navy\:30\:dark{color:hsl(var(--sf-dark-c-txt-navy-30))}html[data-theme='dark'] .sf-c-txt-navy\:40\:dark,html.dark .sf-c-txt-navy\:40\:dark{color:hsl(var(--sf-dark-c-txt-navy-40))}html[data-theme='dark'] .sf-c-txt-navy\:50\:dark,html.dark .sf-c-txt-navy\:50\:dark{color:hsl(var(--sf-dark-c-txt-navy-50))}html[data-theme='dark'] .sf-c-txt-navy\:60\:dark,html.dark .sf-c-txt-navy\:60\:dark{color:hsl(var(--sf-dark-c-txt-navy-60))}html[data-theme='dark'] .sf-c-txt-navy\:70\:dark,html.dark .sf-c-txt-navy\:70\:dark{color:hsl(var(--sf-dark-c-txt-navy-70))}html[data-theme='dark'] .sf-c-txt-navy\:80\:dark,html.dark .sf-c-txt-navy\:80\:dark{color:hsl(var(--sf-dark-c-txt-navy-80))}html[data-theme='dark'] .sf-c-txt-navy\:90\:dark,html.dark .sf-c-txt-navy\:90\:dark{color:hsl(var(--sf-dark-c-txt-navy-90))}html[data-theme='dark'] .sf-c-txt-navy\:100\:dark,html.dark .sf-c-txt-navy\:100\:dark{color:hsl(var(--sf-dark-c-txt-navy-100))}html.var[data-theme='dark'] .sf-c-navy,html.var.dark .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='dark'] .sf-c-navy\:0,html.var.dark .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-navy\:10,html.var.dark .sf-c-navy\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-navy\:20,html.var.dark .sf-c-navy\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-navy\:30,html.var.dark .sf-c-navy\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-navy\:40,html.var.dark .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-navy\:50,html.var.dark .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-navy\:60,html.var.dark .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-navy\:70,html.var.dark .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-navy\:80,html.var.dark .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-navy\:90,html.var.dark .sf-c-navy\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-navy\:100,html.var.dark .sf-c-navy\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-navy\:dark,html.var.dark .sf-c-navy\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='dark'] .sf-c-navy\:0\:dark,html.var.dark .sf-c-navy\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-navy\:10\:dark,html.var.dark .sf-c-navy\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-navy\:20\:dark,html.var.dark .sf-c-navy\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-navy\:30\:dark,html.var.dark .sf-c-navy\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-navy\:40\:dark,html.var.dark .sf-c-navy\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-navy\:50\:dark,html.var.dark .sf-c-navy\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-navy\:60\:dark,html.var.dark .sf-c-navy\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-navy\:70\:dark,html.var.dark .sf-c-navy\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-navy\:80\:dark,html.var.dark .sf-c-navy\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-navy\:90\:dark,html.var.dark .sf-c-navy\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-navy\:100\:dark,html.var.dark .sf-c-navy\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy,html.dark .sf-c-txt-navy{color:hsl(240,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-navy\:0,html.dark .sf-c-txt-navy\:0{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy\:10,html.dark .sf-c-txt-navy\:10{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-navy\:20,html.dark .sf-c-txt-navy\:20{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-navy\:30,html.dark .sf-c-txt-navy\:30{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-navy\:40,html.dark .sf-c-txt-navy\:40{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-navy\:50,html.dark .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-navy\:60,html.dark .sf-c-txt-navy\:60{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-navy\:70,html.dark .sf-c-txt-navy\:70{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-navy\:80,html.dark .sf-c-txt-navy\:80{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-navy\:90,html.dark .sf-c-txt-navy\:90{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-navy\:100,html.dark .sf-c-txt-navy\:100{color:hsl(240,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-navy\:dark,html.dark .sf-c-txt-navy\:dark{color:hsl(240,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-navy\:0\:dark,html.dark .sf-c-txt-navy\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-navy\:10\:dark,html.dark .sf-c-txt-navy\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-navy\:20\:dark,html.dark .sf-c-txt-navy\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-navy\:30\:dark,html.dark .sf-c-txt-navy\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-navy\:40\:dark,html.dark .sf-c-txt-navy\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-navy\:50\:dark,html.dark .sf-c-txt-navy\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-navy\:60\:dark,html.dark .sf-c-txt-navy\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-navy\:70\:dark,html.dark .sf-c-txt-navy\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-navy\:80\:dark,html.dark .sf-c-txt-navy\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-navy\:90\:dark,html.dark .sf-c-txt-navy\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-navy\:100\:dark,html.dark .sf-c-txt-navy\:100\:dark{color:hsl(240,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-navy,html.auto .sf-c-navy{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy))}html[data-theme='auto'] .sf-c-navy\:0,html.auto .sf-c-navy\:0{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-100))}html[data-theme='auto'] .sf-c-navy\:10,html.auto .sf-c-navy\:10{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-90))}html[data-theme='auto'] .sf-c-navy\:20,html.auto .sf-c-navy\:20{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-80))}html[data-theme='auto'] .sf-c-navy\:30,html.auto .sf-c-navy\:30{color:hsl(var(--sf-dark-c-txt-navy-10));background:hsl(var(--sf-dark-c-navy-70))}html[data-theme='auto'] .sf-c-navy\:40,html.auto .sf-c-navy\:40{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-60))}html[data-theme='auto'] .sf-c-navy\:50,html.auto .sf-c-navy\:50{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-50))}html[data-theme='auto'] .sf-c-navy\:60,html.auto .sf-c-navy\:60{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-40))}html[data-theme='auto'] .sf-c-navy\:70,html.auto .sf-c-navy\:70{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-30))}html[data-theme='auto'] .sf-c-navy\:80,html.auto .sf-c-navy\:80{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-20))}html[data-theme='auto'] .sf-c-navy\:90,html.auto .sf-c-navy\:90{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-10))}html[data-theme='auto'] .sf-c-navy\:100,html.auto .sf-c-navy\:100{color:hsl(var(--sf-dark-c-txt-navy-90));background:hsl(var(--sf-dark-c-navy-0))}html[data-theme='auto'] .sf-c-navy\:dark,html.auto .sf-c-navy\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy))}html[data-theme='auto'] .sf-c-navy\:0\:dark,html.auto .sf-c-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-100))}html[data-theme='auto'] .sf-c-navy\:10\:dark,html.auto .sf-c-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-90))}html[data-theme='auto'] .sf-c-navy\:20\:dark,html.auto .sf-c-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-80))}html[data-theme='auto'] .sf-c-navy\:30\:dark,html.auto .sf-c-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-10));background:hsl(var(--sf-c-navy-70))}html[data-theme='auto'] .sf-c-navy\:40\:dark,html.auto .sf-c-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-60))}html[data-theme='auto'] .sf-c-navy\:50\:dark,html.auto .sf-c-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-50))}html[data-theme='auto'] .sf-c-navy\:60\:dark,html.auto .sf-c-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-40))}html[data-theme='auto'] .sf-c-navy\:70\:dark,html.auto .sf-c-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-30))}html[data-theme='auto'] .sf-c-navy\:80\:dark,html.auto .sf-c-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-20))}html[data-theme='auto'] .sf-c-navy\:90\:dark,html.auto .sf-c-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-10))}html[data-theme='auto'] .sf-c-navy\:100\:dark,html.auto .sf-c-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-90));background:hsl(var(--sf-c-navy-0))}html[data-theme='auto'] .sf-c-txt-navy,html.auto .sf-c-txt-navy{color:hsl(var(--sf-c-txt-navy))}html[data-theme='auto'] .sf-c-txt-navy\:0,html.auto .sf-c-txt-navy\:0{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='auto'] .sf-c-txt-navy\:10,html.auto .sf-c-txt-navy\:10{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='auto'] .sf-c-txt-navy\:20,html.auto .sf-c-txt-navy\:20{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='auto'] .sf-c-txt-navy\:30,html.auto .sf-c-txt-navy\:30{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='auto'] .sf-c-txt-navy\:40,html.auto .sf-c-txt-navy\:40{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='auto'] .sf-c-txt-navy\:50,html.auto .sf-c-txt-navy\:50{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='auto'] .sf-c-txt-navy\:60,html.auto .sf-c-txt-navy\:60{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='auto'] .sf-c-txt-navy\:70,html.auto .sf-c-txt-navy\:70{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='auto'] .sf-c-txt-navy\:80,html.auto .sf-c-txt-navy\:80{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='auto'] .sf-c-txt-navy\:90,html.auto .sf-c-txt-navy\:90{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='auto'] .sf-c-txt-navy\:100,html.auto .sf-c-txt-navy\:100{color:hsl(var(--sf-c-txt-navy-100))}html[data-theme='auto'] .sf-c-txt-navy\:dark,html.auto .sf-c-txt-navy\:dark{color:hsl(var(--sf-c-txt-navy))}html[data-theme='auto'] .sf-c-txt-navy\:0\:dark,html.auto .sf-c-txt-navy\:0\:dark{color:hsl(var(--sf-c-txt-navy-0))}html[data-theme='auto'] .sf-c-txt-navy\:10\:dark,html.auto .sf-c-txt-navy\:10\:dark{color:hsl(var(--sf-c-txt-navy-10))}html[data-theme='auto'] .sf-c-txt-navy\:20\:dark,html.auto .sf-c-txt-navy\:20\:dark{color:hsl(var(--sf-c-txt-navy-20))}html[data-theme='auto'] .sf-c-txt-navy\:30\:dark,html.auto .sf-c-txt-navy\:30\:dark{color:hsl(var(--sf-c-txt-navy-30))}html[data-theme='auto'] .sf-c-txt-navy\:40\:dark,html.auto .sf-c-txt-navy\:40\:dark{color:hsl(var(--sf-c-txt-navy-40))}html[data-theme='auto'] .sf-c-txt-navy\:50\:dark,html.auto .sf-c-txt-navy\:50\:dark{color:hsl(var(--sf-c-txt-navy-50))}html[data-theme='auto'] .sf-c-txt-navy\:60\:dark,html.auto .sf-c-txt-navy\:60\:dark{color:hsl(var(--sf-c-txt-navy-60))}html[data-theme='auto'] .sf-c-txt-navy\:70\:dark,html.auto .sf-c-txt-navy\:70\:dark{color:hsl(var(--sf-c-txt-navy-70))}html[data-theme='auto'] .sf-c-txt-navy\:80\:dark,html.auto .sf-c-txt-navy\:80\:dark{color:hsl(var(--sf-c-txt-navy-80))}html[data-theme='auto'] .sf-c-txt-navy\:90\:dark,html.auto .sf-c-txt-navy\:90\:dark{color:hsl(var(--sf-c-txt-navy-90))}html[data-theme='auto'] .sf-c-txt-navy\:100\:dark,html.auto .sf-c-txt-navy\:100\:dark{color:hsl(var(--sf-c-txt-navy-100))}html.var[data-theme='auto'] .sf-c-navy,html.var.auto .sf-c-navy{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='auto'] .sf-c-navy\:0,html.var.auto .sf-c-navy\:0{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-navy\:10,html.var.auto .sf-c-navy\:10{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-navy\:20,html.var.auto .sf-c-navy\:20{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-navy\:30,html.var.auto .sf-c-navy\:30{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-navy\:40,html.var.auto .sf-c-navy\:40{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-navy\:50,html.var.auto .sf-c-navy\:50{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-navy\:60,html.var.auto .sf-c-navy\:60{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-navy\:70,html.var.auto .sf-c-navy\:70{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-navy\:80,html.var.auto .sf-c-navy\:80{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-navy\:90,html.var.auto .sf-c-navy\:90{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-navy\:100,html.var.auto .sf-c-navy\:100{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-navy\:dark,html.var.auto .sf-c-navy\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,75%)}html.var[data-theme='auto'] .sf-c-navy\:0\:dark,html.var.auto .sf-c-navy\:0\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-navy\:10\:dark,html.var.auto .sf-c-navy\:10\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-navy\:20\:dark,html.var.auto .sf-c-navy\:20\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-navy\:30\:dark,html.var.auto .sf-c-navy\:30\:dark{color:hsl(240,100%,10%);background:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-navy\:40\:dark,html.var.auto .sf-c-navy\:40\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-navy\:50\:dark,html.var.auto .sf-c-navy\:50\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-navy\:60\:dark,html.var.auto .sf-c-navy\:60\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-navy\:70\:dark,html.var.auto .sf-c-navy\:70\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-navy\:80\:dark,html.var.auto .sf-c-navy\:80\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-navy\:90\:dark,html.var.auto .sf-c-navy\:90\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-navy\:100\:dark,html.var.auto .sf-c-navy\:100\:dark{color:hsl(240,100%,90%);background:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy,html.auto .sf-c-txt-navy{color:hsl(240,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-navy\:0,html.auto .sf-c-txt-navy\:0{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy\:10,html.auto .sf-c-txt-navy\:10{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-navy\:20,html.auto .sf-c-txt-navy\:20{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-navy\:30,html.auto .sf-c-txt-navy\:30{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-navy\:40,html.auto .sf-c-txt-navy\:40{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-navy\:50,html.auto .sf-c-txt-navy\:50{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-navy\:60,html.auto .sf-c-txt-navy\:60{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-navy\:70,html.auto .sf-c-txt-navy\:70{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-navy\:80,html.auto .sf-c-txt-navy\:80{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-navy\:90,html.auto .sf-c-txt-navy\:90{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-navy\:100,html.auto .sf-c-txt-navy\:100{color:hsl(240,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-navy\:dark,html.auto .sf-c-txt-navy\:dark{color:hsl(240,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-navy\:0\:dark,html.auto .sf-c-txt-navy\:0\:dark{color:hsl(240,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-navy\:10\:dark,html.auto .sf-c-txt-navy\:10\:dark{color:hsl(240,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-navy\:20\:dark,html.auto .sf-c-txt-navy\:20\:dark{color:hsl(240,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-navy\:30\:dark,html.auto .sf-c-txt-navy\:30\:dark{color:hsl(240,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-navy\:40\:dark,html.auto .sf-c-txt-navy\:40\:dark{color:hsl(240,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-navy\:50\:dark,html.auto .sf-c-txt-navy\:50\:dark{color:hsl(240,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-navy\:60\:dark,html.auto .sf-c-txt-navy\:60\:dark{color:hsl(240,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-navy\:70\:dark,html.auto .sf-c-txt-navy\:70\:dark{color:hsl(240,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-navy\:80\:dark,html.auto .sf-c-txt-navy\:80\:dark{color:hsl(240,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-navy\:90\:dark,html.auto .sf-c-txt-navy\:90\:dark{color:hsl(240,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-navy\:100\:dark,html.auto .sf-c-txt-navy\:100\:dark{color:hsl(240,100%,100%)}}[class*='olive']{--sf-c-olive:60 100% 25%;--sf-c-olive-0:60 100% 0%;--sf-c-olive-10:60 100% 10%;--sf-c-olive-20:60 100% 20%;--sf-c-olive-30:60 100% 30%;--sf-c-olive-40:60 100% 40%;--sf-c-olive-50:60 100% 50%;--sf-c-olive-60:60 100% 60%;--sf-c-olive-70:60 100% 70%;--sf-c-olive-80:60 100% 80%;--sf-c-olive-90:60 100% 90%;--sf-c-olive-100:60 100% 100%;--sf-c-txt-olive:var(--sf-c-olive);--sf-c-txt-olive-0:var(--sf-c-olive-0);--sf-c-txt-olive-10:var(--sf-c-olive-10);--sf-c-txt-olive-20:var(--sf-c-olive-20);--sf-c-txt-olive-30:var(--sf-c-olive-30);--sf-c-txt-olive-40:var(--sf-c-olive-40);--sf-c-txt-olive-50:var(--sf-c-olive-50);--sf-c-txt-olive-60:var(--sf-c-olive-60);--sf-c-txt-olive-70:var(--sf-c-olive-70);--sf-c-txt-olive-80:var(--sf-c-olive-80);--sf-c-txt-olive-90:var(--sf-c-olive-90);--sf-c-txt-olive-100:var(--sf-c-olive-100);--sf-dark-c-olive:60 100% 75%;--sf-dark-c-olive-0:60 100% 0%;--sf-dark-c-olive-10:60 100% 10%;--sf-dark-c-olive-20:60 100% 20%;--sf-dark-c-olive-30:60 100% 30%;--sf-dark-c-olive-40:60 100% 40%;--sf-dark-c-olive-50:60 100% 50%;--sf-dark-c-olive-60:60 100% 60%;--sf-dark-c-olive-70:60 100% 70%;--sf-dark-c-olive-80:60 100% 80%;--sf-dark-c-olive-90:60 100% 90%;--sf-dark-c-olive-100:60 100% 100%;--sf-dark-c-txt-olive:var(--sf-dark-c-olive);--sf-dark-c-txt-olive-0:var(--sf-dark-c-olive-0);--sf-dark-c-txt-olive-10:var(--sf-dark-c-olive-10);--sf-dark-c-txt-olive-20:var(--sf-dark-c-olive-20);--sf-dark-c-txt-olive-30:var(--sf-dark-c-olive-30);--sf-dark-c-txt-olive-40:var(--sf-dark-c-olive-40);--sf-dark-c-txt-olive-50:var(--sf-dark-c-olive-50);--sf-dark-c-txt-olive-60:var(--sf-dark-c-olive-60);--sf-dark-c-txt-olive-70:var(--sf-dark-c-olive-70);--sf-dark-c-txt-olive-80:var(--sf-dark-c-olive-80);--sf-dark-c-txt-olive-90:var(--sf-dark-c-olive-90);--sf-dark-c-txt-olive-100:var(--sf-dark-c-olive-100)}.sf-c-olive{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive))}.sf-c-olive\:0{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}.sf-c-olive\:10{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}.sf-c-olive\:20{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}.sf-c-olive\:30{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-30))}.sf-c-olive\:40{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-40))}.sf-c-olive\:50{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}.sf-c-olive\:60{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}.sf-c-olive\:70{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}.sf-c-olive\:80{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}.sf-c-olive\:90{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}.sf-c-olive\:100{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-100))}html.var .sf-c-olive{color:hsl(60,100%,90%);background:hsl(60,100%,25%)}html.var .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-olive\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-olive\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-olive\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-olive\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-olive\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-olive\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-olive\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-olive{color:hsl(var(--sf-dark-c-txt-olive))}.sf-c-txt-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-100))}.sf-c-txt-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-90))}.sf-c-txt-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-80))}.sf-c-txt-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-70))}.sf-c-txt-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-60))}.sf-c-txt-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-50))}.sf-c-txt-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-40))}.sf-c-txt-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-30))}.sf-c-txt-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-20))}.sf-c-txt-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-10))}.sf-c-txt-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-0))}html.var .sf-c-txt-olive{color:hsl(60,100%,75%)}html.var .sf-c-txt-olive\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-olive\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-olive\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-olive\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-olive\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-olive\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-olive\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-olive\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-olive\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-olive\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-olive,html.dark .sf-c-olive{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive))}html[data-theme='dark'] .sf-c-olive\:0,html.dark .sf-c-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-100))}html[data-theme='dark'] .sf-c-olive\:10,html.dark .sf-c-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-90))}html[data-theme='dark'] .sf-c-olive\:20,html.dark .sf-c-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-80))}html[data-theme='dark'] .sf-c-olive\:30,html.dark .sf-c-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-70))}html[data-theme='dark'] .sf-c-olive\:40,html.dark .sf-c-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-60))}html[data-theme='dark'] .sf-c-olive\:50,html.dark .sf-c-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-50))}html[data-theme='dark'] .sf-c-olive\:60,html.dark .sf-c-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-40))}html[data-theme='dark'] .sf-c-olive\:70,html.dark .sf-c-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-30))}html[data-theme='dark'] .sf-c-olive\:80,html.dark .sf-c-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-20))}html[data-theme='dark'] .sf-c-olive\:90,html.dark .sf-c-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-10))}html[data-theme='dark'] .sf-c-olive\:100,html.dark .sf-c-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-0))}html[data-theme='dark'] .sf-c-olive\:dark,html.dark .sf-c-olive\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive))}html[data-theme='dark'] .sf-c-olive\:0\:dark,html.dark .sf-c-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-100))}html[data-theme='dark'] .sf-c-olive\:10\:dark,html.dark .sf-c-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}html[data-theme='dark'] .sf-c-olive\:20\:dark,html.dark .sf-c-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}html[data-theme='dark'] .sf-c-olive\:30\:dark,html.dark .sf-c-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}html[data-theme='dark'] .sf-c-olive\:40\:dark,html.dark .sf-c-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}html[data-theme='dark'] .sf-c-olive\:50\:dark,html.dark .sf-c-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}html[data-theme='dark'] .sf-c-olive\:60\:dark,html.dark .sf-c-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-40))}html[data-theme='dark'] .sf-c-olive\:70\:dark,html.dark .sf-c-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-30))}html[data-theme='dark'] .sf-c-olive\:80\:dark,html.dark .sf-c-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}html[data-theme='dark'] .sf-c-olive\:90\:dark,html.dark .sf-c-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}html[data-theme='dark'] .sf-c-olive\:100\:dark,html.dark .sf-c-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}html[data-theme='dark'] .sf-c-txt-olive,html.dark .sf-c-txt-olive{color:hsl(var(--sf-c-txt-olive))}html[data-theme='dark'] .sf-c-txt-olive\:0,html.dark .sf-c-txt-olive\:0{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='dark'] .sf-c-txt-olive\:10,html.dark .sf-c-txt-olive\:10{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='dark'] .sf-c-txt-olive\:20,html.dark .sf-c-txt-olive\:20{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='dark'] .sf-c-txt-olive\:30,html.dark .sf-c-txt-olive\:30{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='dark'] .sf-c-txt-olive\:40,html.dark .sf-c-txt-olive\:40{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='dark'] .sf-c-txt-olive\:50,html.dark .sf-c-txt-olive\:50{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='dark'] .sf-c-txt-olive\:60,html.dark .sf-c-txt-olive\:60{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='dark'] .sf-c-txt-olive\:70,html.dark .sf-c-txt-olive\:70{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='dark'] .sf-c-txt-olive\:80,html.dark .sf-c-txt-olive\:80{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='dark'] .sf-c-txt-olive\:90,html.dark .sf-c-txt-olive\:90{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='dark'] .sf-c-txt-olive\:100,html.dark .sf-c-txt-olive\:100{color:hsl(var(--sf-c-txt-olive-100))}html[data-theme='dark'] .sf-c-txt-olive\:dark,html.dark .sf-c-txt-olive\:dark{color:hsl(var(--sf-c-txt-olive))}html[data-theme='dark'] .sf-c-txt-olive\:0\:dark,html.dark .sf-c-txt-olive\:0\:dark{color:hsl(var(--sf-dark-c-txt-olive-0))}html[data-theme='dark'] .sf-c-txt-olive\:10\:dark,html.dark .sf-c-txt-olive\:10\:dark{color:hsl(var(--sf-dark-c-txt-olive-10))}html[data-theme='dark'] .sf-c-txt-olive\:20\:dark,html.dark .sf-c-txt-olive\:20\:dark{color:hsl(var(--sf-dark-c-txt-olive-20))}html[data-theme='dark'] .sf-c-txt-olive\:30\:dark,html.dark .sf-c-txt-olive\:30\:dark{color:hsl(var(--sf-dark-c-txt-olive-30))}html[data-theme='dark'] .sf-c-txt-olive\:40\:dark,html.dark .sf-c-txt-olive\:40\:dark{color:hsl(var(--sf-dark-c-txt-olive-40))}html[data-theme='dark'] .sf-c-txt-olive\:50\:dark,html.dark .sf-c-txt-olive\:50\:dark{color:hsl(var(--sf-dark-c-txt-olive-50))}html[data-theme='dark'] .sf-c-txt-olive\:60\:dark,html.dark .sf-c-txt-olive\:60\:dark{color:hsl(var(--sf-dark-c-txt-olive-60))}html[data-theme='dark'] .sf-c-txt-olive\:70\:dark,html.dark .sf-c-txt-olive\:70\:dark{color:hsl(var(--sf-dark-c-txt-olive-70))}html[data-theme='dark'] .sf-c-txt-olive\:80\:dark,html.dark .sf-c-txt-olive\:80\:dark{color:hsl(var(--sf-dark-c-txt-olive-80))}html[data-theme='dark'] .sf-c-txt-olive\:90\:dark,html.dark .sf-c-txt-olive\:90\:dark{color:hsl(var(--sf-dark-c-txt-olive-90))}html[data-theme='dark'] .sf-c-txt-olive\:100\:dark,html.dark .sf-c-txt-olive\:100\:dark{color:hsl(var(--sf-dark-c-txt-olive-100))}html.var[data-theme='dark'] .sf-c-olive,html.var.dark .sf-c-olive{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='dark'] .sf-c-olive\:0,html.var.dark .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-olive\:10,html.var.dark .sf-c-olive\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-olive\:20,html.var.dark .sf-c-olive\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-olive\:30,html.var.dark .sf-c-olive\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-olive\:40,html.var.dark .sf-c-olive\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-olive\:50,html.var.dark .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-olive\:60,html.var.dark .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-olive\:70,html.var.dark .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-olive\:80,html.var.dark .sf-c-olive\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-olive\:90,html.var.dark .sf-c-olive\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-olive\:100,html.var.dark .sf-c-olive\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-olive\:dark,html.var.dark .sf-c-olive\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='dark'] .sf-c-olive\:0\:dark,html.var.dark .sf-c-olive\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-olive\:10\:dark,html.var.dark .sf-c-olive\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-olive\:20\:dark,html.var.dark .sf-c-olive\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-olive\:30\:dark,html.var.dark .sf-c-olive\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-olive\:40\:dark,html.var.dark .sf-c-olive\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-olive\:50\:dark,html.var.dark .sf-c-olive\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-olive\:60\:dark,html.var.dark .sf-c-olive\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-olive\:70\:dark,html.var.dark .sf-c-olive\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-olive\:80\:dark,html.var.dark .sf-c-olive\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-olive\:90\:dark,html.var.dark .sf-c-olive\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-olive\:100\:dark,html.var.dark .sf-c-olive\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive,html.dark .sf-c-txt-olive{color:hsl(60,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-olive\:0,html.dark .sf-c-txt-olive\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive\:10,html.dark .sf-c-txt-olive\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-olive\:20,html.dark .sf-c-txt-olive\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-olive\:30,html.dark .sf-c-txt-olive\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-olive\:40,html.dark .sf-c-txt-olive\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-olive\:50,html.dark .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-olive\:60,html.dark .sf-c-txt-olive\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-olive\:70,html.dark .sf-c-txt-olive\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-olive\:80,html.dark .sf-c-txt-olive\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-olive\:90,html.dark .sf-c-txt-olive\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-olive\:100,html.dark .sf-c-txt-olive\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-olive\:dark,html.dark .sf-c-txt-olive\:dark{color:hsl(60,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-olive\:0\:dark,html.dark .sf-c-txt-olive\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-olive\:10\:dark,html.dark .sf-c-txt-olive\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-olive\:20\:dark,html.dark .sf-c-txt-olive\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-olive\:30\:dark,html.dark .sf-c-txt-olive\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-olive\:40\:dark,html.dark .sf-c-txt-olive\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-olive\:50\:dark,html.dark .sf-c-txt-olive\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-olive\:60\:dark,html.dark .sf-c-txt-olive\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-olive\:70\:dark,html.dark .sf-c-txt-olive\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-olive\:80\:dark,html.dark .sf-c-txt-olive\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-olive\:90\:dark,html.dark .sf-c-txt-olive\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-olive\:100\:dark,html.dark .sf-c-txt-olive\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-olive,html.auto .sf-c-olive{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive))}html[data-theme='auto'] .sf-c-olive\:0,html.auto .sf-c-olive\:0{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-100))}html[data-theme='auto'] .sf-c-olive\:10,html.auto .sf-c-olive\:10{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-90))}html[data-theme='auto'] .sf-c-olive\:20,html.auto .sf-c-olive\:20{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-80))}html[data-theme='auto'] .sf-c-olive\:30,html.auto .sf-c-olive\:30{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-70))}html[data-theme='auto'] .sf-c-olive\:40,html.auto .sf-c-olive\:40{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-60))}html[data-theme='auto'] .sf-c-olive\:50,html.auto .sf-c-olive\:50{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-50))}html[data-theme='auto'] .sf-c-olive\:60,html.auto .sf-c-olive\:60{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-40))}html[data-theme='auto'] .sf-c-olive\:70,html.auto .sf-c-olive\:70{color:hsl(var(--sf-dark-c-txt-olive-10));background:hsl(var(--sf-dark-c-olive-30))}html[data-theme='auto'] .sf-c-olive\:80,html.auto .sf-c-olive\:80{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-20))}html[data-theme='auto'] .sf-c-olive\:90,html.auto .sf-c-olive\:90{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-10))}html[data-theme='auto'] .sf-c-olive\:100,html.auto .sf-c-olive\:100{color:hsl(var(--sf-dark-c-txt-olive-90));background:hsl(var(--sf-dark-c-olive-0))}html[data-theme='auto'] .sf-c-olive\:dark,html.auto .sf-c-olive\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive))}html[data-theme='auto'] .sf-c-olive\:0\:dark,html.auto .sf-c-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-100))}html[data-theme='auto'] .sf-c-olive\:10\:dark,html.auto .sf-c-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-90))}html[data-theme='auto'] .sf-c-olive\:20\:dark,html.auto .sf-c-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-80))}html[data-theme='auto'] .sf-c-olive\:30\:dark,html.auto .sf-c-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-70))}html[data-theme='auto'] .sf-c-olive\:40\:dark,html.auto .sf-c-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-60))}html[data-theme='auto'] .sf-c-olive\:50\:dark,html.auto .sf-c-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-50))}html[data-theme='auto'] .sf-c-olive\:60\:dark,html.auto .sf-c-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-40))}html[data-theme='auto'] .sf-c-olive\:70\:dark,html.auto .sf-c-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-10));background:hsl(var(--sf-c-olive-30))}html[data-theme='auto'] .sf-c-olive\:80\:dark,html.auto .sf-c-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-20))}html[data-theme='auto'] .sf-c-olive\:90\:dark,html.auto .sf-c-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-10))}html[data-theme='auto'] .sf-c-olive\:100\:dark,html.auto .sf-c-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-90));background:hsl(var(--sf-c-olive-0))}html[data-theme='auto'] .sf-c-txt-olive,html.auto .sf-c-txt-olive{color:hsl(var(--sf-c-txt-olive))}html[data-theme='auto'] .sf-c-txt-olive\:0,html.auto .sf-c-txt-olive\:0{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='auto'] .sf-c-txt-olive\:10,html.auto .sf-c-txt-olive\:10{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='auto'] .sf-c-txt-olive\:20,html.auto .sf-c-txt-olive\:20{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='auto'] .sf-c-txt-olive\:30,html.auto .sf-c-txt-olive\:30{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='auto'] .sf-c-txt-olive\:40,html.auto .sf-c-txt-olive\:40{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='auto'] .sf-c-txt-olive\:50,html.auto .sf-c-txt-olive\:50{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='auto'] .sf-c-txt-olive\:60,html.auto .sf-c-txt-olive\:60{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='auto'] .sf-c-txt-olive\:70,html.auto .sf-c-txt-olive\:70{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='auto'] .sf-c-txt-olive\:80,html.auto .sf-c-txt-olive\:80{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='auto'] .sf-c-txt-olive\:90,html.auto .sf-c-txt-olive\:90{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='auto'] .sf-c-txt-olive\:100,html.auto .sf-c-txt-olive\:100{color:hsl(var(--sf-c-txt-olive-100))}html[data-theme='auto'] .sf-c-txt-olive\:dark,html.auto .sf-c-txt-olive\:dark{color:hsl(var(--sf-c-txt-olive))}html[data-theme='auto'] .sf-c-txt-olive\:0\:dark,html.auto .sf-c-txt-olive\:0\:dark{color:hsl(var(--sf-c-txt-olive-0))}html[data-theme='auto'] .sf-c-txt-olive\:10\:dark,html.auto .sf-c-txt-olive\:10\:dark{color:hsl(var(--sf-c-txt-olive-10))}html[data-theme='auto'] .sf-c-txt-olive\:20\:dark,html.auto .sf-c-txt-olive\:20\:dark{color:hsl(var(--sf-c-txt-olive-20))}html[data-theme='auto'] .sf-c-txt-olive\:30\:dark,html.auto .sf-c-txt-olive\:30\:dark{color:hsl(var(--sf-c-txt-olive-30))}html[data-theme='auto'] .sf-c-txt-olive\:40\:dark,html.auto .sf-c-txt-olive\:40\:dark{color:hsl(var(--sf-c-txt-olive-40))}html[data-theme='auto'] .sf-c-txt-olive\:50\:dark,html.auto .sf-c-txt-olive\:50\:dark{color:hsl(var(--sf-c-txt-olive-50))}html[data-theme='auto'] .sf-c-txt-olive\:60\:dark,html.auto .sf-c-txt-olive\:60\:dark{color:hsl(var(--sf-c-txt-olive-60))}html[data-theme='auto'] .sf-c-txt-olive\:70\:dark,html.auto .sf-c-txt-olive\:70\:dark{color:hsl(var(--sf-c-txt-olive-70))}html[data-theme='auto'] .sf-c-txt-olive\:80\:dark,html.auto .sf-c-txt-olive\:80\:dark{color:hsl(var(--sf-c-txt-olive-80))}html[data-theme='auto'] .sf-c-txt-olive\:90\:dark,html.auto .sf-c-txt-olive\:90\:dark{color:hsl(var(--sf-c-txt-olive-90))}html[data-theme='auto'] .sf-c-txt-olive\:100\:dark,html.auto .sf-c-txt-olive\:100\:dark{color:hsl(var(--sf-c-txt-olive-100))}html.var[data-theme='auto'] .sf-c-olive,html.var.auto .sf-c-olive{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='auto'] .sf-c-olive\:0,html.var.auto .sf-c-olive\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-olive\:10,html.var.auto .sf-c-olive\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-olive\:20,html.var.auto .sf-c-olive\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-olive\:30,html.var.auto .sf-c-olive\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-olive\:40,html.var.auto .sf-c-olive\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-olive\:50,html.var.auto .sf-c-olive\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-olive\:60,html.var.auto .sf-c-olive\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-olive\:70,html.var.auto .sf-c-olive\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-olive\:80,html.var.auto .sf-c-olive\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-olive\:90,html.var.auto .sf-c-olive\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-olive\:100,html.var.auto .sf-c-olive\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-olive\:dark,html.var.auto .sf-c-olive\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,75%)}html.var[data-theme='auto'] .sf-c-olive\:0\:dark,html.var.auto .sf-c-olive\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-olive\:10\:dark,html.var.auto .sf-c-olive\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-olive\:20\:dark,html.var.auto .sf-c-olive\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-olive\:30\:dark,html.var.auto .sf-c-olive\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-olive\:40\:dark,html.var.auto .sf-c-olive\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-olive\:50\:dark,html.var.auto .sf-c-olive\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-olive\:60\:dark,html.var.auto .sf-c-olive\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-olive\:70\:dark,html.var.auto .sf-c-olive\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-olive\:80\:dark,html.var.auto .sf-c-olive\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-olive\:90\:dark,html.var.auto .sf-c-olive\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-olive\:100\:dark,html.var.auto .sf-c-olive\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive,html.auto .sf-c-txt-olive{color:hsl(60,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-olive\:0,html.auto .sf-c-txt-olive\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive\:10,html.auto .sf-c-txt-olive\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-olive\:20,html.auto .sf-c-txt-olive\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-olive\:30,html.auto .sf-c-txt-olive\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-olive\:40,html.auto .sf-c-txt-olive\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-olive\:50,html.auto .sf-c-txt-olive\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-olive\:60,html.auto .sf-c-txt-olive\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-olive\:70,html.auto .sf-c-txt-olive\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-olive\:80,html.auto .sf-c-txt-olive\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-olive\:90,html.auto .sf-c-txt-olive\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-olive\:100,html.auto .sf-c-txt-olive\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-olive\:dark,html.auto .sf-c-txt-olive\:dark{color:hsl(60,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-olive\:0\:dark,html.auto .sf-c-txt-olive\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-olive\:10\:dark,html.auto .sf-c-txt-olive\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-olive\:20\:dark,html.auto .sf-c-txt-olive\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-olive\:30\:dark,html.auto .sf-c-txt-olive\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-olive\:40\:dark,html.auto .sf-c-txt-olive\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-olive\:50\:dark,html.auto .sf-c-txt-olive\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-olive\:60\:dark,html.auto .sf-c-txt-olive\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-olive\:70\:dark,html.auto .sf-c-txt-olive\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-olive\:80\:dark,html.auto .sf-c-txt-olive\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-olive\:90\:dark,html.auto .sf-c-txt-olive\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-olive\:100\:dark,html.auto .sf-c-txt-olive\:100\:dark{color:hsl(60,100%,100%)}}[class*='purple']{--sf-c-purple:300 100% 25%;--sf-c-purple-0:300 100% 0%;--sf-c-purple-10:300 100% 10%;--sf-c-purple-20:300 100% 20%;--sf-c-purple-30:300 100% 30%;--sf-c-purple-40:300 100% 40%;--sf-c-purple-50:300 100% 50%;--sf-c-purple-60:300 100% 60%;--sf-c-purple-70:300 100% 70%;--sf-c-purple-80:300 100% 80%;--sf-c-purple-90:300 100% 90%;--sf-c-purple-100:300 100% 100%;--sf-c-txt-purple:var(--sf-c-purple);--sf-c-txt-purple-0:var(--sf-c-purple-0);--sf-c-txt-purple-10:var(--sf-c-purple-10);--sf-c-txt-purple-20:var(--sf-c-purple-20);--sf-c-txt-purple-30:var(--sf-c-purple-30);--sf-c-txt-purple-40:var(--sf-c-purple-40);--sf-c-txt-purple-50:var(--sf-c-purple-50);--sf-c-txt-purple-60:var(--sf-c-purple-60);--sf-c-txt-purple-70:var(--sf-c-purple-70);--sf-c-txt-purple-80:var(--sf-c-purple-80);--sf-c-txt-purple-90:var(--sf-c-purple-90);--sf-c-txt-purple-100:var(--sf-c-purple-100);--sf-dark-c-purple:300 100% 75%;--sf-dark-c-purple-0:300 100% 0%;--sf-dark-c-purple-10:300 100% 10%;--sf-dark-c-purple-20:300 100% 20%;--sf-dark-c-purple-30:300 100% 30%;--sf-dark-c-purple-40:300 100% 40%;--sf-dark-c-purple-50:300 100% 50%;--sf-dark-c-purple-60:300 100% 60%;--sf-dark-c-purple-70:300 100% 70%;--sf-dark-c-purple-80:300 100% 80%;--sf-dark-c-purple-90:300 100% 90%;--sf-dark-c-purple-100:300 100% 100%;--sf-dark-c-txt-purple:var(--sf-dark-c-purple);--sf-dark-c-txt-purple-0:var(--sf-dark-c-purple-0);--sf-dark-c-txt-purple-10:var(--sf-dark-c-purple-10);--sf-dark-c-txt-purple-20:var(--sf-dark-c-purple-20);--sf-dark-c-txt-purple-30:var(--sf-dark-c-purple-30);--sf-dark-c-txt-purple-40:var(--sf-dark-c-purple-40);--sf-dark-c-txt-purple-50:var(--sf-dark-c-purple-50);--sf-dark-c-txt-purple-60:var(--sf-dark-c-purple-60);--sf-dark-c-txt-purple-70:var(--sf-dark-c-purple-70);--sf-dark-c-txt-purple-80:var(--sf-dark-c-purple-80);--sf-dark-c-txt-purple-90:var(--sf-dark-c-purple-90);--sf-dark-c-txt-purple-100:var(--sf-dark-c-purple-100)}.sf-c-purple{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple))}.sf-c-purple\:0{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}.sf-c-purple\:10{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}.sf-c-purple\:20{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}.sf-c-purple\:30{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}.sf-c-purple\:40{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}.sf-c-purple\:50{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-50))}.sf-c-purple\:60{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-60))}.sf-c-purple\:70{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}.sf-c-purple\:80{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}.sf-c-purple\:90{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}.sf-c-purple\:100{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-100))}html.var .sf-c-purple{color:hsl(300,100%,90%);background:hsl(300,100%,25%)}html.var .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var .sf-c-purple\:10{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var .sf-c-purple\:20{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var .sf-c-purple\:30{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var .sf-c-purple\:40{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var .sf-c-purple\:50{color:hsl(300,100%,90%);background:hsl(300,100%,50%)}html.var .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,60%)}html.var .sf-c-purple\:70{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var .sf-c-purple\:80{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var .sf-c-purple\:90{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var .sf-c-purple\:100{color:hsl(300,100%,10%);background:hsl(300,100%,100%)}.sf-c-txt-purple{color:hsl(var(--sf-dark-c-txt-purple))}.sf-c-txt-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-100))}.sf-c-txt-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-90))}.sf-c-txt-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-80))}.sf-c-txt-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-70))}.sf-c-txt-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-60))}.sf-c-txt-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-50))}.sf-c-txt-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-40))}.sf-c-txt-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-30))}.sf-c-txt-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-20))}.sf-c-txt-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-10))}.sf-c-txt-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-0))}html.var .sf-c-txt-purple{color:hsl(300,100%,75%)}html.var .sf-c-txt-purple\:0{color:hsl(300,100%,100%)}html.var .sf-c-txt-purple\:10{color:hsl(300,100%,90%)}html.var .sf-c-txt-purple\:20{color:hsl(300,100%,80%)}html.var .sf-c-txt-purple\:30{color:hsl(300,100%,70%)}html.var .sf-c-txt-purple\:40{color:hsl(300,100%,60%)}html.var .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var .sf-c-txt-purple\:60{color:hsl(300,100%,40%)}html.var .sf-c-txt-purple\:70{color:hsl(300,100%,30%)}html.var .sf-c-txt-purple\:80{color:hsl(300,100%,20%)}html.var .sf-c-txt-purple\:90{color:hsl(300,100%,10%)}html.var .sf-c-txt-purple\:100{color:hsl(300,100%,0%)}html[data-theme='dark'] .sf-c-purple,html.dark .sf-c-purple{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple))}html[data-theme='dark'] .sf-c-purple\:0,html.dark .sf-c-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-100))}html[data-theme='dark'] .sf-c-purple\:10,html.dark .sf-c-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-90))}html[data-theme='dark'] .sf-c-purple\:20,html.dark .sf-c-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-80))}html[data-theme='dark'] .sf-c-purple\:30,html.dark .sf-c-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-70))}html[data-theme='dark'] .sf-c-purple\:40,html.dark .sf-c-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-60))}html[data-theme='dark'] .sf-c-purple\:50,html.dark .sf-c-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-50))}html[data-theme='dark'] .sf-c-purple\:60,html.dark .sf-c-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-40))}html[data-theme='dark'] .sf-c-purple\:70,html.dark .sf-c-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-30))}html[data-theme='dark'] .sf-c-purple\:80,html.dark .sf-c-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-20))}html[data-theme='dark'] .sf-c-purple\:90,html.dark .sf-c-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-10))}html[data-theme='dark'] .sf-c-purple\:100,html.dark .sf-c-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-0))}html[data-theme='dark'] .sf-c-purple\:dark,html.dark .sf-c-purple\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple))}html[data-theme='dark'] .sf-c-purple\:0\:dark,html.dark .sf-c-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-100))}html[data-theme='dark'] .sf-c-purple\:10\:dark,html.dark .sf-c-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}html[data-theme='dark'] .sf-c-purple\:20\:dark,html.dark .sf-c-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}html[data-theme='dark'] .sf-c-purple\:30\:dark,html.dark .sf-c-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}html[data-theme='dark'] .sf-c-purple\:40\:dark,html.dark .sf-c-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-60))}html[data-theme='dark'] .sf-c-purple\:50\:dark,html.dark .sf-c-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-50))}html[data-theme='dark'] .sf-c-purple\:60\:dark,html.dark .sf-c-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}html[data-theme='dark'] .sf-c-purple\:70\:dark,html.dark .sf-c-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}html[data-theme='dark'] .sf-c-purple\:80\:dark,html.dark .sf-c-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}html[data-theme='dark'] .sf-c-purple\:90\:dark,html.dark .sf-c-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}html[data-theme='dark'] .sf-c-purple\:100\:dark,html.dark .sf-c-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}html[data-theme='dark'] .sf-c-txt-purple,html.dark .sf-c-txt-purple{color:hsl(var(--sf-c-txt-purple))}html[data-theme='dark'] .sf-c-txt-purple\:0,html.dark .sf-c-txt-purple\:0{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='dark'] .sf-c-txt-purple\:10,html.dark .sf-c-txt-purple\:10{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='dark'] .sf-c-txt-purple\:20,html.dark .sf-c-txt-purple\:20{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='dark'] .sf-c-txt-purple\:30,html.dark .sf-c-txt-purple\:30{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='dark'] .sf-c-txt-purple\:40,html.dark .sf-c-txt-purple\:40{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='dark'] .sf-c-txt-purple\:50,html.dark .sf-c-txt-purple\:50{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='dark'] .sf-c-txt-purple\:60,html.dark .sf-c-txt-purple\:60{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='dark'] .sf-c-txt-purple\:70,html.dark .sf-c-txt-purple\:70{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='dark'] .sf-c-txt-purple\:80,html.dark .sf-c-txt-purple\:80{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='dark'] .sf-c-txt-purple\:90,html.dark .sf-c-txt-purple\:90{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='dark'] .sf-c-txt-purple\:100,html.dark .sf-c-txt-purple\:100{color:hsl(var(--sf-c-txt-purple-100))}html[data-theme='dark'] .sf-c-txt-purple\:dark,html.dark .sf-c-txt-purple\:dark{color:hsl(var(--sf-c-txt-purple))}html[data-theme='dark'] .sf-c-txt-purple\:0\:dark,html.dark .sf-c-txt-purple\:0\:dark{color:hsl(var(--sf-dark-c-txt-purple-0))}html[data-theme='dark'] .sf-c-txt-purple\:10\:dark,html.dark .sf-c-txt-purple\:10\:dark{color:hsl(var(--sf-dark-c-txt-purple-10))}html[data-theme='dark'] .sf-c-txt-purple\:20\:dark,html.dark .sf-c-txt-purple\:20\:dark{color:hsl(var(--sf-dark-c-txt-purple-20))}html[data-theme='dark'] .sf-c-txt-purple\:30\:dark,html.dark .sf-c-txt-purple\:30\:dark{color:hsl(var(--sf-dark-c-txt-purple-30))}html[data-theme='dark'] .sf-c-txt-purple\:40\:dark,html.dark .sf-c-txt-purple\:40\:dark{color:hsl(var(--sf-dark-c-txt-purple-40))}html[data-theme='dark'] .sf-c-txt-purple\:50\:dark,html.dark .sf-c-txt-purple\:50\:dark{color:hsl(var(--sf-dark-c-txt-purple-50))}html[data-theme='dark'] .sf-c-txt-purple\:60\:dark,html.dark .sf-c-txt-purple\:60\:dark{color:hsl(var(--sf-dark-c-txt-purple-60))}html[data-theme='dark'] .sf-c-txt-purple\:70\:dark,html.dark .sf-c-txt-purple\:70\:dark{color:hsl(var(--sf-dark-c-txt-purple-70))}html[data-theme='dark'] .sf-c-txt-purple\:80\:dark,html.dark .sf-c-txt-purple\:80\:dark{color:hsl(var(--sf-dark-c-txt-purple-80))}html[data-theme='dark'] .sf-c-txt-purple\:90\:dark,html.dark .sf-c-txt-purple\:90\:dark{color:hsl(var(--sf-dark-c-txt-purple-90))}html[data-theme='dark'] .sf-c-txt-purple\:100\:dark,html.dark .sf-c-txt-purple\:100\:dark{color:hsl(var(--sf-dark-c-txt-purple-100))}html.var[data-theme='dark'] .sf-c-purple,html.var.dark .sf-c-purple{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='dark'] .sf-c-purple\:0,html.var.dark .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-purple\:10,html.var.dark .sf-c-purple\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-purple\:20,html.var.dark .sf-c-purple\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-purple\:30,html.var.dark .sf-c-purple\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-purple\:40,html.var.dark .sf-c-purple\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-purple\:50,html.var.dark .sf-c-purple\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-purple\:60,html.var.dark .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-purple\:70,html.var.dark .sf-c-purple\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-purple\:80,html.var.dark .sf-c-purple\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-purple\:90,html.var.dark .sf-c-purple\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-purple\:100,html.var.dark .sf-c-purple\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-purple\:dark,html.var.dark .sf-c-purple\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='dark'] .sf-c-purple\:0\:dark,html.var.dark .sf-c-purple\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-purple\:10\:dark,html.var.dark .sf-c-purple\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-purple\:20\:dark,html.var.dark .sf-c-purple\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-purple\:30\:dark,html.var.dark .sf-c-purple\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-purple\:40\:dark,html.var.dark .sf-c-purple\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-purple\:50\:dark,html.var.dark .sf-c-purple\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-purple\:60\:dark,html.var.dark .sf-c-purple\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-purple\:70\:dark,html.var.dark .sf-c-purple\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-purple\:80\:dark,html.var.dark .sf-c-purple\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-purple\:90\:dark,html.var.dark .sf-c-purple\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-purple\:100\:dark,html.var.dark .sf-c-purple\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple,html.dark .sf-c-txt-purple{color:hsl(300,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-purple\:0,html.dark .sf-c-txt-purple\:0{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple\:10,html.dark .sf-c-txt-purple\:10{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-purple\:20,html.dark .sf-c-txt-purple\:20{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-purple\:30,html.dark .sf-c-txt-purple\:30{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-purple\:40,html.dark .sf-c-txt-purple\:40{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-purple\:50,html.dark .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-purple\:60,html.dark .sf-c-txt-purple\:60{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-purple\:70,html.dark .sf-c-txt-purple\:70{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-purple\:80,html.dark .sf-c-txt-purple\:80{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-purple\:90,html.dark .sf-c-txt-purple\:90{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-purple\:100,html.dark .sf-c-txt-purple\:100{color:hsl(300,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-purple\:dark,html.dark .sf-c-txt-purple\:dark{color:hsl(300,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-purple\:0\:dark,html.dark .sf-c-txt-purple\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-purple\:10\:dark,html.dark .sf-c-txt-purple\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-purple\:20\:dark,html.dark .sf-c-txt-purple\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-purple\:30\:dark,html.dark .sf-c-txt-purple\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-purple\:40\:dark,html.dark .sf-c-txt-purple\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-purple\:50\:dark,html.dark .sf-c-txt-purple\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-purple\:60\:dark,html.dark .sf-c-txt-purple\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-purple\:70\:dark,html.dark .sf-c-txt-purple\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-purple\:80\:dark,html.dark .sf-c-txt-purple\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-purple\:90\:dark,html.dark .sf-c-txt-purple\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-purple\:100\:dark,html.dark .sf-c-txt-purple\:100\:dark{color:hsl(300,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-purple,html.auto .sf-c-purple{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple))}html[data-theme='auto'] .sf-c-purple\:0,html.auto .sf-c-purple\:0{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-100))}html[data-theme='auto'] .sf-c-purple\:10,html.auto .sf-c-purple\:10{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-90))}html[data-theme='auto'] .sf-c-purple\:20,html.auto .sf-c-purple\:20{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-80))}html[data-theme='auto'] .sf-c-purple\:30,html.auto .sf-c-purple\:30{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-70))}html[data-theme='auto'] .sf-c-purple\:40,html.auto .sf-c-purple\:40{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-60))}html[data-theme='auto'] .sf-c-purple\:50,html.auto .sf-c-purple\:50{color:hsl(var(--sf-dark-c-txt-purple-10));background:hsl(var(--sf-dark-c-purple-50))}html[data-theme='auto'] .sf-c-purple\:60,html.auto .sf-c-purple\:60{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-40))}html[data-theme='auto'] .sf-c-purple\:70,html.auto .sf-c-purple\:70{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-30))}html[data-theme='auto'] .sf-c-purple\:80,html.auto .sf-c-purple\:80{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-20))}html[data-theme='auto'] .sf-c-purple\:90,html.auto .sf-c-purple\:90{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-10))}html[data-theme='auto'] .sf-c-purple\:100,html.auto .sf-c-purple\:100{color:hsl(var(--sf-dark-c-txt-purple-90));background:hsl(var(--sf-dark-c-purple-0))}html[data-theme='auto'] .sf-c-purple\:dark,html.auto .sf-c-purple\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple))}html[data-theme='auto'] .sf-c-purple\:0\:dark,html.auto .sf-c-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-100))}html[data-theme='auto'] .sf-c-purple\:10\:dark,html.auto .sf-c-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-90))}html[data-theme='auto'] .sf-c-purple\:20\:dark,html.auto .sf-c-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-80))}html[data-theme='auto'] .sf-c-purple\:30\:dark,html.auto .sf-c-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-70))}html[data-theme='auto'] .sf-c-purple\:40\:dark,html.auto .sf-c-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-60))}html[data-theme='auto'] .sf-c-purple\:50\:dark,html.auto .sf-c-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-10));background:hsl(var(--sf-c-purple-50))}html[data-theme='auto'] .sf-c-purple\:60\:dark,html.auto .sf-c-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-40))}html[data-theme='auto'] .sf-c-purple\:70\:dark,html.auto .sf-c-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-30))}html[data-theme='auto'] .sf-c-purple\:80\:dark,html.auto .sf-c-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-20))}html[data-theme='auto'] .sf-c-purple\:90\:dark,html.auto .sf-c-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-10))}html[data-theme='auto'] .sf-c-purple\:100\:dark,html.auto .sf-c-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-90));background:hsl(var(--sf-c-purple-0))}html[data-theme='auto'] .sf-c-txt-purple,html.auto .sf-c-txt-purple{color:hsl(var(--sf-c-txt-purple))}html[data-theme='auto'] .sf-c-txt-purple\:0,html.auto .sf-c-txt-purple\:0{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='auto'] .sf-c-txt-purple\:10,html.auto .sf-c-txt-purple\:10{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='auto'] .sf-c-txt-purple\:20,html.auto .sf-c-txt-purple\:20{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='auto'] .sf-c-txt-purple\:30,html.auto .sf-c-txt-purple\:30{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='auto'] .sf-c-txt-purple\:40,html.auto .sf-c-txt-purple\:40{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='auto'] .sf-c-txt-purple\:50,html.auto .sf-c-txt-purple\:50{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='auto'] .sf-c-txt-purple\:60,html.auto .sf-c-txt-purple\:60{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='auto'] .sf-c-txt-purple\:70,html.auto .sf-c-txt-purple\:70{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='auto'] .sf-c-txt-purple\:80,html.auto .sf-c-txt-purple\:80{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='auto'] .sf-c-txt-purple\:90,html.auto .sf-c-txt-purple\:90{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='auto'] .sf-c-txt-purple\:100,html.auto .sf-c-txt-purple\:100{color:hsl(var(--sf-c-txt-purple-100))}html[data-theme='auto'] .sf-c-txt-purple\:dark,html.auto .sf-c-txt-purple\:dark{color:hsl(var(--sf-c-txt-purple))}html[data-theme='auto'] .sf-c-txt-purple\:0\:dark,html.auto .sf-c-txt-purple\:0\:dark{color:hsl(var(--sf-c-txt-purple-0))}html[data-theme='auto'] .sf-c-txt-purple\:10\:dark,html.auto .sf-c-txt-purple\:10\:dark{color:hsl(var(--sf-c-txt-purple-10))}html[data-theme='auto'] .sf-c-txt-purple\:20\:dark,html.auto .sf-c-txt-purple\:20\:dark{color:hsl(var(--sf-c-txt-purple-20))}html[data-theme='auto'] .sf-c-txt-purple\:30\:dark,html.auto .sf-c-txt-purple\:30\:dark{color:hsl(var(--sf-c-txt-purple-30))}html[data-theme='auto'] .sf-c-txt-purple\:40\:dark,html.auto .sf-c-txt-purple\:40\:dark{color:hsl(var(--sf-c-txt-purple-40))}html[data-theme='auto'] .sf-c-txt-purple\:50\:dark,html.auto .sf-c-txt-purple\:50\:dark{color:hsl(var(--sf-c-txt-purple-50))}html[data-theme='auto'] .sf-c-txt-purple\:60\:dark,html.auto .sf-c-txt-purple\:60\:dark{color:hsl(var(--sf-c-txt-purple-60))}html[data-theme='auto'] .sf-c-txt-purple\:70\:dark,html.auto .sf-c-txt-purple\:70\:dark{color:hsl(var(--sf-c-txt-purple-70))}html[data-theme='auto'] .sf-c-txt-purple\:80\:dark,html.auto .sf-c-txt-purple\:80\:dark{color:hsl(var(--sf-c-txt-purple-80))}html[data-theme='auto'] .sf-c-txt-purple\:90\:dark,html.auto .sf-c-txt-purple\:90\:dark{color:hsl(var(--sf-c-txt-purple-90))}html[data-theme='auto'] .sf-c-txt-purple\:100\:dark,html.auto .sf-c-txt-purple\:100\:dark{color:hsl(var(--sf-c-txt-purple-100))}html.var[data-theme='auto'] .sf-c-purple,html.var.auto .sf-c-purple{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='auto'] .sf-c-purple\:0,html.var.auto .sf-c-purple\:0{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-purple\:10,html.var.auto .sf-c-purple\:10{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-purple\:20,html.var.auto .sf-c-purple\:20{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-purple\:30,html.var.auto .sf-c-purple\:30{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-purple\:40,html.var.auto .sf-c-purple\:40{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-purple\:50,html.var.auto .sf-c-purple\:50{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-purple\:60,html.var.auto .sf-c-purple\:60{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-purple\:70,html.var.auto .sf-c-purple\:70{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-purple\:80,html.var.auto .sf-c-purple\:80{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-purple\:90,html.var.auto .sf-c-purple\:90{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-purple\:100,html.var.auto .sf-c-purple\:100{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-purple\:dark,html.var.auto .sf-c-purple\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,75%)}html.var[data-theme='auto'] .sf-c-purple\:0\:dark,html.var.auto .sf-c-purple\:0\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-purple\:10\:dark,html.var.auto .sf-c-purple\:10\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-purple\:20\:dark,html.var.auto .sf-c-purple\:20\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-purple\:30\:dark,html.var.auto .sf-c-purple\:30\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-purple\:40\:dark,html.var.auto .sf-c-purple\:40\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-purple\:50\:dark,html.var.auto .sf-c-purple\:50\:dark{color:hsl(300,100%,10%);background:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-purple\:60\:dark,html.var.auto .sf-c-purple\:60\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-purple\:70\:dark,html.var.auto .sf-c-purple\:70\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-purple\:80\:dark,html.var.auto .sf-c-purple\:80\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-purple\:90\:dark,html.var.auto .sf-c-purple\:90\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-purple\:100\:dark,html.var.auto .sf-c-purple\:100\:dark{color:hsl(300,100%,90%);background:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple,html.auto .sf-c-txt-purple{color:hsl(300,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-purple\:0,html.auto .sf-c-txt-purple\:0{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple\:10,html.auto .sf-c-txt-purple\:10{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-purple\:20,html.auto .sf-c-txt-purple\:20{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-purple\:30,html.auto .sf-c-txt-purple\:30{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-purple\:40,html.auto .sf-c-txt-purple\:40{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-purple\:50,html.auto .sf-c-txt-purple\:50{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-purple\:60,html.auto .sf-c-txt-purple\:60{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-purple\:70,html.auto .sf-c-txt-purple\:70{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-purple\:80,html.auto .sf-c-txt-purple\:80{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-purple\:90,html.auto .sf-c-txt-purple\:90{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-purple\:100,html.auto .sf-c-txt-purple\:100{color:hsl(300,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-purple\:dark,html.auto .sf-c-txt-purple\:dark{color:hsl(300,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-purple\:0\:dark,html.auto .sf-c-txt-purple\:0\:dark{color:hsl(300,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-purple\:10\:dark,html.auto .sf-c-txt-purple\:10\:dark{color:hsl(300,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-purple\:20\:dark,html.auto .sf-c-txt-purple\:20\:dark{color:hsl(300,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-purple\:30\:dark,html.auto .sf-c-txt-purple\:30\:dark{color:hsl(300,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-purple\:40\:dark,html.auto .sf-c-txt-purple\:40\:dark{color:hsl(300,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-purple\:50\:dark,html.auto .sf-c-txt-purple\:50\:dark{color:hsl(300,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-purple\:60\:dark,html.auto .sf-c-txt-purple\:60\:dark{color:hsl(300,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-purple\:70\:dark,html.auto .sf-c-txt-purple\:70\:dark{color:hsl(300,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-purple\:80\:dark,html.auto .sf-c-txt-purple\:80\:dark{color:hsl(300,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-purple\:90\:dark,html.auto .sf-c-txt-purple\:90\:dark{color:hsl(300,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-purple\:100\:dark,html.auto .sf-c-txt-purple\:100\:dark{color:hsl(300,100%,100%)}}[class*='red']{--sf-c-red:0 100% 50%;--sf-c-red-0:0 100% 0%;--sf-c-red-10:0 100% 10%;--sf-c-red-20:0 100% 20%;--sf-c-red-30:0 100% 30%;--sf-c-red-40:0 100% 40%;--sf-c-red-50:0 100% 50%;--sf-c-red-60:0 100% 60%;--sf-c-red-70:0 100% 70%;--sf-c-red-80:0 100% 80%;--sf-c-red-90:0 100% 90%;--sf-c-red-100:0 100% 100%;--sf-c-txt-red:var(--sf-c-red);--sf-c-txt-red-0:var(--sf-c-red-0);--sf-c-txt-red-10:var(--sf-c-red-10);--sf-c-txt-red-20:var(--sf-c-red-20);--sf-c-txt-red-30:var(--sf-c-red-30);--sf-c-txt-red-40:var(--sf-c-red-40);--sf-c-txt-red-50:var(--sf-c-red-50);--sf-c-txt-red-60:var(--sf-c-red-60);--sf-c-txt-red-70:var(--sf-c-red-70);--sf-c-txt-red-80:var(--sf-c-red-80);--sf-c-txt-red-90:var(--sf-c-red-90);--sf-c-txt-red-100:var(--sf-c-red-100);--sf-dark-c-red:0 100% 50%;--sf-dark-c-red-0:0 100% 0%;--sf-dark-c-red-10:0 100% 10%;--sf-dark-c-red-20:0 100% 20%;--sf-dark-c-red-30:0 100% 30%;--sf-dark-c-red-40:0 100% 40%;--sf-dark-c-red-50:0 100% 50%;--sf-dark-c-red-60:0 100% 60%;--sf-dark-c-red-70:0 100% 70%;--sf-dark-c-red-80:0 100% 80%;--sf-dark-c-red-90:0 100% 90%;--sf-dark-c-red-100:0 100% 100%;--sf-dark-c-txt-red:var(--sf-dark-c-red);--sf-dark-c-txt-red-0:var(--sf-dark-c-red-0);--sf-dark-c-txt-red-10:var(--sf-dark-c-red-10);--sf-dark-c-txt-red-20:var(--sf-dark-c-red-20);--sf-dark-c-txt-red-30:var(--sf-dark-c-red-30);--sf-dark-c-txt-red-40:var(--sf-dark-c-red-40);--sf-dark-c-txt-red-50:var(--sf-dark-c-red-50);--sf-dark-c-txt-red-60:var(--sf-dark-c-red-60);--sf-dark-c-txt-red-70:var(--sf-dark-c-red-70);--sf-dark-c-txt-red-80:var(--sf-dark-c-red-80);--sf-dark-c-txt-red-90:var(--sf-dark-c-red-90);--sf-dark-c-txt-red-100:var(--sf-dark-c-red-100)}.sf-c-red{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}.sf-c-red\:0{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}.sf-c-red\:10{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}.sf-c-red\:20{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}.sf-c-red\:30{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}.sf-c-red\:40{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}.sf-c-red\:50{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}.sf-c-red\:60{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-60))}.sf-c-red\:70{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-70))}.sf-c-red\:80{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}.sf-c-red\:90{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}.sf-c-red\:100{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-100))}html.var .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var .sf-c-red\:10{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var .sf-c-red\:20{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var .sf-c-red\:30{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var .sf-c-red\:40{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,60%)}html.var .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,70%)}html.var .sf-c-red\:80{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var .sf-c-red\:90{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var .sf-c-red\:100{color:hsl(0,100%,10%);background:hsl(0,100%,100%)}.sf-c-txt-red{color:hsl(var(--sf-dark-c-txt-red))}.sf-c-txt-red\:0{color:hsl(var(--sf-dark-c-txt-red-100))}.sf-c-txt-red\:10{color:hsl(var(--sf-dark-c-txt-red-90))}.sf-c-txt-red\:20{color:hsl(var(--sf-dark-c-txt-red-80))}.sf-c-txt-red\:30{color:hsl(var(--sf-dark-c-txt-red-70))}.sf-c-txt-red\:40{color:hsl(var(--sf-dark-c-txt-red-60))}.sf-c-txt-red\:50{color:hsl(var(--sf-dark-c-txt-red-50))}.sf-c-txt-red\:60{color:hsl(var(--sf-dark-c-txt-red-40))}.sf-c-txt-red\:70{color:hsl(var(--sf-dark-c-txt-red-30))}.sf-c-txt-red\:80{color:hsl(var(--sf-dark-c-txt-red-20))}.sf-c-txt-red\:90{color:hsl(var(--sf-dark-c-txt-red-10))}.sf-c-txt-red\:100{color:hsl(var(--sf-dark-c-txt-red-0))}html.var .sf-c-txt-red{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:0{color:hsl(0,100%,100%)}html.var .sf-c-txt-red\:10{color:hsl(0,100%,90%)}html.var .sf-c-txt-red\:20{color:hsl(0,100%,80%)}html.var .sf-c-txt-red\:30{color:hsl(0,100%,70%)}html.var .sf-c-txt-red\:40{color:hsl(0,100%,60%)}html.var .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var .sf-c-txt-red\:60{color:hsl(0,100%,40%)}html.var .sf-c-txt-red\:70{color:hsl(0,100%,30%)}html.var .sf-c-txt-red\:80{color:hsl(0,100%,20%)}html.var .sf-c-txt-red\:90{color:hsl(0,100%,10%)}html.var .sf-c-txt-red\:100{color:hsl(0,100%,0%)}html[data-theme='dark'] .sf-c-red,html.dark .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='dark'] .sf-c-red\:0,html.dark .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='dark'] .sf-c-red\:10,html.dark .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='dark'] .sf-c-red\:20,html.dark .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='dark'] .sf-c-red\:30,html.dark .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='dark'] .sf-c-red\:40,html.dark .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='dark'] .sf-c-red\:50,html.dark .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='dark'] .sf-c-red\:60,html.dark .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='dark'] .sf-c-red\:70,html.dark .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='dark'] .sf-c-red\:80,html.dark .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='dark'] .sf-c-red\:90,html.dark .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='dark'] .sf-c-red\:100,html.dark .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='dark'] .sf-c-red\:dark,html.dark .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='dark'] .sf-c-red\:0\:dark,html.dark .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='dark'] .sf-c-red\:10\:dark,html.dark .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='dark'] .sf-c-red\:20\:dark,html.dark .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='dark'] .sf-c-red\:30\:dark,html.dark .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='dark'] .sf-c-red\:40\:dark,html.dark .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='dark'] .sf-c-red\:50\:dark,html.dark .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='dark'] .sf-c-red\:60\:dark,html.dark .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='dark'] .sf-c-red\:70\:dark,html.dark .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='dark'] .sf-c-red\:80\:dark,html.dark .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='dark'] .sf-c-red\:90\:dark,html.dark .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='dark'] .sf-c-red\:100\:dark,html.dark .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-dark-c-txt-red-0))}html[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-dark-c-txt-red-10))}html[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-dark-c-txt-red-20))}html[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-dark-c-txt-red-30))}html[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-dark-c-txt-red-40))}html[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-dark-c-txt-red-50))}html[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-dark-c-txt-red-60))}html[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-dark-c-txt-red-70))}html[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-dark-c-txt-red-80))}html[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-dark-c-txt-red-90))}html[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-dark-c-txt-red-100))}html.var[data-theme='dark'] .sf-c-red,html.var.dark .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0,html.var.dark .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10,html.var.dark .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20,html.var.dark .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30,html.var.dark .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40,html.var.dark .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50,html.var.dark .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60,html.var.dark .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70,html.var.dark .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80,html.var.dark .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90,html.var.dark .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100,html.var.dark .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-red\:dark,html.var.dark .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:0\:dark,html.var.dark .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-red\:10\:dark,html.var.dark .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-red\:20\:dark,html.var.dark .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-red\:30\:dark,html.var.dark .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-red\:40\:dark,html.var.dark .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-red\:50\:dark,html.var.dark .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-red\:60\:dark,html.var.dark .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-red\:70\:dark,html.var.dark .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-red\:80\:dark,html.var.dark .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-red\:90\:dark,html.var.dark .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-red\:100\:dark,html.var.dark .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red,html.dark .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0,html.dark .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10,html.dark .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20,html.dark .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30,html.dark .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40,html.dark .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50,html.dark .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60,html.dark .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70,html.dark .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80,html.dark .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90,html.dark .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100,html.dark .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-red\:dark,html.dark .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:0\:dark,html.dark .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-red\:10\:dark,html.dark .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-red\:20\:dark,html.dark .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-red\:30\:dark,html.dark .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-red\:40\:dark,html.dark .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-red\:50\:dark,html.dark .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-red\:60\:dark,html.dark .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-red\:70\:dark,html.dark .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-red\:80\:dark,html.dark .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-red\:90\:dark,html.dark .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-red\:100\:dark,html.dark .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-red,html.auto .sf-c-red{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red))}html[data-theme='auto'] .sf-c-red\:0,html.auto .sf-c-red\:0{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-100))}html[data-theme='auto'] .sf-c-red\:10,html.auto .sf-c-red\:10{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-90))}html[data-theme='auto'] .sf-c-red\:20,html.auto .sf-c-red\:20{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-80))}html[data-theme='auto'] .sf-c-red\:30,html.auto .sf-c-red\:30{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-70))}html[data-theme='auto'] .sf-c-red\:40,html.auto .sf-c-red\:40{color:hsl(var(--sf-dark-c-txt-red-10));background:hsl(var(--sf-dark-c-red-60))}html[data-theme='auto'] .sf-c-red\:50,html.auto .sf-c-red\:50{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-50))}html[data-theme='auto'] .sf-c-red\:60,html.auto .sf-c-red\:60{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-40))}html[data-theme='auto'] .sf-c-red\:70,html.auto .sf-c-red\:70{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-30))}html[data-theme='auto'] .sf-c-red\:80,html.auto .sf-c-red\:80{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-20))}html[data-theme='auto'] .sf-c-red\:90,html.auto .sf-c-red\:90{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-10))}html[data-theme='auto'] .sf-c-red\:100,html.auto .sf-c-red\:100{color:hsl(var(--sf-dark-c-txt-red-90));background:hsl(var(--sf-dark-c-red-0))}html[data-theme='auto'] .sf-c-red\:dark,html.auto .sf-c-red\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red))}html[data-theme='auto'] .sf-c-red\:0\:dark,html.auto .sf-c-red\:0\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-100))}html[data-theme='auto'] .sf-c-red\:10\:dark,html.auto .sf-c-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-90))}html[data-theme='auto'] .sf-c-red\:20\:dark,html.auto .sf-c-red\:20\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-80))}html[data-theme='auto'] .sf-c-red\:30\:dark,html.auto .sf-c-red\:30\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-70))}html[data-theme='auto'] .sf-c-red\:40\:dark,html.auto .sf-c-red\:40\:dark{color:hsl(var(--sf-c-txt-red-10));background:hsl(var(--sf-c-red-60))}html[data-theme='auto'] .sf-c-red\:50\:dark,html.auto .sf-c-red\:50\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-50))}html[data-theme='auto'] .sf-c-red\:60\:dark,html.auto .sf-c-red\:60\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-40))}html[data-theme='auto'] .sf-c-red\:70\:dark,html.auto .sf-c-red\:70\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-30))}html[data-theme='auto'] .sf-c-red\:80\:dark,html.auto .sf-c-red\:80\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-20))}html[data-theme='auto'] .sf-c-red\:90\:dark,html.auto .sf-c-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-10))}html[data-theme='auto'] .sf-c-red\:100\:dark,html.auto .sf-c-red\:100\:dark{color:hsl(var(--sf-c-txt-red-90));background:hsl(var(--sf-c-red-0))}html[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(var(--sf-c-txt-red-100))}html[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(var(--sf-c-txt-red))}html[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(var(--sf-c-txt-red-0))}html[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(var(--sf-c-txt-red-10))}html[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(var(--sf-c-txt-red-20))}html[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(var(--sf-c-txt-red-30))}html[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(var(--sf-c-txt-red-40))}html[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(var(--sf-c-txt-red-50))}html[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(var(--sf-c-txt-red-60))}html[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(var(--sf-c-txt-red-70))}html[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(var(--sf-c-txt-red-80))}html[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(var(--sf-c-txt-red-90))}html[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(var(--sf-c-txt-red-100))}html.var[data-theme='auto'] .sf-c-red,html.var.auto .sf-c-red{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0,html.var.auto .sf-c-red\:0{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10,html.var.auto .sf-c-red\:10{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20,html.var.auto .sf-c-red\:20{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30,html.var.auto .sf-c-red\:30{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40,html.var.auto .sf-c-red\:40{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50,html.var.auto .sf-c-red\:50{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60,html.var.auto .sf-c-red\:60{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70,html.var.auto .sf-c-red\:70{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80,html.var.auto .sf-c-red\:80{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90,html.var.auto .sf-c-red\:90{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100,html.var.auto .sf-c-red\:100{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-red\:dark,html.var.auto .sf-c-red\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:0\:dark,html.var.auto .sf-c-red\:0\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-red\:10\:dark,html.var.auto .sf-c-red\:10\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-red\:20\:dark,html.var.auto .sf-c-red\:20\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-red\:30\:dark,html.var.auto .sf-c-red\:30\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-red\:40\:dark,html.var.auto .sf-c-red\:40\:dark{color:hsl(0,100%,10%);background:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-red\:50\:dark,html.var.auto .sf-c-red\:50\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-red\:60\:dark,html.var.auto .sf-c-red\:60\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-red\:70\:dark,html.var.auto .sf-c-red\:70\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-red\:80\:dark,html.var.auto .sf-c-red\:80\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-red\:90\:dark,html.var.auto .sf-c-red\:90\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-red\:100\:dark,html.var.auto .sf-c-red\:100\:dark{color:hsl(0,100%,90%);background:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red,html.auto .sf-c-txt-red{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0,html.auto .sf-c-txt-red\:0{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10,html.auto .sf-c-txt-red\:10{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20,html.auto .sf-c-txt-red\:20{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30,html.auto .sf-c-txt-red\:30{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40,html.auto .sf-c-txt-red\:40{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50,html.auto .sf-c-txt-red\:50{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60,html.auto .sf-c-txt-red\:60{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70,html.auto .sf-c-txt-red\:70{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80,html.auto .sf-c-txt-red\:80{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90,html.auto .sf-c-txt-red\:90{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100,html.auto .sf-c-txt-red\:100{color:hsl(0,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-red\:dark,html.auto .sf-c-txt-red\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:0\:dark,html.auto .sf-c-txt-red\:0\:dark{color:hsl(0,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-red\:10\:dark,html.auto .sf-c-txt-red\:10\:dark{color:hsl(0,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-red\:20\:dark,html.auto .sf-c-txt-red\:20\:dark{color:hsl(0,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-red\:30\:dark,html.auto .sf-c-txt-red\:30\:dark{color:hsl(0,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-red\:40\:dark,html.auto .sf-c-txt-red\:40\:dark{color:hsl(0,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-red\:50\:dark,html.auto .sf-c-txt-red\:50\:dark{color:hsl(0,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-red\:60\:dark,html.auto .sf-c-txt-red\:60\:dark{color:hsl(0,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-red\:70\:dark,html.auto .sf-c-txt-red\:70\:dark{color:hsl(0,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-red\:80\:dark,html.auto .sf-c-txt-red\:80\:dark{color:hsl(0,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-red\:90\:dark,html.auto .sf-c-txt-red\:90\:dark{color:hsl(0,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-red\:100\:dark,html.auto .sf-c-txt-red\:100\:dark{color:hsl(0,100%,100%)}}[class*='silver']{--sf-c-silver:0 0% 75%;--sf-c-silver-0:0 0% 0%;--sf-c-silver-10:0 0% 10%;--sf-c-silver-20:0 0% 20%;--sf-c-silver-30:0 0% 30%;--sf-c-silver-40:0 0% 40%;--sf-c-silver-50:0 0% 50%;--sf-c-silver-60:0 0% 60%;--sf-c-silver-70:0 0% 70%;--sf-c-silver-80:0 0% 80%;--sf-c-silver-90:0 0% 90%;--sf-c-silver-100:0 0% 100%;--sf-c-txt-silver:var(--sf-c-silver);--sf-c-txt-silver-0:var(--sf-c-silver-0);--sf-c-txt-silver-10:var(--sf-c-silver-10);--sf-c-txt-silver-20:var(--sf-c-silver-20);--sf-c-txt-silver-30:var(--sf-c-silver-30);--sf-c-txt-silver-40:var(--sf-c-silver-40);--sf-c-txt-silver-50:var(--sf-c-silver-50);--sf-c-txt-silver-60:var(--sf-c-silver-60);--sf-c-txt-silver-70:var(--sf-c-silver-70);--sf-c-txt-silver-80:var(--sf-c-silver-80);--sf-c-txt-silver-90:var(--sf-c-silver-90);--sf-c-txt-silver-100:var(--sf-c-silver-100);--sf-dark-c-silver:0 0% 25%;--sf-dark-c-silver-0:0 0% 0%;--sf-dark-c-silver-10:0 0% 10%;--sf-dark-c-silver-20:0 0% 20%;--sf-dark-c-silver-30:0 0% 30%;--sf-dark-c-silver-40:0 0% 40%;--sf-dark-c-silver-50:0 0% 50%;--sf-dark-c-silver-60:0 0% 60%;--sf-dark-c-silver-70:0 0% 70%;--sf-dark-c-silver-80:0 0% 80%;--sf-dark-c-silver-90:0 0% 90%;--sf-dark-c-silver-100:0 0% 100%;--sf-dark-c-txt-silver:var(--sf-dark-c-silver);--sf-dark-c-txt-silver-0:var(--sf-dark-c-silver-0);--sf-dark-c-txt-silver-10:var(--sf-dark-c-silver-10);--sf-dark-c-txt-silver-20:var(--sf-dark-c-silver-20);--sf-dark-c-txt-silver-30:var(--sf-dark-c-silver-30);--sf-dark-c-txt-silver-40:var(--sf-dark-c-silver-40);--sf-dark-c-txt-silver-50:var(--sf-dark-c-silver-50);--sf-dark-c-txt-silver-60:var(--sf-dark-c-silver-60);--sf-dark-c-txt-silver-70:var(--sf-dark-c-silver-70);--sf-dark-c-txt-silver-80:var(--sf-dark-c-silver-80);--sf-dark-c-txt-silver-90:var(--sf-dark-c-silver-90);--sf-dark-c-txt-silver-100:var(--sf-dark-c-silver-100)}.sf-c-silver{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver))}.sf-c-silver\:0{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}.sf-c-silver\:10{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}.sf-c-silver\:20{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}.sf-c-silver\:30{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}.sf-c-silver\:40{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}.sf-c-silver\:50{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-50))}.sf-c-silver\:60{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-60))}.sf-c-silver\:70{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}.sf-c-silver\:80{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}.sf-c-silver\:90{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}.sf-c-silver\:100{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-100))}html.var .sf-c-silver{color:hsl(0,0%,10%);background:hsl(0,0%,75%)}html.var .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-silver\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-silver\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-silver\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-silver\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-silver\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-silver\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-silver\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-silver\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-silver\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-silver{color:hsl(var(--sf-dark-c-txt-silver))}.sf-c-txt-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-100))}.sf-c-txt-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-90))}.sf-c-txt-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-80))}.sf-c-txt-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-70))}.sf-c-txt-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-60))}.sf-c-txt-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-50))}.sf-c-txt-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-40))}.sf-c-txt-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-30))}.sf-c-txt-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-20))}.sf-c-txt-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-10))}.sf-c-txt-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-0))}html.var .sf-c-txt-silver{color:hsl(0,0%,25%)}html.var .sf-c-txt-silver\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-silver\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-silver\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-silver\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-silver\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-silver\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-silver\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-silver\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-silver\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-silver\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-silver,html.dark .sf-c-silver{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver))}html[data-theme='dark'] .sf-c-silver\:0,html.dark .sf-c-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-100))}html[data-theme='dark'] .sf-c-silver\:10,html.dark .sf-c-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-90))}html[data-theme='dark'] .sf-c-silver\:20,html.dark .sf-c-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-80))}html[data-theme='dark'] .sf-c-silver\:30,html.dark .sf-c-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-70))}html[data-theme='dark'] .sf-c-silver\:40,html.dark .sf-c-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-60))}html[data-theme='dark'] .sf-c-silver\:50,html.dark .sf-c-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-50))}html[data-theme='dark'] .sf-c-silver\:60,html.dark .sf-c-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-40))}html[data-theme='dark'] .sf-c-silver\:70,html.dark .sf-c-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-30))}html[data-theme='dark'] .sf-c-silver\:80,html.dark .sf-c-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-20))}html[data-theme='dark'] .sf-c-silver\:90,html.dark .sf-c-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-10))}html[data-theme='dark'] .sf-c-silver\:100,html.dark .sf-c-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-0))}html[data-theme='dark'] .sf-c-silver\:dark,html.dark .sf-c-silver\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver))}html[data-theme='dark'] .sf-c-silver\:0\:dark,html.dark .sf-c-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-100))}html[data-theme='dark'] .sf-c-silver\:10\:dark,html.dark .sf-c-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}html[data-theme='dark'] .sf-c-silver\:20\:dark,html.dark .sf-c-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}html[data-theme='dark'] .sf-c-silver\:30\:dark,html.dark .sf-c-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}html[data-theme='dark'] .sf-c-silver\:40\:dark,html.dark .sf-c-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-60))}html[data-theme='dark'] .sf-c-silver\:50\:dark,html.dark .sf-c-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-50))}html[data-theme='dark'] .sf-c-silver\:60\:dark,html.dark .sf-c-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}html[data-theme='dark'] .sf-c-silver\:70\:dark,html.dark .sf-c-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}html[data-theme='dark'] .sf-c-silver\:80\:dark,html.dark .sf-c-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}html[data-theme='dark'] .sf-c-silver\:90\:dark,html.dark .sf-c-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}html[data-theme='dark'] .sf-c-silver\:100\:dark,html.dark .sf-c-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}html[data-theme='dark'] .sf-c-txt-silver,html.dark .sf-c-txt-silver{color:hsl(var(--sf-c-txt-silver))}html[data-theme='dark'] .sf-c-txt-silver\:0,html.dark .sf-c-txt-silver\:0{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='dark'] .sf-c-txt-silver\:10,html.dark .sf-c-txt-silver\:10{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='dark'] .sf-c-txt-silver\:20,html.dark .sf-c-txt-silver\:20{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='dark'] .sf-c-txt-silver\:30,html.dark .sf-c-txt-silver\:30{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='dark'] .sf-c-txt-silver\:40,html.dark .sf-c-txt-silver\:40{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='dark'] .sf-c-txt-silver\:50,html.dark .sf-c-txt-silver\:50{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='dark'] .sf-c-txt-silver\:60,html.dark .sf-c-txt-silver\:60{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='dark'] .sf-c-txt-silver\:70,html.dark .sf-c-txt-silver\:70{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='dark'] .sf-c-txt-silver\:80,html.dark .sf-c-txt-silver\:80{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='dark'] .sf-c-txt-silver\:90,html.dark .sf-c-txt-silver\:90{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='dark'] .sf-c-txt-silver\:100,html.dark .sf-c-txt-silver\:100{color:hsl(var(--sf-c-txt-silver-100))}html[data-theme='dark'] .sf-c-txt-silver\:dark,html.dark .sf-c-txt-silver\:dark{color:hsl(var(--sf-c-txt-silver))}html[data-theme='dark'] .sf-c-txt-silver\:0\:dark,html.dark .sf-c-txt-silver\:0\:dark{color:hsl(var(--sf-dark-c-txt-silver-0))}html[data-theme='dark'] .sf-c-txt-silver\:10\:dark,html.dark .sf-c-txt-silver\:10\:dark{color:hsl(var(--sf-dark-c-txt-silver-10))}html[data-theme='dark'] .sf-c-txt-silver\:20\:dark,html.dark .sf-c-txt-silver\:20\:dark{color:hsl(var(--sf-dark-c-txt-silver-20))}html[data-theme='dark'] .sf-c-txt-silver\:30\:dark,html.dark .sf-c-txt-silver\:30\:dark{color:hsl(var(--sf-dark-c-txt-silver-30))}html[data-theme='dark'] .sf-c-txt-silver\:40\:dark,html.dark .sf-c-txt-silver\:40\:dark{color:hsl(var(--sf-dark-c-txt-silver-40))}html[data-theme='dark'] .sf-c-txt-silver\:50\:dark,html.dark .sf-c-txt-silver\:50\:dark{color:hsl(var(--sf-dark-c-txt-silver-50))}html[data-theme='dark'] .sf-c-txt-silver\:60\:dark,html.dark .sf-c-txt-silver\:60\:dark{color:hsl(var(--sf-dark-c-txt-silver-60))}html[data-theme='dark'] .sf-c-txt-silver\:70\:dark,html.dark .sf-c-txt-silver\:70\:dark{color:hsl(var(--sf-dark-c-txt-silver-70))}html[data-theme='dark'] .sf-c-txt-silver\:80\:dark,html.dark .sf-c-txt-silver\:80\:dark{color:hsl(var(--sf-dark-c-txt-silver-80))}html[data-theme='dark'] .sf-c-txt-silver\:90\:dark,html.dark .sf-c-txt-silver\:90\:dark{color:hsl(var(--sf-dark-c-txt-silver-90))}html[data-theme='dark'] .sf-c-txt-silver\:100\:dark,html.dark .sf-c-txt-silver\:100\:dark{color:hsl(var(--sf-dark-c-txt-silver-100))}html.var[data-theme='dark'] .sf-c-silver,html.var.dark .sf-c-silver{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='dark'] .sf-c-silver\:0,html.var.dark .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-silver\:10,html.var.dark .sf-c-silver\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-silver\:20,html.var.dark .sf-c-silver\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-silver\:30,html.var.dark .sf-c-silver\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-silver\:40,html.var.dark .sf-c-silver\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-silver\:50,html.var.dark .sf-c-silver\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-silver\:60,html.var.dark .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-silver\:70,html.var.dark .sf-c-silver\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-silver\:80,html.var.dark .sf-c-silver\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-silver\:90,html.var.dark .sf-c-silver\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-silver\:100,html.var.dark .sf-c-silver\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-silver\:dark,html.var.dark .sf-c-silver\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='dark'] .sf-c-silver\:0\:dark,html.var.dark .sf-c-silver\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-silver\:10\:dark,html.var.dark .sf-c-silver\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-silver\:20\:dark,html.var.dark .sf-c-silver\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-silver\:30\:dark,html.var.dark .sf-c-silver\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-silver\:40\:dark,html.var.dark .sf-c-silver\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-silver\:50\:dark,html.var.dark .sf-c-silver\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-silver\:60\:dark,html.var.dark .sf-c-silver\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-silver\:70\:dark,html.var.dark .sf-c-silver\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-silver\:80\:dark,html.var.dark .sf-c-silver\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-silver\:90\:dark,html.var.dark .sf-c-silver\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-silver\:100\:dark,html.var.dark .sf-c-silver\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver,html.dark .sf-c-txt-silver{color:hsl(0,0%,75%)}html.var[data-theme='dark'] .sf-c-txt-silver\:0,html.dark .sf-c-txt-silver\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver\:10,html.dark .sf-c-txt-silver\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-silver\:20,html.dark .sf-c-txt-silver\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-silver\:30,html.dark .sf-c-txt-silver\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-silver\:40,html.dark .sf-c-txt-silver\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-silver\:50,html.dark .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-silver\:60,html.dark .sf-c-txt-silver\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-silver\:70,html.dark .sf-c-txt-silver\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-silver\:80,html.dark .sf-c-txt-silver\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-silver\:90,html.dark .sf-c-txt-silver\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-silver\:100,html.dark .sf-c-txt-silver\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-silver\:dark,html.dark .sf-c-txt-silver\:dark{color:hsl(0,0%,75%)}html.var[data-theme='dark'] .sf-c-txt-silver\:0\:dark,html.dark .sf-c-txt-silver\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-silver\:10\:dark,html.dark .sf-c-txt-silver\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-silver\:20\:dark,html.dark .sf-c-txt-silver\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-silver\:30\:dark,html.dark .sf-c-txt-silver\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-silver\:40\:dark,html.dark .sf-c-txt-silver\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-silver\:50\:dark,html.dark .sf-c-txt-silver\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-silver\:60\:dark,html.dark .sf-c-txt-silver\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-silver\:70\:dark,html.dark .sf-c-txt-silver\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-silver\:80\:dark,html.dark .sf-c-txt-silver\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-silver\:90\:dark,html.dark .sf-c-txt-silver\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-silver\:100\:dark,html.dark .sf-c-txt-silver\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-silver,html.auto .sf-c-silver{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver))}html[data-theme='auto'] .sf-c-silver\:0,html.auto .sf-c-silver\:0{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-100))}html[data-theme='auto'] .sf-c-silver\:10,html.auto .sf-c-silver\:10{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-90))}html[data-theme='auto'] .sf-c-silver\:20,html.auto .sf-c-silver\:20{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-80))}html[data-theme='auto'] .sf-c-silver\:30,html.auto .sf-c-silver\:30{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-70))}html[data-theme='auto'] .sf-c-silver\:40,html.auto .sf-c-silver\:40{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-60))}html[data-theme='auto'] .sf-c-silver\:50,html.auto .sf-c-silver\:50{color:hsl(var(--sf-dark-c-txt-silver-10));background:hsl(var(--sf-dark-c-silver-50))}html[data-theme='auto'] .sf-c-silver\:60,html.auto .sf-c-silver\:60{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-40))}html[data-theme='auto'] .sf-c-silver\:70,html.auto .sf-c-silver\:70{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-30))}html[data-theme='auto'] .sf-c-silver\:80,html.auto .sf-c-silver\:80{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-20))}html[data-theme='auto'] .sf-c-silver\:90,html.auto .sf-c-silver\:90{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-10))}html[data-theme='auto'] .sf-c-silver\:100,html.auto .sf-c-silver\:100{color:hsl(var(--sf-dark-c-txt-silver-90));background:hsl(var(--sf-dark-c-silver-0))}html[data-theme='auto'] .sf-c-silver\:dark,html.auto .sf-c-silver\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver))}html[data-theme='auto'] .sf-c-silver\:0\:dark,html.auto .sf-c-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-100))}html[data-theme='auto'] .sf-c-silver\:10\:dark,html.auto .sf-c-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-90))}html[data-theme='auto'] .sf-c-silver\:20\:dark,html.auto .sf-c-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-80))}html[data-theme='auto'] .sf-c-silver\:30\:dark,html.auto .sf-c-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-70))}html[data-theme='auto'] .sf-c-silver\:40\:dark,html.auto .sf-c-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-60))}html[data-theme='auto'] .sf-c-silver\:50\:dark,html.auto .sf-c-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-10));background:hsl(var(--sf-c-silver-50))}html[data-theme='auto'] .sf-c-silver\:60\:dark,html.auto .sf-c-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-40))}html[data-theme='auto'] .sf-c-silver\:70\:dark,html.auto .sf-c-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-30))}html[data-theme='auto'] .sf-c-silver\:80\:dark,html.auto .sf-c-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-20))}html[data-theme='auto'] .sf-c-silver\:90\:dark,html.auto .sf-c-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-10))}html[data-theme='auto'] .sf-c-silver\:100\:dark,html.auto .sf-c-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-90));background:hsl(var(--sf-c-silver-0))}html[data-theme='auto'] .sf-c-txt-silver,html.auto .sf-c-txt-silver{color:hsl(var(--sf-c-txt-silver))}html[data-theme='auto'] .sf-c-txt-silver\:0,html.auto .sf-c-txt-silver\:0{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='auto'] .sf-c-txt-silver\:10,html.auto .sf-c-txt-silver\:10{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='auto'] .sf-c-txt-silver\:20,html.auto .sf-c-txt-silver\:20{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='auto'] .sf-c-txt-silver\:30,html.auto .sf-c-txt-silver\:30{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='auto'] .sf-c-txt-silver\:40,html.auto .sf-c-txt-silver\:40{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='auto'] .sf-c-txt-silver\:50,html.auto .sf-c-txt-silver\:50{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='auto'] .sf-c-txt-silver\:60,html.auto .sf-c-txt-silver\:60{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='auto'] .sf-c-txt-silver\:70,html.auto .sf-c-txt-silver\:70{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='auto'] .sf-c-txt-silver\:80,html.auto .sf-c-txt-silver\:80{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='auto'] .sf-c-txt-silver\:90,html.auto .sf-c-txt-silver\:90{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='auto'] .sf-c-txt-silver\:100,html.auto .sf-c-txt-silver\:100{color:hsl(var(--sf-c-txt-silver-100))}html[data-theme='auto'] .sf-c-txt-silver\:dark,html.auto .sf-c-txt-silver\:dark{color:hsl(var(--sf-c-txt-silver))}html[data-theme='auto'] .sf-c-txt-silver\:0\:dark,html.auto .sf-c-txt-silver\:0\:dark{color:hsl(var(--sf-c-txt-silver-0))}html[data-theme='auto'] .sf-c-txt-silver\:10\:dark,html.auto .sf-c-txt-silver\:10\:dark{color:hsl(var(--sf-c-txt-silver-10))}html[data-theme='auto'] .sf-c-txt-silver\:20\:dark,html.auto .sf-c-txt-silver\:20\:dark{color:hsl(var(--sf-c-txt-silver-20))}html[data-theme='auto'] .sf-c-txt-silver\:30\:dark,html.auto .sf-c-txt-silver\:30\:dark{color:hsl(var(--sf-c-txt-silver-30))}html[data-theme='auto'] .sf-c-txt-silver\:40\:dark,html.auto .sf-c-txt-silver\:40\:dark{color:hsl(var(--sf-c-txt-silver-40))}html[data-theme='auto'] .sf-c-txt-silver\:50\:dark,html.auto .sf-c-txt-silver\:50\:dark{color:hsl(var(--sf-c-txt-silver-50))}html[data-theme='auto'] .sf-c-txt-silver\:60\:dark,html.auto .sf-c-txt-silver\:60\:dark{color:hsl(var(--sf-c-txt-silver-60))}html[data-theme='auto'] .sf-c-txt-silver\:70\:dark,html.auto .sf-c-txt-silver\:70\:dark{color:hsl(var(--sf-c-txt-silver-70))}html[data-theme='auto'] .sf-c-txt-silver\:80\:dark,html.auto .sf-c-txt-silver\:80\:dark{color:hsl(var(--sf-c-txt-silver-80))}html[data-theme='auto'] .sf-c-txt-silver\:90\:dark,html.auto .sf-c-txt-silver\:90\:dark{color:hsl(var(--sf-c-txt-silver-90))}html[data-theme='auto'] .sf-c-txt-silver\:100\:dark,html.auto .sf-c-txt-silver\:100\:dark{color:hsl(var(--sf-c-txt-silver-100))}html.var[data-theme='auto'] .sf-c-silver,html.var.auto .sf-c-silver{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='auto'] .sf-c-silver\:0,html.var.auto .sf-c-silver\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-silver\:10,html.var.auto .sf-c-silver\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-silver\:20,html.var.auto .sf-c-silver\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-silver\:30,html.var.auto .sf-c-silver\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-silver\:40,html.var.auto .sf-c-silver\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-silver\:50,html.var.auto .sf-c-silver\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-silver\:60,html.var.auto .sf-c-silver\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-silver\:70,html.var.auto .sf-c-silver\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-silver\:80,html.var.auto .sf-c-silver\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-silver\:90,html.var.auto .sf-c-silver\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-silver\:100,html.var.auto .sf-c-silver\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-silver\:dark,html.var.auto .sf-c-silver\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,25%)}html.var[data-theme='auto'] .sf-c-silver\:0\:dark,html.var.auto .sf-c-silver\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-silver\:10\:dark,html.var.auto .sf-c-silver\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-silver\:20\:dark,html.var.auto .sf-c-silver\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-silver\:30\:dark,html.var.auto .sf-c-silver\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-silver\:40\:dark,html.var.auto .sf-c-silver\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-silver\:50\:dark,html.var.auto .sf-c-silver\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-silver\:60\:dark,html.var.auto .sf-c-silver\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-silver\:70\:dark,html.var.auto .sf-c-silver\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-silver\:80\:dark,html.var.auto .sf-c-silver\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-silver\:90\:dark,html.var.auto .sf-c-silver\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-silver\:100\:dark,html.var.auto .sf-c-silver\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver,html.auto .sf-c-txt-silver{color:hsl(0,0%,75%)}html.var[data-theme='auto'] .sf-c-txt-silver\:0,html.auto .sf-c-txt-silver\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver\:10,html.auto .sf-c-txt-silver\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-silver\:20,html.auto .sf-c-txt-silver\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-silver\:30,html.auto .sf-c-txt-silver\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-silver\:40,html.auto .sf-c-txt-silver\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-silver\:50,html.auto .sf-c-txt-silver\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-silver\:60,html.auto .sf-c-txt-silver\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-silver\:70,html.auto .sf-c-txt-silver\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-silver\:80,html.auto .sf-c-txt-silver\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-silver\:90,html.auto .sf-c-txt-silver\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-silver\:100,html.auto .sf-c-txt-silver\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-silver\:dark,html.auto .sf-c-txt-silver\:dark{color:hsl(0,0%,75%)}html.var[data-theme='auto'] .sf-c-txt-silver\:0\:dark,html.auto .sf-c-txt-silver\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-silver\:10\:dark,html.auto .sf-c-txt-silver\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-silver\:20\:dark,html.auto .sf-c-txt-silver\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-silver\:30\:dark,html.auto .sf-c-txt-silver\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-silver\:40\:dark,html.auto .sf-c-txt-silver\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-silver\:50\:dark,html.auto .sf-c-txt-silver\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-silver\:60\:dark,html.auto .sf-c-txt-silver\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-silver\:70\:dark,html.auto .sf-c-txt-silver\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-silver\:80\:dark,html.auto .sf-c-txt-silver\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-silver\:90\:dark,html.auto .sf-c-txt-silver\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-silver\:100\:dark,html.auto .sf-c-txt-silver\:100\:dark{color:hsl(0,0%,100%)}}[class*='teal']{--sf-c-teal:180 100% 25%;--sf-c-teal-0:180 100% 0%;--sf-c-teal-10:180 100% 10%;--sf-c-teal-20:180 100% 20%;--sf-c-teal-30:180 100% 30%;--sf-c-teal-40:180 100% 40%;--sf-c-teal-50:180 100% 50%;--sf-c-teal-60:180 100% 60%;--sf-c-teal-70:180 100% 70%;--sf-c-teal-80:180 100% 80%;--sf-c-teal-90:180 100% 90%;--sf-c-teal-100:180 100% 100%;--sf-c-txt-teal:var(--sf-c-teal);--sf-c-txt-teal-0:var(--sf-c-teal-0);--sf-c-txt-teal-10:var(--sf-c-teal-10);--sf-c-txt-teal-20:var(--sf-c-teal-20);--sf-c-txt-teal-30:var(--sf-c-teal-30);--sf-c-txt-teal-40:var(--sf-c-teal-40);--sf-c-txt-teal-50:var(--sf-c-teal-50);--sf-c-txt-teal-60:var(--sf-c-teal-60);--sf-c-txt-teal-70:var(--sf-c-teal-70);--sf-c-txt-teal-80:var(--sf-c-teal-80);--sf-c-txt-teal-90:var(--sf-c-teal-90);--sf-c-txt-teal-100:var(--sf-c-teal-100);--sf-dark-c-teal:180 100% 75%;--sf-dark-c-teal-0:180 100% 0%;--sf-dark-c-teal-10:180 100% 10%;--sf-dark-c-teal-20:180 100% 20%;--sf-dark-c-teal-30:180 100% 30%;--sf-dark-c-teal-40:180 100% 40%;--sf-dark-c-teal-50:180 100% 50%;--sf-dark-c-teal-60:180 100% 60%;--sf-dark-c-teal-70:180 100% 70%;--sf-dark-c-teal-80:180 100% 80%;--sf-dark-c-teal-90:180 100% 90%;--sf-dark-c-teal-100:180 100% 100%;--sf-dark-c-txt-teal:var(--sf-dark-c-teal);--sf-dark-c-txt-teal-0:var(--sf-dark-c-teal-0);--sf-dark-c-txt-teal-10:var(--sf-dark-c-teal-10);--sf-dark-c-txt-teal-20:var(--sf-dark-c-teal-20);--sf-dark-c-txt-teal-30:var(--sf-dark-c-teal-30);--sf-dark-c-txt-teal-40:var(--sf-dark-c-teal-40);--sf-dark-c-txt-teal-50:var(--sf-dark-c-teal-50);--sf-dark-c-txt-teal-60:var(--sf-dark-c-teal-60);--sf-dark-c-txt-teal-70:var(--sf-dark-c-teal-70);--sf-dark-c-txt-teal-80:var(--sf-dark-c-teal-80);--sf-dark-c-txt-teal-90:var(--sf-dark-c-teal-90);--sf-dark-c-txt-teal-100:var(--sf-dark-c-teal-100)}.sf-c-teal{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal))}.sf-c-teal\:0{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}.sf-c-teal\:10{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}.sf-c-teal\:20{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}.sf-c-teal\:30{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-30))}.sf-c-teal\:40{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-40))}.sf-c-teal\:50{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}.sf-c-teal\:60{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}.sf-c-teal\:70{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}.sf-c-teal\:80{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}.sf-c-teal\:90{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}.sf-c-teal\:100{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-100))}html.var .sf-c-teal{color:hsl(180,100%,90%);background:hsl(180,100%,25%)}html.var .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var .sf-c-teal\:10{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var .sf-c-teal\:20{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var .sf-c-teal\:30{color:hsl(180,100%,90%);background:hsl(180,100%,30%)}html.var .sf-c-teal\:40{color:hsl(180,100%,90%);background:hsl(180,100%,40%)}html.var .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var .sf-c-teal\:80{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var .sf-c-teal\:90{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var .sf-c-teal\:100{color:hsl(180,100%,10%);background:hsl(180,100%,100%)}.sf-c-txt-teal{color:hsl(var(--sf-dark-c-txt-teal))}.sf-c-txt-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-100))}.sf-c-txt-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-90))}.sf-c-txt-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-80))}.sf-c-txt-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-70))}.sf-c-txt-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-60))}.sf-c-txt-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-50))}.sf-c-txt-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-40))}.sf-c-txt-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-30))}.sf-c-txt-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-20))}.sf-c-txt-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-10))}.sf-c-txt-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-0))}html.var .sf-c-txt-teal{color:hsl(180,100%,75%)}html.var .sf-c-txt-teal\:0{color:hsl(180,100%,100%)}html.var .sf-c-txt-teal\:10{color:hsl(180,100%,90%)}html.var .sf-c-txt-teal\:20{color:hsl(180,100%,80%)}html.var .sf-c-txt-teal\:30{color:hsl(180,100%,70%)}html.var .sf-c-txt-teal\:40{color:hsl(180,100%,60%)}html.var .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var .sf-c-txt-teal\:60{color:hsl(180,100%,40%)}html.var .sf-c-txt-teal\:70{color:hsl(180,100%,30%)}html.var .sf-c-txt-teal\:80{color:hsl(180,100%,20%)}html.var .sf-c-txt-teal\:90{color:hsl(180,100%,10%)}html.var .sf-c-txt-teal\:100{color:hsl(180,100%,0%)}html[data-theme='dark'] .sf-c-teal,html.dark .sf-c-teal{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal))}html[data-theme='dark'] .sf-c-teal\:0,html.dark .sf-c-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-100))}html[data-theme='dark'] .sf-c-teal\:10,html.dark .sf-c-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-90))}html[data-theme='dark'] .sf-c-teal\:20,html.dark .sf-c-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-80))}html[data-theme='dark'] .sf-c-teal\:30,html.dark .sf-c-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-70))}html[data-theme='dark'] .sf-c-teal\:40,html.dark .sf-c-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-60))}html[data-theme='dark'] .sf-c-teal\:50,html.dark .sf-c-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-50))}html[data-theme='dark'] .sf-c-teal\:60,html.dark .sf-c-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-40))}html[data-theme='dark'] .sf-c-teal\:70,html.dark .sf-c-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-30))}html[data-theme='dark'] .sf-c-teal\:80,html.dark .sf-c-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-20))}html[data-theme='dark'] .sf-c-teal\:90,html.dark .sf-c-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-10))}html[data-theme='dark'] .sf-c-teal\:100,html.dark .sf-c-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-0))}html[data-theme='dark'] .sf-c-teal\:dark,html.dark .sf-c-teal\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal))}html[data-theme='dark'] .sf-c-teal\:0\:dark,html.dark .sf-c-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-100))}html[data-theme='dark'] .sf-c-teal\:10\:dark,html.dark .sf-c-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}html[data-theme='dark'] .sf-c-teal\:20\:dark,html.dark .sf-c-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}html[data-theme='dark'] .sf-c-teal\:30\:dark,html.dark .sf-c-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}html[data-theme='dark'] .sf-c-teal\:40\:dark,html.dark .sf-c-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}html[data-theme='dark'] .sf-c-teal\:50\:dark,html.dark .sf-c-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}html[data-theme='dark'] .sf-c-teal\:60\:dark,html.dark .sf-c-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-40))}html[data-theme='dark'] .sf-c-teal\:70\:dark,html.dark .sf-c-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-30))}html[data-theme='dark'] .sf-c-teal\:80\:dark,html.dark .sf-c-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}html[data-theme='dark'] .sf-c-teal\:90\:dark,html.dark .sf-c-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}html[data-theme='dark'] .sf-c-teal\:100\:dark,html.dark .sf-c-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}html[data-theme='dark'] .sf-c-txt-teal,html.dark .sf-c-txt-teal{color:hsl(var(--sf-c-txt-teal))}html[data-theme='dark'] .sf-c-txt-teal\:0,html.dark .sf-c-txt-teal\:0{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='dark'] .sf-c-txt-teal\:10,html.dark .sf-c-txt-teal\:10{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='dark'] .sf-c-txt-teal\:20,html.dark .sf-c-txt-teal\:20{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='dark'] .sf-c-txt-teal\:30,html.dark .sf-c-txt-teal\:30{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='dark'] .sf-c-txt-teal\:40,html.dark .sf-c-txt-teal\:40{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='dark'] .sf-c-txt-teal\:50,html.dark .sf-c-txt-teal\:50{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='dark'] .sf-c-txt-teal\:60,html.dark .sf-c-txt-teal\:60{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='dark'] .sf-c-txt-teal\:70,html.dark .sf-c-txt-teal\:70{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='dark'] .sf-c-txt-teal\:80,html.dark .sf-c-txt-teal\:80{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='dark'] .sf-c-txt-teal\:90,html.dark .sf-c-txt-teal\:90{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='dark'] .sf-c-txt-teal\:100,html.dark .sf-c-txt-teal\:100{color:hsl(var(--sf-c-txt-teal-100))}html[data-theme='dark'] .sf-c-txt-teal\:dark,html.dark .sf-c-txt-teal\:dark{color:hsl(var(--sf-c-txt-teal))}html[data-theme='dark'] .sf-c-txt-teal\:0\:dark,html.dark .sf-c-txt-teal\:0\:dark{color:hsl(var(--sf-dark-c-txt-teal-0))}html[data-theme='dark'] .sf-c-txt-teal\:10\:dark,html.dark .sf-c-txt-teal\:10\:dark{color:hsl(var(--sf-dark-c-txt-teal-10))}html[data-theme='dark'] .sf-c-txt-teal\:20\:dark,html.dark .sf-c-txt-teal\:20\:dark{color:hsl(var(--sf-dark-c-txt-teal-20))}html[data-theme='dark'] .sf-c-txt-teal\:30\:dark,html.dark .sf-c-txt-teal\:30\:dark{color:hsl(var(--sf-dark-c-txt-teal-30))}html[data-theme='dark'] .sf-c-txt-teal\:40\:dark,html.dark .sf-c-txt-teal\:40\:dark{color:hsl(var(--sf-dark-c-txt-teal-40))}html[data-theme='dark'] .sf-c-txt-teal\:50\:dark,html.dark .sf-c-txt-teal\:50\:dark{color:hsl(var(--sf-dark-c-txt-teal-50))}html[data-theme='dark'] .sf-c-txt-teal\:60\:dark,html.dark .sf-c-txt-teal\:60\:dark{color:hsl(var(--sf-dark-c-txt-teal-60))}html[data-theme='dark'] .sf-c-txt-teal\:70\:dark,html.dark .sf-c-txt-teal\:70\:dark{color:hsl(var(--sf-dark-c-txt-teal-70))}html[data-theme='dark'] .sf-c-txt-teal\:80\:dark,html.dark .sf-c-txt-teal\:80\:dark{color:hsl(var(--sf-dark-c-txt-teal-80))}html[data-theme='dark'] .sf-c-txt-teal\:90\:dark,html.dark .sf-c-txt-teal\:90\:dark{color:hsl(var(--sf-dark-c-txt-teal-90))}html[data-theme='dark'] .sf-c-txt-teal\:100\:dark,html.dark .sf-c-txt-teal\:100\:dark{color:hsl(var(--sf-dark-c-txt-teal-100))}html.var[data-theme='dark'] .sf-c-teal,html.var.dark .sf-c-teal{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='dark'] .sf-c-teal\:0,html.var.dark .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-teal\:10,html.var.dark .sf-c-teal\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-teal\:20,html.var.dark .sf-c-teal\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-teal\:30,html.var.dark .sf-c-teal\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-teal\:40,html.var.dark .sf-c-teal\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-teal\:50,html.var.dark .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-teal\:60,html.var.dark .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-teal\:70,html.var.dark .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-teal\:80,html.var.dark .sf-c-teal\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-teal\:90,html.var.dark .sf-c-teal\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-teal\:100,html.var.dark .sf-c-teal\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-teal\:dark,html.var.dark .sf-c-teal\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='dark'] .sf-c-teal\:0\:dark,html.var.dark .sf-c-teal\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-teal\:10\:dark,html.var.dark .sf-c-teal\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-teal\:20\:dark,html.var.dark .sf-c-teal\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-teal\:30\:dark,html.var.dark .sf-c-teal\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-teal\:40\:dark,html.var.dark .sf-c-teal\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-teal\:50\:dark,html.var.dark .sf-c-teal\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-teal\:60\:dark,html.var.dark .sf-c-teal\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-teal\:70\:dark,html.var.dark .sf-c-teal\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-teal\:80\:dark,html.var.dark .sf-c-teal\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-teal\:90\:dark,html.var.dark .sf-c-teal\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-teal\:100\:dark,html.var.dark .sf-c-teal\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal,html.dark .sf-c-txt-teal{color:hsl(180,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-teal\:0,html.dark .sf-c-txt-teal\:0{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal\:10,html.dark .sf-c-txt-teal\:10{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-teal\:20,html.dark .sf-c-txt-teal\:20{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-teal\:30,html.dark .sf-c-txt-teal\:30{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-teal\:40,html.dark .sf-c-txt-teal\:40{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-teal\:50,html.dark .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-teal\:60,html.dark .sf-c-txt-teal\:60{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-teal\:70,html.dark .sf-c-txt-teal\:70{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-teal\:80,html.dark .sf-c-txt-teal\:80{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-teal\:90,html.dark .sf-c-txt-teal\:90{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-teal\:100,html.dark .sf-c-txt-teal\:100{color:hsl(180,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-teal\:dark,html.dark .sf-c-txt-teal\:dark{color:hsl(180,100%,25%)}html.var[data-theme='dark'] .sf-c-txt-teal\:0\:dark,html.dark .sf-c-txt-teal\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-teal\:10\:dark,html.dark .sf-c-txt-teal\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-teal\:20\:dark,html.dark .sf-c-txt-teal\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-teal\:30\:dark,html.dark .sf-c-txt-teal\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-teal\:40\:dark,html.dark .sf-c-txt-teal\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-teal\:50\:dark,html.dark .sf-c-txt-teal\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-teal\:60\:dark,html.dark .sf-c-txt-teal\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-teal\:70\:dark,html.dark .sf-c-txt-teal\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-teal\:80\:dark,html.dark .sf-c-txt-teal\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-teal\:90\:dark,html.dark .sf-c-txt-teal\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-teal\:100\:dark,html.dark .sf-c-txt-teal\:100\:dark{color:hsl(180,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-teal,html.auto .sf-c-teal{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal))}html[data-theme='auto'] .sf-c-teal\:0,html.auto .sf-c-teal\:0{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-100))}html[data-theme='auto'] .sf-c-teal\:10,html.auto .sf-c-teal\:10{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-90))}html[data-theme='auto'] .sf-c-teal\:20,html.auto .sf-c-teal\:20{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-80))}html[data-theme='auto'] .sf-c-teal\:30,html.auto .sf-c-teal\:30{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-70))}html[data-theme='auto'] .sf-c-teal\:40,html.auto .sf-c-teal\:40{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-60))}html[data-theme='auto'] .sf-c-teal\:50,html.auto .sf-c-teal\:50{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-50))}html[data-theme='auto'] .sf-c-teal\:60,html.auto .sf-c-teal\:60{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-40))}html[data-theme='auto'] .sf-c-teal\:70,html.auto .sf-c-teal\:70{color:hsl(var(--sf-dark-c-txt-teal-10));background:hsl(var(--sf-dark-c-teal-30))}html[data-theme='auto'] .sf-c-teal\:80,html.auto .sf-c-teal\:80{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-20))}html[data-theme='auto'] .sf-c-teal\:90,html.auto .sf-c-teal\:90{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-10))}html[data-theme='auto'] .sf-c-teal\:100,html.auto .sf-c-teal\:100{color:hsl(var(--sf-dark-c-txt-teal-90));background:hsl(var(--sf-dark-c-teal-0))}html[data-theme='auto'] .sf-c-teal\:dark,html.auto .sf-c-teal\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal))}html[data-theme='auto'] .sf-c-teal\:0\:dark,html.auto .sf-c-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-100))}html[data-theme='auto'] .sf-c-teal\:10\:dark,html.auto .sf-c-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-90))}html[data-theme='auto'] .sf-c-teal\:20\:dark,html.auto .sf-c-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-80))}html[data-theme='auto'] .sf-c-teal\:30\:dark,html.auto .sf-c-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-70))}html[data-theme='auto'] .sf-c-teal\:40\:dark,html.auto .sf-c-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-60))}html[data-theme='auto'] .sf-c-teal\:50\:dark,html.auto .sf-c-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-50))}html[data-theme='auto'] .sf-c-teal\:60\:dark,html.auto .sf-c-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-40))}html[data-theme='auto'] .sf-c-teal\:70\:dark,html.auto .sf-c-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-10));background:hsl(var(--sf-c-teal-30))}html[data-theme='auto'] .sf-c-teal\:80\:dark,html.auto .sf-c-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-20))}html[data-theme='auto'] .sf-c-teal\:90\:dark,html.auto .sf-c-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-10))}html[data-theme='auto'] .sf-c-teal\:100\:dark,html.auto .sf-c-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-90));background:hsl(var(--sf-c-teal-0))}html[data-theme='auto'] .sf-c-txt-teal,html.auto .sf-c-txt-teal{color:hsl(var(--sf-c-txt-teal))}html[data-theme='auto'] .sf-c-txt-teal\:0,html.auto .sf-c-txt-teal\:0{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='auto'] .sf-c-txt-teal\:10,html.auto .sf-c-txt-teal\:10{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='auto'] .sf-c-txt-teal\:20,html.auto .sf-c-txt-teal\:20{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='auto'] .sf-c-txt-teal\:30,html.auto .sf-c-txt-teal\:30{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='auto'] .sf-c-txt-teal\:40,html.auto .sf-c-txt-teal\:40{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='auto'] .sf-c-txt-teal\:50,html.auto .sf-c-txt-teal\:50{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='auto'] .sf-c-txt-teal\:60,html.auto .sf-c-txt-teal\:60{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='auto'] .sf-c-txt-teal\:70,html.auto .sf-c-txt-teal\:70{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='auto'] .sf-c-txt-teal\:80,html.auto .sf-c-txt-teal\:80{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='auto'] .sf-c-txt-teal\:90,html.auto .sf-c-txt-teal\:90{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='auto'] .sf-c-txt-teal\:100,html.auto .sf-c-txt-teal\:100{color:hsl(var(--sf-c-txt-teal-100))}html[data-theme='auto'] .sf-c-txt-teal\:dark,html.auto .sf-c-txt-teal\:dark{color:hsl(var(--sf-c-txt-teal))}html[data-theme='auto'] .sf-c-txt-teal\:0\:dark,html.auto .sf-c-txt-teal\:0\:dark{color:hsl(var(--sf-c-txt-teal-0))}html[data-theme='auto'] .sf-c-txt-teal\:10\:dark,html.auto .sf-c-txt-teal\:10\:dark{color:hsl(var(--sf-c-txt-teal-10))}html[data-theme='auto'] .sf-c-txt-teal\:20\:dark,html.auto .sf-c-txt-teal\:20\:dark{color:hsl(var(--sf-c-txt-teal-20))}html[data-theme='auto'] .sf-c-txt-teal\:30\:dark,html.auto .sf-c-txt-teal\:30\:dark{color:hsl(var(--sf-c-txt-teal-30))}html[data-theme='auto'] .sf-c-txt-teal\:40\:dark,html.auto .sf-c-txt-teal\:40\:dark{color:hsl(var(--sf-c-txt-teal-40))}html[data-theme='auto'] .sf-c-txt-teal\:50\:dark,html.auto .sf-c-txt-teal\:50\:dark{color:hsl(var(--sf-c-txt-teal-50))}html[data-theme='auto'] .sf-c-txt-teal\:60\:dark,html.auto .sf-c-txt-teal\:60\:dark{color:hsl(var(--sf-c-txt-teal-60))}html[data-theme='auto'] .sf-c-txt-teal\:70\:dark,html.auto .sf-c-txt-teal\:70\:dark{color:hsl(var(--sf-c-txt-teal-70))}html[data-theme='auto'] .sf-c-txt-teal\:80\:dark,html.auto .sf-c-txt-teal\:80\:dark{color:hsl(var(--sf-c-txt-teal-80))}html[data-theme='auto'] .sf-c-txt-teal\:90\:dark,html.auto .sf-c-txt-teal\:90\:dark{color:hsl(var(--sf-c-txt-teal-90))}html[data-theme='auto'] .sf-c-txt-teal\:100\:dark,html.auto .sf-c-txt-teal\:100\:dark{color:hsl(var(--sf-c-txt-teal-100))}html.var[data-theme='auto'] .sf-c-teal,html.var.auto .sf-c-teal{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='auto'] .sf-c-teal\:0,html.var.auto .sf-c-teal\:0{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-teal\:10,html.var.auto .sf-c-teal\:10{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-teal\:20,html.var.auto .sf-c-teal\:20{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-teal\:30,html.var.auto .sf-c-teal\:30{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-teal\:40,html.var.auto .sf-c-teal\:40{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-teal\:50,html.var.auto .sf-c-teal\:50{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-teal\:60,html.var.auto .sf-c-teal\:60{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-teal\:70,html.var.auto .sf-c-teal\:70{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-teal\:80,html.var.auto .sf-c-teal\:80{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-teal\:90,html.var.auto .sf-c-teal\:90{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-teal\:100,html.var.auto .sf-c-teal\:100{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-teal\:dark,html.var.auto .sf-c-teal\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,75%)}html.var[data-theme='auto'] .sf-c-teal\:0\:dark,html.var.auto .sf-c-teal\:0\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-teal\:10\:dark,html.var.auto .sf-c-teal\:10\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-teal\:20\:dark,html.var.auto .sf-c-teal\:20\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-teal\:30\:dark,html.var.auto .sf-c-teal\:30\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-teal\:40\:dark,html.var.auto .sf-c-teal\:40\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-teal\:50\:dark,html.var.auto .sf-c-teal\:50\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-teal\:60\:dark,html.var.auto .sf-c-teal\:60\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-teal\:70\:dark,html.var.auto .sf-c-teal\:70\:dark{color:hsl(180,100%,10%);background:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-teal\:80\:dark,html.var.auto .sf-c-teal\:80\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-teal\:90\:dark,html.var.auto .sf-c-teal\:90\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-teal\:100\:dark,html.var.auto .sf-c-teal\:100\:dark{color:hsl(180,100%,90%);background:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal,html.auto .sf-c-txt-teal{color:hsl(180,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-teal\:0,html.auto .sf-c-txt-teal\:0{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal\:10,html.auto .sf-c-txt-teal\:10{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-teal\:20,html.auto .sf-c-txt-teal\:20{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-teal\:30,html.auto .sf-c-txt-teal\:30{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-teal\:40,html.auto .sf-c-txt-teal\:40{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-teal\:50,html.auto .sf-c-txt-teal\:50{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-teal\:60,html.auto .sf-c-txt-teal\:60{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-teal\:70,html.auto .sf-c-txt-teal\:70{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-teal\:80,html.auto .sf-c-txt-teal\:80{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-teal\:90,html.auto .sf-c-txt-teal\:90{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-teal\:100,html.auto .sf-c-txt-teal\:100{color:hsl(180,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-teal\:dark,html.auto .sf-c-txt-teal\:dark{color:hsl(180,100%,25%)}html.var[data-theme='auto'] .sf-c-txt-teal\:0\:dark,html.auto .sf-c-txt-teal\:0\:dark{color:hsl(180,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-teal\:10\:dark,html.auto .sf-c-txt-teal\:10\:dark{color:hsl(180,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-teal\:20\:dark,html.auto .sf-c-txt-teal\:20\:dark{color:hsl(180,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-teal\:30\:dark,html.auto .sf-c-txt-teal\:30\:dark{color:hsl(180,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-teal\:40\:dark,html.auto .sf-c-txt-teal\:40\:dark{color:hsl(180,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-teal\:50\:dark,html.auto .sf-c-txt-teal\:50\:dark{color:hsl(180,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-teal\:60\:dark,html.auto .sf-c-txt-teal\:60\:dark{color:hsl(180,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-teal\:70\:dark,html.auto .sf-c-txt-teal\:70\:dark{color:hsl(180,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-teal\:80\:dark,html.auto .sf-c-txt-teal\:80\:dark{color:hsl(180,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-teal\:90\:dark,html.auto .sf-c-txt-teal\:90\:dark{color:hsl(180,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-teal\:100\:dark,html.auto .sf-c-txt-teal\:100\:dark{color:hsl(180,100%,100%)}}[class*='white']{--sf-c-white:0 0% 100%;--sf-c-white-0:0 0% 0%;--sf-c-white-10:0 0% 10%;--sf-c-white-20:0 0% 20%;--sf-c-white-30:0 0% 30%;--sf-c-white-40:0 0% 40%;--sf-c-white-50:0 0% 50%;--sf-c-white-60:0 0% 60%;--sf-c-white-70:0 0% 70%;--sf-c-white-80:0 0% 80%;--sf-c-white-90:0 0% 90%;--sf-c-white-100:0 0% 100%;--sf-c-txt-white:var(--sf-c-white);--sf-c-txt-white-0:var(--sf-c-white-0);--sf-c-txt-white-10:var(--sf-c-white-10);--sf-c-txt-white-20:var(--sf-c-white-20);--sf-c-txt-white-30:var(--sf-c-white-30);--sf-c-txt-white-40:var(--sf-c-white-40);--sf-c-txt-white-50:var(--sf-c-white-50);--sf-c-txt-white-60:var(--sf-c-white-60);--sf-c-txt-white-70:var(--sf-c-white-70);--sf-c-txt-white-80:var(--sf-c-white-80);--sf-c-txt-white-90:var(--sf-c-white-90);--sf-c-txt-white-100:var(--sf-c-white-100);--sf-dark-c-white:0 0% 0%;--sf-dark-c-white-0:0 0% 0%;--sf-dark-c-white-10:0 0% 10%;--sf-dark-c-white-20:0 0% 20%;--sf-dark-c-white-30:0 0% 30%;--sf-dark-c-white-40:0 0% 40%;--sf-dark-c-white-50:0 0% 50%;--sf-dark-c-white-60:0 0% 60%;--sf-dark-c-white-70:0 0% 70%;--sf-dark-c-white-80:0 0% 80%;--sf-dark-c-white-90:0 0% 90%;--sf-dark-c-white-100:0 0% 100%;--sf-dark-c-txt-white:var(--sf-dark-c-white);--sf-dark-c-txt-white-0:var(--sf-dark-c-white-0);--sf-dark-c-txt-white-10:var(--sf-dark-c-white-10);--sf-dark-c-txt-white-20:var(--sf-dark-c-white-20);--sf-dark-c-txt-white-30:var(--sf-dark-c-white-30);--sf-dark-c-txt-white-40:var(--sf-dark-c-white-40);--sf-dark-c-txt-white-50:var(--sf-dark-c-white-50);--sf-dark-c-txt-white-60:var(--sf-dark-c-white-60);--sf-dark-c-txt-white-70:var(--sf-dark-c-white-70);--sf-dark-c-txt-white-80:var(--sf-dark-c-white-80);--sf-dark-c-txt-white-90:var(--sf-dark-c-white-90);--sf-dark-c-txt-white-100:var(--sf-dark-c-white-100)}.sf-c-white{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white))}.sf-c-white\:0{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}.sf-c-white\:10{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}.sf-c-white\:20{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}.sf-c-white\:30{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}.sf-c-white\:40{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}.sf-c-white\:50{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-50))}.sf-c-white\:60{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-60))}.sf-c-white\:70{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}.sf-c-white\:80{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}.sf-c-white\:90{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}.sf-c-white\:100{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-100))}html.var .sf-c-white{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}html.var .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var .sf-c-white\:10{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var .sf-c-white\:20{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var .sf-c-white\:30{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var .sf-c-white\:40{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var .sf-c-white\:50{color:hsl(0,0%,90%);background:hsl(0,0%,50%)}html.var .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,60%)}html.var .sf-c-white\:70{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var .sf-c-white\:80{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var .sf-c-white\:90{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var .sf-c-white\:100{color:hsl(0,0%,10%);background:hsl(0,0%,100%)}.sf-c-txt-white{color:hsl(var(--sf-dark-c-txt-white))}.sf-c-txt-white\:0{color:hsl(var(--sf-dark-c-txt-white-100))}.sf-c-txt-white\:10{color:hsl(var(--sf-dark-c-txt-white-90))}.sf-c-txt-white\:20{color:hsl(var(--sf-dark-c-txt-white-80))}.sf-c-txt-white\:30{color:hsl(var(--sf-dark-c-txt-white-70))}.sf-c-txt-white\:40{color:hsl(var(--sf-dark-c-txt-white-60))}.sf-c-txt-white\:50{color:hsl(var(--sf-dark-c-txt-white-50))}.sf-c-txt-white\:60{color:hsl(var(--sf-dark-c-txt-white-40))}.sf-c-txt-white\:70{color:hsl(var(--sf-dark-c-txt-white-30))}.sf-c-txt-white\:80{color:hsl(var(--sf-dark-c-txt-white-20))}.sf-c-txt-white\:90{color:hsl(var(--sf-dark-c-txt-white-10))}.sf-c-txt-white\:100{color:hsl(var(--sf-dark-c-txt-white-0))}html.var .sf-c-txt-white{color:hsl(0,0%,0%)}html.var .sf-c-txt-white\:0{color:hsl(0,0%,100%)}html.var .sf-c-txt-white\:10{color:hsl(0,0%,90%)}html.var .sf-c-txt-white\:20{color:hsl(0,0%,80%)}html.var .sf-c-txt-white\:30{color:hsl(0,0%,70%)}html.var .sf-c-txt-white\:40{color:hsl(0,0%,60%)}html.var .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var .sf-c-txt-white\:60{color:hsl(0,0%,40%)}html.var .sf-c-txt-white\:70{color:hsl(0,0%,30%)}html.var .sf-c-txt-white\:80{color:hsl(0,0%,20%)}html.var .sf-c-txt-white\:90{color:hsl(0,0%,10%)}html.var .sf-c-txt-white\:100{color:hsl(0,0%,0%)}html[data-theme='dark'] .sf-c-white,html.dark .sf-c-white{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white))}html[data-theme='dark'] .sf-c-white\:0,html.dark .sf-c-white\:0{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-100))}html[data-theme='dark'] .sf-c-white\:10,html.dark .sf-c-white\:10{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-90))}html[data-theme='dark'] .sf-c-white\:20,html.dark .sf-c-white\:20{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-80))}html[data-theme='dark'] .sf-c-white\:30,html.dark .sf-c-white\:30{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-70))}html[data-theme='dark'] .sf-c-white\:40,html.dark .sf-c-white\:40{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-60))}html[data-theme='dark'] .sf-c-white\:50,html.dark .sf-c-white\:50{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-50))}html[data-theme='dark'] .sf-c-white\:60,html.dark .sf-c-white\:60{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-40))}html[data-theme='dark'] .sf-c-white\:70,html.dark .sf-c-white\:70{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-30))}html[data-theme='dark'] .sf-c-white\:80,html.dark .sf-c-white\:80{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-20))}html[data-theme='dark'] .sf-c-white\:90,html.dark .sf-c-white\:90{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-10))}html[data-theme='dark'] .sf-c-white\:100,html.dark .sf-c-white\:100{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-0))}html[data-theme='dark'] .sf-c-white\:dark,html.dark .sf-c-white\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white))}html[data-theme='dark'] .sf-c-white\:0\:dark,html.dark .sf-c-white\:0\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-100))}html[data-theme='dark'] .sf-c-white\:10\:dark,html.dark .sf-c-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}html[data-theme='dark'] .sf-c-white\:20\:dark,html.dark .sf-c-white\:20\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}html[data-theme='dark'] .sf-c-white\:30\:dark,html.dark .sf-c-white\:30\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}html[data-theme='dark'] .sf-c-white\:40\:dark,html.dark .sf-c-white\:40\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-60))}html[data-theme='dark'] .sf-c-white\:50\:dark,html.dark .sf-c-white\:50\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-50))}html[data-theme='dark'] .sf-c-white\:60\:dark,html.dark .sf-c-white\:60\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}html[data-theme='dark'] .sf-c-white\:70\:dark,html.dark .sf-c-white\:70\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}html[data-theme='dark'] .sf-c-white\:80\:dark,html.dark .sf-c-white\:80\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}html[data-theme='dark'] .sf-c-white\:90\:dark,html.dark .sf-c-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}html[data-theme='dark'] .sf-c-white\:100\:dark,html.dark .sf-c-white\:100\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}html[data-theme='dark'] .sf-c-txt-white,html.dark .sf-c-txt-white{color:hsl(var(--sf-c-txt-white))}html[data-theme='dark'] .sf-c-txt-white\:0,html.dark .sf-c-txt-white\:0{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='dark'] .sf-c-txt-white\:10,html.dark .sf-c-txt-white\:10{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='dark'] .sf-c-txt-white\:20,html.dark .sf-c-txt-white\:20{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='dark'] .sf-c-txt-white\:30,html.dark .sf-c-txt-white\:30{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='dark'] .sf-c-txt-white\:40,html.dark .sf-c-txt-white\:40{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='dark'] .sf-c-txt-white\:50,html.dark .sf-c-txt-white\:50{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='dark'] .sf-c-txt-white\:60,html.dark .sf-c-txt-white\:60{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='dark'] .sf-c-txt-white\:70,html.dark .sf-c-txt-white\:70{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='dark'] .sf-c-txt-white\:80,html.dark .sf-c-txt-white\:80{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='dark'] .sf-c-txt-white\:90,html.dark .sf-c-txt-white\:90{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='dark'] .sf-c-txt-white\:100,html.dark .sf-c-txt-white\:100{color:hsl(var(--sf-c-txt-white-100))}html[data-theme='dark'] .sf-c-txt-white\:dark,html.dark .sf-c-txt-white\:dark{color:hsl(var(--sf-c-txt-white))}html[data-theme='dark'] .sf-c-txt-white\:0\:dark,html.dark .sf-c-txt-white\:0\:dark{color:hsl(var(--sf-dark-c-txt-white-0))}html[data-theme='dark'] .sf-c-txt-white\:10\:dark,html.dark .sf-c-txt-white\:10\:dark{color:hsl(var(--sf-dark-c-txt-white-10))}html[data-theme='dark'] .sf-c-txt-white\:20\:dark,html.dark .sf-c-txt-white\:20\:dark{color:hsl(var(--sf-dark-c-txt-white-20))}html[data-theme='dark'] .sf-c-txt-white\:30\:dark,html.dark .sf-c-txt-white\:30\:dark{color:hsl(var(--sf-dark-c-txt-white-30))}html[data-theme='dark'] .sf-c-txt-white\:40\:dark,html.dark .sf-c-txt-white\:40\:dark{color:hsl(var(--sf-dark-c-txt-white-40))}html[data-theme='dark'] .sf-c-txt-white\:50\:dark,html.dark .sf-c-txt-white\:50\:dark{color:hsl(var(--sf-dark-c-txt-white-50))}html[data-theme='dark'] .sf-c-txt-white\:60\:dark,html.dark .sf-c-txt-white\:60\:dark{color:hsl(var(--sf-dark-c-txt-white-60))}html[data-theme='dark'] .sf-c-txt-white\:70\:dark,html.dark .sf-c-txt-white\:70\:dark{color:hsl(var(--sf-dark-c-txt-white-70))}html[data-theme='dark'] .sf-c-txt-white\:80\:dark,html.dark .sf-c-txt-white\:80\:dark{color:hsl(var(--sf-dark-c-txt-white-80))}html[data-theme='dark'] .sf-c-txt-white\:90\:dark,html.dark .sf-c-txt-white\:90\:dark{color:hsl(var(--sf-dark-c-txt-white-90))}html[data-theme='dark'] .sf-c-txt-white\:100\:dark,html.dark .sf-c-txt-white\:100\:dark{color:hsl(var(--sf-dark-c-txt-white-100))}html.var[data-theme='dark'] .sf-c-white,html.var.dark .sf-c-white{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:0,html.var.dark .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-white\:10,html.var.dark .sf-c-white\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-white\:20,html.var.dark .sf-c-white\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-white\:30,html.var.dark .sf-c-white\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-white\:40,html.var.dark .sf-c-white\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-white\:50,html.var.dark .sf-c-white\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-white\:60,html.var.dark .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-white\:70,html.var.dark .sf-c-white\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-white\:80,html.var.dark .sf-c-white\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-white\:90,html.var.dark .sf-c-white\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-white\:100,html.var.dark .sf-c-white\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:dark,html.var.dark .sf-c-white\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-white\:0\:dark,html.var.dark .sf-c-white\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-white\:10\:dark,html.var.dark .sf-c-white\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-white\:20\:dark,html.var.dark .sf-c-white\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-white\:30\:dark,html.var.dark .sf-c-white\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-white\:40\:dark,html.var.dark .sf-c-white\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-white\:50\:dark,html.var.dark .sf-c-white\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-white\:60\:dark,html.var.dark .sf-c-white\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-white\:70\:dark,html.var.dark .sf-c-white\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-white\:80\:dark,html.var.dark .sf-c-white\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-white\:90\:dark,html.var.dark .sf-c-white\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-white\:100\:dark,html.var.dark .sf-c-white\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white,html.dark .sf-c-txt-white{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:0,html.dark .sf-c-txt-white\:0{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white\:10,html.dark .sf-c-txt-white\:10{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-white\:20,html.dark .sf-c-txt-white\:20{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-white\:30,html.dark .sf-c-txt-white\:30{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-white\:40,html.dark .sf-c-txt-white\:40{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-white\:50,html.dark .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-white\:60,html.dark .sf-c-txt-white\:60{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-white\:70,html.dark .sf-c-txt-white\:70{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-white\:80,html.dark .sf-c-txt-white\:80{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-white\:90,html.dark .sf-c-txt-white\:90{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-white\:100,html.dark .sf-c-txt-white\:100{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:dark,html.dark .sf-c-txt-white\:dark{color:hsl(0,0%,100%)}html.var[data-theme='dark'] .sf-c-txt-white\:0\:dark,html.dark .sf-c-txt-white\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='dark'] .sf-c-txt-white\:10\:dark,html.dark .sf-c-txt-white\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='dark'] .sf-c-txt-white\:20\:dark,html.dark .sf-c-txt-white\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='dark'] .sf-c-txt-white\:30\:dark,html.dark .sf-c-txt-white\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='dark'] .sf-c-txt-white\:40\:dark,html.dark .sf-c-txt-white\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='dark'] .sf-c-txt-white\:50\:dark,html.dark .sf-c-txt-white\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='dark'] .sf-c-txt-white\:60\:dark,html.dark .sf-c-txt-white\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='dark'] .sf-c-txt-white\:70\:dark,html.dark .sf-c-txt-white\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='dark'] .sf-c-txt-white\:80\:dark,html.dark .sf-c-txt-white\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='dark'] .sf-c-txt-white\:90\:dark,html.dark .sf-c-txt-white\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='dark'] .sf-c-txt-white\:100\:dark,html.dark .sf-c-txt-white\:100\:dark{color:hsl(0,0%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-white,html.auto .sf-c-white{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white))}html[data-theme='auto'] .sf-c-white\:0,html.auto .sf-c-white\:0{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-100))}html[data-theme='auto'] .sf-c-white\:10,html.auto .sf-c-white\:10{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-90))}html[data-theme='auto'] .sf-c-white\:20,html.auto .sf-c-white\:20{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-80))}html[data-theme='auto'] .sf-c-white\:30,html.auto .sf-c-white\:30{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-70))}html[data-theme='auto'] .sf-c-white\:40,html.auto .sf-c-white\:40{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-60))}html[data-theme='auto'] .sf-c-white\:50,html.auto .sf-c-white\:50{color:hsl(var(--sf-dark-c-txt-white-10));background:hsl(var(--sf-dark-c-white-50))}html[data-theme='auto'] .sf-c-white\:60,html.auto .sf-c-white\:60{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-40))}html[data-theme='auto'] .sf-c-white\:70,html.auto .sf-c-white\:70{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-30))}html[data-theme='auto'] .sf-c-white\:80,html.auto .sf-c-white\:80{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-20))}html[data-theme='auto'] .sf-c-white\:90,html.auto .sf-c-white\:90{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-10))}html[data-theme='auto'] .sf-c-white\:100,html.auto .sf-c-white\:100{color:hsl(var(--sf-dark-c-txt-white-90));background:hsl(var(--sf-dark-c-white-0))}html[data-theme='auto'] .sf-c-white\:dark,html.auto .sf-c-white\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white))}html[data-theme='auto'] .sf-c-white\:0\:dark,html.auto .sf-c-white\:0\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-100))}html[data-theme='auto'] .sf-c-white\:10\:dark,html.auto .sf-c-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-90))}html[data-theme='auto'] .sf-c-white\:20\:dark,html.auto .sf-c-white\:20\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-80))}html[data-theme='auto'] .sf-c-white\:30\:dark,html.auto .sf-c-white\:30\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-70))}html[data-theme='auto'] .sf-c-white\:40\:dark,html.auto .sf-c-white\:40\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-60))}html[data-theme='auto'] .sf-c-white\:50\:dark,html.auto .sf-c-white\:50\:dark{color:hsl(var(--sf-c-txt-white-10));background:hsl(var(--sf-c-white-50))}html[data-theme='auto'] .sf-c-white\:60\:dark,html.auto .sf-c-white\:60\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-40))}html[data-theme='auto'] .sf-c-white\:70\:dark,html.auto .sf-c-white\:70\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-30))}html[data-theme='auto'] .sf-c-white\:80\:dark,html.auto .sf-c-white\:80\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-20))}html[data-theme='auto'] .sf-c-white\:90\:dark,html.auto .sf-c-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-10))}html[data-theme='auto'] .sf-c-white\:100\:dark,html.auto .sf-c-white\:100\:dark{color:hsl(var(--sf-c-txt-white-90));background:hsl(var(--sf-c-white-0))}html[data-theme='auto'] .sf-c-txt-white,html.auto .sf-c-txt-white{color:hsl(var(--sf-c-txt-white))}html[data-theme='auto'] .sf-c-txt-white\:0,html.auto .sf-c-txt-white\:0{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='auto'] .sf-c-txt-white\:10,html.auto .sf-c-txt-white\:10{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='auto'] .sf-c-txt-white\:20,html.auto .sf-c-txt-white\:20{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='auto'] .sf-c-txt-white\:30,html.auto .sf-c-txt-white\:30{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='auto'] .sf-c-txt-white\:40,html.auto .sf-c-txt-white\:40{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='auto'] .sf-c-txt-white\:50,html.auto .sf-c-txt-white\:50{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='auto'] .sf-c-txt-white\:60,html.auto .sf-c-txt-white\:60{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='auto'] .sf-c-txt-white\:70,html.auto .sf-c-txt-white\:70{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='auto'] .sf-c-txt-white\:80,html.auto .sf-c-txt-white\:80{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='auto'] .sf-c-txt-white\:90,html.auto .sf-c-txt-white\:90{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='auto'] .sf-c-txt-white\:100,html.auto .sf-c-txt-white\:100{color:hsl(var(--sf-c-txt-white-100))}html[data-theme='auto'] .sf-c-txt-white\:dark,html.auto .sf-c-txt-white\:dark{color:hsl(var(--sf-c-txt-white))}html[data-theme='auto'] .sf-c-txt-white\:0\:dark,html.auto .sf-c-txt-white\:0\:dark{color:hsl(var(--sf-c-txt-white-0))}html[data-theme='auto'] .sf-c-txt-white\:10\:dark,html.auto .sf-c-txt-white\:10\:dark{color:hsl(var(--sf-c-txt-white-10))}html[data-theme='auto'] .sf-c-txt-white\:20\:dark,html.auto .sf-c-txt-white\:20\:dark{color:hsl(var(--sf-c-txt-white-20))}html[data-theme='auto'] .sf-c-txt-white\:30\:dark,html.auto .sf-c-txt-white\:30\:dark{color:hsl(var(--sf-c-txt-white-30))}html[data-theme='auto'] .sf-c-txt-white\:40\:dark,html.auto .sf-c-txt-white\:40\:dark{color:hsl(var(--sf-c-txt-white-40))}html[data-theme='auto'] .sf-c-txt-white\:50\:dark,html.auto .sf-c-txt-white\:50\:dark{color:hsl(var(--sf-c-txt-white-50))}html[data-theme='auto'] .sf-c-txt-white\:60\:dark,html.auto .sf-c-txt-white\:60\:dark{color:hsl(var(--sf-c-txt-white-60))}html[data-theme='auto'] .sf-c-txt-white\:70\:dark,html.auto .sf-c-txt-white\:70\:dark{color:hsl(var(--sf-c-txt-white-70))}html[data-theme='auto'] .sf-c-txt-white\:80\:dark,html.auto .sf-c-txt-white\:80\:dark{color:hsl(var(--sf-c-txt-white-80))}html[data-theme='auto'] .sf-c-txt-white\:90\:dark,html.auto .sf-c-txt-white\:90\:dark{color:hsl(var(--sf-c-txt-white-90))}html[data-theme='auto'] .sf-c-txt-white\:100\:dark,html.auto .sf-c-txt-white\:100\:dark{color:hsl(var(--sf-c-txt-white-100))}html.var[data-theme='auto'] .sf-c-white,html.var.auto .sf-c-white{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:0,html.var.auto .sf-c-white\:0{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-white\:10,html.var.auto .sf-c-white\:10{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-white\:20,html.var.auto .sf-c-white\:20{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-white\:30,html.var.auto .sf-c-white\:30{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-white\:40,html.var.auto .sf-c-white\:40{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-white\:50,html.var.auto .sf-c-white\:50{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-white\:60,html.var.auto .sf-c-white\:60{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-white\:70,html.var.auto .sf-c-white\:70{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-white\:80,html.var.auto .sf-c-white\:80{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-white\:90,html.var.auto .sf-c-white\:90{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-white\:100,html.var.auto .sf-c-white\:100{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:dark,html.var.auto .sf-c-white\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-white\:0\:dark,html.var.auto .sf-c-white\:0\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-white\:10\:dark,html.var.auto .sf-c-white\:10\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-white\:20\:dark,html.var.auto .sf-c-white\:20\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-white\:30\:dark,html.var.auto .sf-c-white\:30\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-white\:40\:dark,html.var.auto .sf-c-white\:40\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-white\:50\:dark,html.var.auto .sf-c-white\:50\:dark{color:hsl(0,0%,10%);background:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-white\:60\:dark,html.var.auto .sf-c-white\:60\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-white\:70\:dark,html.var.auto .sf-c-white\:70\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-white\:80\:dark,html.var.auto .sf-c-white\:80\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-white\:90\:dark,html.var.auto .sf-c-white\:90\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-white\:100\:dark,html.var.auto .sf-c-white\:100\:dark{color:hsl(0,0%,90%);background:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white,html.auto .sf-c-txt-white{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:0,html.auto .sf-c-txt-white\:0{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white\:10,html.auto .sf-c-txt-white\:10{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-white\:20,html.auto .sf-c-txt-white\:20{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-white\:30,html.auto .sf-c-txt-white\:30{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-white\:40,html.auto .sf-c-txt-white\:40{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-white\:50,html.auto .sf-c-txt-white\:50{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-white\:60,html.auto .sf-c-txt-white\:60{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-white\:70,html.auto .sf-c-txt-white\:70{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-white\:80,html.auto .sf-c-txt-white\:80{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-white\:90,html.auto .sf-c-txt-white\:90{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-white\:100,html.auto .sf-c-txt-white\:100{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:dark,html.auto .sf-c-txt-white\:dark{color:hsl(0,0%,100%)}html.var[data-theme='auto'] .sf-c-txt-white\:0\:dark,html.auto .sf-c-txt-white\:0\:dark{color:hsl(0,0%,0%)}html.var[data-theme='auto'] .sf-c-txt-white\:10\:dark,html.auto .sf-c-txt-white\:10\:dark{color:hsl(0,0%,10%)}html.var[data-theme='auto'] .sf-c-txt-white\:20\:dark,html.auto .sf-c-txt-white\:20\:dark{color:hsl(0,0%,20%)}html.var[data-theme='auto'] .sf-c-txt-white\:30\:dark,html.auto .sf-c-txt-white\:30\:dark{color:hsl(0,0%,30%)}html.var[data-theme='auto'] .sf-c-txt-white\:40\:dark,html.auto .sf-c-txt-white\:40\:dark{color:hsl(0,0%,40%)}html.var[data-theme='auto'] .sf-c-txt-white\:50\:dark,html.auto .sf-c-txt-white\:50\:dark{color:hsl(0,0%,50%)}html.var[data-theme='auto'] .sf-c-txt-white\:60\:dark,html.auto .sf-c-txt-white\:60\:dark{color:hsl(0,0%,60%)}html.var[data-theme='auto'] .sf-c-txt-white\:70\:dark,html.auto .sf-c-txt-white\:70\:dark{color:hsl(0,0%,70%)}html.var[data-theme='auto'] .sf-c-txt-white\:80\:dark,html.auto .sf-c-txt-white\:80\:dark{color:hsl(0,0%,80%)}html.var[data-theme='auto'] .sf-c-txt-white\:90\:dark,html.auto .sf-c-txt-white\:90\:dark{color:hsl(0,0%,90%)}html.var[data-theme='auto'] .sf-c-txt-white\:100\:dark,html.auto .sf-c-txt-white\:100\:dark{color:hsl(0,0%,100%)}}[class*='yellow']{--sf-c-yellow:60 100% 50%;--sf-c-yellow-0:60 100% 0%;--sf-c-yellow-10:60 100% 10%;--sf-c-yellow-20:60 100% 20%;--sf-c-yellow-30:60 100% 30%;--sf-c-yellow-40:60 100% 40%;--sf-c-yellow-50:60 100% 50%;--sf-c-yellow-60:60 100% 60%;--sf-c-yellow-70:60 100% 70%;--sf-c-yellow-80:60 100% 80%;--sf-c-yellow-90:60 100% 90%;--sf-c-yellow-100:60 100% 100%;--sf-c-txt-yellow:var(--sf-c-yellow);--sf-c-txt-yellow-0:var(--sf-c-yellow-0);--sf-c-txt-yellow-10:var(--sf-c-yellow-10);--sf-c-txt-yellow-20:var(--sf-c-yellow-20);--sf-c-txt-yellow-30:var(--sf-c-yellow-30);--sf-c-txt-yellow-40:var(--sf-c-yellow-40);--sf-c-txt-yellow-50:var(--sf-c-yellow-50);--sf-c-txt-yellow-60:var(--sf-c-yellow-60);--sf-c-txt-yellow-70:var(--sf-c-yellow-70);--sf-c-txt-yellow-80:var(--sf-c-yellow-80);--sf-c-txt-yellow-90:var(--sf-c-yellow-90);--sf-c-txt-yellow-100:var(--sf-c-yellow-100);--sf-dark-c-yellow:60 100% 50%;--sf-dark-c-yellow-0:60 100% 0%;--sf-dark-c-yellow-10:60 100% 10%;--sf-dark-c-yellow-20:60 100% 20%;--sf-dark-c-yellow-30:60 100% 30%;--sf-dark-c-yellow-40:60 100% 40%;--sf-dark-c-yellow-50:60 100% 50%;--sf-dark-c-yellow-60:60 100% 60%;--sf-dark-c-yellow-70:60 100% 70%;--sf-dark-c-yellow-80:60 100% 80%;--sf-dark-c-yellow-90:60 100% 90%;--sf-dark-c-yellow-100:60 100% 100%;--sf-dark-c-txt-yellow:var(--sf-dark-c-yellow);--sf-dark-c-txt-yellow-0:var(--sf-dark-c-yellow-0);--sf-dark-c-txt-yellow-10:var(--sf-dark-c-yellow-10);--sf-dark-c-txt-yellow-20:var(--sf-dark-c-yellow-20);--sf-dark-c-txt-yellow-30:var(--sf-dark-c-yellow-30);--sf-dark-c-txt-yellow-40:var(--sf-dark-c-yellow-40);--sf-dark-c-txt-yellow-50:var(--sf-dark-c-yellow-50);--sf-dark-c-txt-yellow-60:var(--sf-dark-c-yellow-60);--sf-dark-c-txt-yellow-70:var(--sf-dark-c-yellow-70);--sf-dark-c-txt-yellow-80:var(--sf-dark-c-yellow-80);--sf-dark-c-txt-yellow-90:var(--sf-dark-c-yellow-90);--sf-dark-c-txt-yellow-100:var(--sf-dark-c-yellow-100)}.sf-c-yellow{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}.sf-c-yellow\:0{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}.sf-c-yellow\:10{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}.sf-c-yellow\:20{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}.sf-c-yellow\:30{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-30))}.sf-c-yellow\:40{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-40))}.sf-c-yellow\:50{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}.sf-c-yellow\:60{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}.sf-c-yellow\:70{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}.sf-c-yellow\:80{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}.sf-c-yellow\:90{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}.sf-c-yellow\:100{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-100))}html.var .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var .sf-c-yellow\:10{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var .sf-c-yellow\:20{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var .sf-c-yellow\:30{color:hsl(60,100%,90%);background:hsl(60,100%,30%)}html.var .sf-c-yellow\:40{color:hsl(60,100%,90%);background:hsl(60,100%,40%)}html.var .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var .sf-c-yellow\:80{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var .sf-c-yellow\:90{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var .sf-c-yellow\:100{color:hsl(60,100%,10%);background:hsl(60,100%,100%)}.sf-c-txt-yellow{color:hsl(var(--sf-dark-c-txt-yellow))}.sf-c-txt-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-100))}.sf-c-txt-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-90))}.sf-c-txt-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-80))}.sf-c-txt-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-70))}.sf-c-txt-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-60))}.sf-c-txt-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-50))}.sf-c-txt-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-40))}.sf-c-txt-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-30))}.sf-c-txt-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-20))}.sf-c-txt-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-10))}.sf-c-txt-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-0))}html.var .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:0{color:hsl(60,100%,100%)}html.var .sf-c-txt-yellow\:10{color:hsl(60,100%,90%)}html.var .sf-c-txt-yellow\:20{color:hsl(60,100%,80%)}html.var .sf-c-txt-yellow\:30{color:hsl(60,100%,70%)}html.var .sf-c-txt-yellow\:40{color:hsl(60,100%,60%)}html.var .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var .sf-c-txt-yellow\:60{color:hsl(60,100%,40%)}html.var .sf-c-txt-yellow\:70{color:hsl(60,100%,30%)}html.var .sf-c-txt-yellow\:80{color:hsl(60,100%,20%)}html.var .sf-c-txt-yellow\:90{color:hsl(60,100%,10%)}html.var .sf-c-txt-yellow\:100{color:hsl(60,100%,0%)}html[data-theme='dark'] .sf-c-yellow,html.dark .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0,html.dark .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10,html.dark .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20,html.dark .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30,html.dark .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40,html.dark .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50,html.dark .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60,html.dark .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70,html.dark .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80,html.dark .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90,html.dark .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100,html.dark .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='dark'] .sf-c-yellow\:dark,html.dark .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='dark'] .sf-c-yellow\:0\:dark,html.dark .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='dark'] .sf-c-yellow\:10\:dark,html.dark .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='dark'] .sf-c-yellow\:20\:dark,html.dark .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='dark'] .sf-c-yellow\:30\:dark,html.dark .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='dark'] .sf-c-yellow\:40\:dark,html.dark .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='dark'] .sf-c-yellow\:50\:dark,html.dark .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='dark'] .sf-c-yellow\:60\:dark,html.dark .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='dark'] .sf-c-yellow\:70\:dark,html.dark .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='dark'] .sf-c-yellow\:80\:dark,html.dark .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='dark'] .sf-c-yellow\:90\:dark,html.dark .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='dark'] .sf-c-yellow\:100\:dark,html.dark .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-dark-c-txt-yellow-0))}html[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-dark-c-txt-yellow-10))}html[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-dark-c-txt-yellow-20))}html[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-dark-c-txt-yellow-30))}html[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-dark-c-txt-yellow-40))}html[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-dark-c-txt-yellow-50))}html[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-dark-c-txt-yellow-60))}html[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-dark-c-txt-yellow-70))}html[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-dark-c-txt-yellow-80))}html[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-dark-c-txt-yellow-90))}html[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-dark-c-txt-yellow-100))}html.var[data-theme='dark'] .sf-c-yellow,html.var.dark .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0,html.var.dark .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10,html.var.dark .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20,html.var.dark .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30,html.var.dark .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40,html.var.dark .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50,html.var.dark .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60,html.var.dark .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70,html.var.dark .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80,html.var.dark .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90,html.var.dark .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100,html.var.dark .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-yellow\:dark,html.var.dark .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:0\:dark,html.var.dark .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-yellow\:10\:dark,html.var.dark .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-yellow\:20\:dark,html.var.dark .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-yellow\:30\:dark,html.var.dark .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-yellow\:40\:dark,html.var.dark .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-yellow\:50\:dark,html.var.dark .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-yellow\:60\:dark,html.var.dark .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-yellow\:70\:dark,html.var.dark .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-yellow\:80\:dark,html.var.dark .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-yellow\:90\:dark,html.var.dark .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-yellow\:100\:dark,html.var.dark .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow,html.dark .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0,html.dark .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10,html.dark .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20,html.dark .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30,html.dark .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40,html.dark .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50,html.dark .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60,html.dark .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70,html.dark .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80,html.dark .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90,html.dark .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100,html.dark .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:dark,html.dark .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:0\:dark,html.dark .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:10\:dark,html.dark .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:20\:dark,html.dark .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:30\:dark,html.dark .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:40\:dark,html.dark .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:50\:dark,html.dark .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:60\:dark,html.dark .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:70\:dark,html.dark .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:80\:dark,html.dark .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:90\:dark,html.dark .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='dark'] .sf-c-txt-yellow\:100\:dark,html.dark .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}@media (prefers-color-scheme:dark){html[data-theme='auto'] .sf-c-yellow,html.auto .sf-c-yellow{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0,html.auto .sf-c-yellow\:0{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10,html.auto .sf-c-yellow\:10{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20,html.auto .sf-c-yellow\:20{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30,html.auto .sf-c-yellow\:30{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40,html.auto .sf-c-yellow\:40{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50,html.auto .sf-c-yellow\:50{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60,html.auto .sf-c-yellow\:60{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70,html.auto .sf-c-yellow\:70{color:hsl(var(--sf-dark-c-txt-yellow-10));background:hsl(var(--sf-dark-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80,html.auto .sf-c-yellow\:80{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90,html.auto .sf-c-yellow\:90{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100,html.auto .sf-c-yellow\:100{color:hsl(var(--sf-dark-c-txt-yellow-90));background:hsl(var(--sf-dark-c-yellow-0))}html[data-theme='auto'] .sf-c-yellow\:dark,html.auto .sf-c-yellow\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow))}html[data-theme='auto'] .sf-c-yellow\:0\:dark,html.auto .sf-c-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-100))}html[data-theme='auto'] .sf-c-yellow\:10\:dark,html.auto .sf-c-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-90))}html[data-theme='auto'] .sf-c-yellow\:20\:dark,html.auto .sf-c-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-80))}html[data-theme='auto'] .sf-c-yellow\:30\:dark,html.auto .sf-c-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-70))}html[data-theme='auto'] .sf-c-yellow\:40\:dark,html.auto .sf-c-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-60))}html[data-theme='auto'] .sf-c-yellow\:50\:dark,html.auto .sf-c-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-50))}html[data-theme='auto'] .sf-c-yellow\:60\:dark,html.auto .sf-c-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-40))}html[data-theme='auto'] .sf-c-yellow\:70\:dark,html.auto .sf-c-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-10));background:hsl(var(--sf-c-yellow-30))}html[data-theme='auto'] .sf-c-yellow\:80\:dark,html.auto .sf-c-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-20))}html[data-theme='auto'] .sf-c-yellow\:90\:dark,html.auto .sf-c-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-10))}html[data-theme='auto'] .sf-c-yellow\:100\:dark,html.auto .sf-c-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-90));background:hsl(var(--sf-c-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(var(--sf-c-txt-yellow-100))}html[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(var(--sf-c-txt-yellow))}html[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(var(--sf-c-txt-yellow-0))}html[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(var(--sf-c-txt-yellow-10))}html[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(var(--sf-c-txt-yellow-20))}html[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(var(--sf-c-txt-yellow-30))}html[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(var(--sf-c-txt-yellow-40))}html[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(var(--sf-c-txt-yellow-50))}html[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(var(--sf-c-txt-yellow-60))}html[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(var(--sf-c-txt-yellow-70))}html[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(var(--sf-c-txt-yellow-80))}html[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(var(--sf-c-txt-yellow-90))}html[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(var(--sf-c-txt-yellow-100))}html.var[data-theme='auto'] .sf-c-yellow,html.var.auto .sf-c-yellow{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0,html.var.auto .sf-c-yellow\:0{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10,html.var.auto .sf-c-yellow\:10{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20,html.var.auto .sf-c-yellow\:20{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30,html.var.auto .sf-c-yellow\:30{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40,html.var.auto .sf-c-yellow\:40{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50,html.var.auto .sf-c-yellow\:50{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60,html.var.auto .sf-c-yellow\:60{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70,html.var.auto .sf-c-yellow\:70{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80,html.var.auto .sf-c-yellow\:80{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90,html.var.auto .sf-c-yellow\:90{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100,html.var.auto .sf-c-yellow\:100{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-yellow\:dark,html.var.auto .sf-c-yellow\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:0\:dark,html.var.auto .sf-c-yellow\:0\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-yellow\:10\:dark,html.var.auto .sf-c-yellow\:10\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-yellow\:20\:dark,html.var.auto .sf-c-yellow\:20\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-yellow\:30\:dark,html.var.auto .sf-c-yellow\:30\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-yellow\:40\:dark,html.var.auto .sf-c-yellow\:40\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-yellow\:50\:dark,html.var.auto .sf-c-yellow\:50\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-yellow\:60\:dark,html.var.auto .sf-c-yellow\:60\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-yellow\:70\:dark,html.var.auto .sf-c-yellow\:70\:dark{color:hsl(60,100%,10%);background:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-yellow\:80\:dark,html.var.auto .sf-c-yellow\:80\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-yellow\:90\:dark,html.var.auto .sf-c-yellow\:90\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-yellow\:100\:dark,html.var.auto .sf-c-yellow\:100\:dark{color:hsl(60,100%,90%);background:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow,html.auto .sf-c-txt-yellow{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0,html.auto .sf-c-txt-yellow\:0{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10,html.auto .sf-c-txt-yellow\:10{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20,html.auto .sf-c-txt-yellow\:20{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30,html.auto .sf-c-txt-yellow\:30{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40,html.auto .sf-c-txt-yellow\:40{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50,html.auto .sf-c-txt-yellow\:50{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60,html.auto .sf-c-txt-yellow\:60{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70,html.auto .sf-c-txt-yellow\:70{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80,html.auto .sf-c-txt-yellow\:80{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90,html.auto .sf-c-txt-yellow\:90{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100,html.auto .sf-c-txt-yellow\:100{color:hsl(60,100%,100%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:dark,html.auto .sf-c-txt-yellow\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:0\:dark,html.auto .sf-c-txt-yellow\:0\:dark{color:hsl(60,100%,0%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:10\:dark,html.auto .sf-c-txt-yellow\:10\:dark{color:hsl(60,100%,10%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:20\:dark,html.auto .sf-c-txt-yellow\:20\:dark{color:hsl(60,100%,20%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:30\:dark,html.auto .sf-c-txt-yellow\:30\:dark{color:hsl(60,100%,30%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:40\:dark,html.auto .sf-c-txt-yellow\:40\:dark{color:hsl(60,100%,40%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:50\:dark,html.auto .sf-c-txt-yellow\:50\:dark{color:hsl(60,100%,50%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:60\:dark,html.auto .sf-c-txt-yellow\:60\:dark{color:hsl(60,100%,60%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:70\:dark,html.auto .sf-c-txt-yellow\:70\:dark{color:hsl(60,100%,70%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:80\:dark,html.auto .sf-c-txt-yellow\:80\:dark{color:hsl(60,100%,80%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:90\:dark,html.auto .sf-c-txt-yellow\:90\:dark{color:hsl(60,100%,90%)}html.var[data-theme='auto'] .sf-c-txt-yellow\:100\:dark,html.auto .sf-c-txt-yellow\:100\:dark{color:hsl(60,100%,100%)}} \ No newline at end of file