stillwind 0.0.0 → 0.1.0-rc.0

package/css/builtin-utilities/tw-effects.css

@@ -0,0 +1,1209 @@
+/* Built-in effects utilities. */
+
+/* MARK: `opacity` */
+
+@stillwind-arbitrary-property opacity;
+
+@stillwind-utility opacity-* {
+  opacity: --value([number-percentage]);
+}
+
+@stillwind-utility opacity-* {
+  opacity: --value(--opacity-*);
+}
+
+@stillwind-utility opacity-* {
+  opacity: calc(--value(number [0, ∞]) * 1%);
+}
+
+/* MARK: `mix-blend-mode` */
+
+@stillwind-arbitrary-property mix-blend-mode;
+
+@stillwind-utility mix-blend-color {
+  mix-blend-mode: color;
+}
+
+@stillwind-utility mix-blend-color-burn {
+  mix-blend-mode: color-burn;
+}
+
+@stillwind-utility mix-blend-color-dodge {
+  mix-blend-mode: color-dodge;
+}
+
+@stillwind-utility mix-blend-darken {
+  mix-blend-mode: darken;
+}
+
+@stillwind-utility mix-blend-difference {
+  mix-blend-mode: difference;
+}
+
+@stillwind-utility mix-blend-exclusion {
+  mix-blend-mode: exclusion;
+}
+
+@stillwind-utility mix-blend-hard-light {
+  mix-blend-mode: hard-light;
+}
+
+@stillwind-utility mix-blend-hue {
+  mix-blend-mode: hue;
+}
+
+@stillwind-utility mix-blend-lighten {
+  mix-blend-mode: lighten;
+}
+
+@stillwind-utility mix-blend-luminosity {
+  mix-blend-mode: luminosity;
+}
+
+@stillwind-utility mix-blend-multiply {
+  mix-blend-mode: multiply;
+}
+
+@stillwind-utility mix-blend-normal {
+  mix-blend-mode: normal;
+}
+
+@stillwind-utility mix-blend-overlay {
+  mix-blend-mode: overlay;
+}
+
+@stillwind-utility mix-blend-plus-darker {
+  mix-blend-mode: plus-darker;
+}
+
+@stillwind-utility mix-blend-plus-lighter {
+  mix-blend-mode: plus-lighter;
+}
+
+@stillwind-utility mix-blend-saturation {
+  mix-blend-mode: saturation;
+}
+
+@stillwind-utility mix-blend-screen {
+  mix-blend-mode: screen;
+}
+
+@stillwind-utility mix-blend-soft-light {
+  mix-blend-mode: soft-light;
+}
+
+/* MARK: `box-shadow` */
+
+@stillwind-arbitrary-property box-shadow;
+@stillwind-arbitrary-property --tw-shadow*;
+@stillwind-arbitrary-property --tw-ring-*;
+@stillwind-arbitrary-property --tw-inset-*;
+
+@stillwind-arbitrary-property --tw-shadow-color;
+
+@stillwind-utility shadow-initial {
+  --tw-shadow-color: initial;
+}
+
+@stillwind-arbitrary-property --tw-shadow;
+
+@stillwind-utility shadow-none {
+  --tw-shadow: 0 0 #0000;
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility shadow-* {
+  --tw-shadow: --stillwind-builtin-shadow-color(--shadow-*, --tw-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility shadow {
+  --tw-shadow: --stillwind-builtin-shadow-color(--shadow, --tw-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+/*
+An untyped variable selects the earliest registered branch that accepts it. Keep this
+branch before the shadow color branches so `shadow-(--x)` sets the shadow, as in
+Tailwind.
+*/
+@stillwind-utility shadow-* {
+  --tw-shadow: --stillwind-builtin-shadow-color([shadow], --tw-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility shadow-* {
+  --tw-shadow-alpha: --alpha(--modifier());
+  --tw-shadow: --stillwind-builtin-shadow-color(
+    --shadow-*,
+    --tw-shadow-color,
+    --alpha(--modifier())
+  );
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility shadow {
+  --tw-shadow-alpha: --alpha(--modifier());
+  --tw-shadow: --stillwind-builtin-shadow-color(--shadow, --tw-shadow-color, --alpha(--modifier()));
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-arbitrary-property --tw-ring-shadow;
+
+@stillwind-utility ring {
+  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width))
+    var(--tw-ring-color, currentcolor);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-arbitrary-property --tw-ring-inset;
+
+@stillwind-utility ring-inset {
+  --tw-ring-inset: inset;
+}
+
+@stillwind-utility ring-* {
+  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0
+    calc(--value(integer) * 1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility shadow-* {
+  --tw-shadow-color: --value(inherit);
+}
+
+@stillwind-utility shadow-* {
+  --tw-shadow-color: --compat-color(
+    --value(--color-*, current, transparent),
+    100%,
+    var(--tw-shadow-alpha)
+  );
+}
+
+@stillwind-utility shadow-* {
+  --tw-shadow-color: --compat-color(
+    --value(--color-*, current, transparent),
+    --alpha(--modifier()),
+    var(--tw-shadow-alpha)
+  );
+}
+
+@stillwind-arbitrary-property --tw-ring-color;
+
+@stillwind-utility ring-* {
+  --tw-ring-color: --value(--color-*, current, inherit, transparent, [color]);
+}
+
+@stillwind-utility ring-* {
+  --tw-ring-color: --compat-color(
+    --value(--color-*, current, inherit, transparent, [color]),
+    --alpha(--modifier())
+  );
+}
+
+@stillwind-utility ring-* {
+  --tw-ring-color: --value(--color-*, current, transparent);
+}
+
+@stillwind-utility ring-* {
+  --tw-ring-color: --compat-color(--value(--color-*, current, transparent), --alpha(--modifier()));
+}
+
+/*
+An untyped variable selects the earliest registered branch that accepts it. Keep this
+width branch after the ring color branches so `ring-(--x)` sets the color, as in Tailwind.
+*/
+@stillwind-utility ring-* {
+  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0
+    calc(--value([length]) + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-arbitrary-property --tw-ring-offset-width;
+
+@stillwind-utility ring-offset-* {
+  --tw-ring-offset-width: calc(--value(integer) * 1px);
+  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width)
+    var(--tw-ring-offset-color);
+}
+
+@stillwind-arbitrary-property --tw-ring-offset-color;
+
+@stillwind-utility ring-offset-* {
+  --tw-ring-offset-color: --value(--color-*, current, inherit, transparent, [color]);
+}
+
+@stillwind-utility ring-offset-* {
+  --tw-ring-offset-color: --compat-color(
+    --value(--color-*, current, inherit, transparent, [color]),
+    --alpha(--modifier())
+  );
+}
+
+@stillwind-arbitrary-property --tw-inset-ring-shadow;
+
+@stillwind-utility inset-ring {
+  --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility inset-ring-* {
+  --tw-inset-ring-shadow: inset 0 0 0 calc(--value(integer) * 1px)
+    var(--tw-inset-ring-color, currentcolor);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-arbitrary-property --tw-inset-ring-color;
+
+@stillwind-utility inset-ring-* {
+  --tw-inset-ring-color: --value(--color-*, current, inherit, transparent, [color]);
+}
+
+@stillwind-utility inset-ring-* {
+  --tw-inset-ring-color: --compat-color(
+    --value(--color-*, current, inherit, transparent, [color]),
+    --alpha(--modifier())
+  );
+}
+
+@stillwind-arbitrary-property --tw-inset-shadow-color;
+
+@stillwind-utility inset-shadow-initial {
+  --tw-inset-shadow-color: initial;
+}
+
+@stillwind-arbitrary-property --tw-inset-shadow;
+
+@stillwind-utility inset-shadow-none {
+  --tw-inset-shadow: inset 0 0 #0000;
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow: --stillwind-builtin-shadow-color(--inset-shadow-*, --tw-inset-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility inset-shadow {
+  --tw-inset-shadow: --stillwind-builtin-shadow-color(--inset-shadow, --tw-inset-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+/*
+Theme inset shadows already contain `inset`, while arbitrary shadows receive it here.
+Keep this branch before the inset shadow color branches so `inset-shadow-(--x)` sets the
+shadow.
+*/
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow: inset --stillwind-builtin-shadow-color([shadow], --tw-inset-shadow-color);
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+/*
+A token shadow with a slash opacity modifier needs its authored color, rather than a
+`var()` reference. `--stillwind-builtin-shadow-color` is the registry extension for this
+CSS Color 5 relative-color operation.
+*/
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-alpha: --alpha(--modifier());
+  --tw-inset-shadow: --stillwind-builtin-shadow-color(
+    --inset-shadow-*,
+    --tw-inset-shadow-color,
+    --alpha(--modifier())
+  );
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility inset-shadow {
+  --tw-inset-shadow-alpha: --alpha(--modifier());
+  --tw-inset-shadow: --stillwind-builtin-shadow-color(
+    --inset-shadow,
+    --tw-inset-shadow-color,
+    --alpha(--modifier())
+  );
+  box-shadow:
+    var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
+    var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-color: --value(--color-*, current, inherit, transparent, [color]);
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-color: --compat-color(
+    --value(--color-*, current, transparent, [color]),
+    --alpha(--modifier()),
+    var(--tw-inset-shadow-alpha)
+  );
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-color: --value(--color-*, current, inherit, transparent);
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-color: --compat-color(
+    --value(current, transparent),
+    100%,
+    var(--tw-inset-shadow-alpha)
+  );
+}
+
+@stillwind-utility inset-shadow-* {
+  --tw-inset-shadow-color: --compat-color(
+    --value(--color-*, current, transparent),
+    --alpha(--modifier()),
+    var(--tw-inset-shadow-alpha)
+  );
+}
+
+/* MARK: `filter` */
+
+@stillwind-arbitrary-property --tw-blur;
+@stillwind-arbitrary-property --tw-brightness;
+@stillwind-arbitrary-property --tw-contrast;
+@stillwind-arbitrary-property --tw-drop-shadow*;
+@stillwind-arbitrary-property --tw-grayscale;
+@stillwind-arbitrary-property --tw-hue-rotate;
+@stillwind-arbitrary-property --tw-invert;
+@stillwind-arbitrary-property --tw-saturate;
+@stillwind-arbitrary-property --tw-sepia;
+@stillwind-arbitrary-property filter;
+
+@stillwind-utility blur-none {
+  filter: blur(0);
+}
+
+@stillwind-utility blur-none {
+  --tw-blur: ;
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility blur-* {
+  --tw-blur: blur(--value(--blur-*, [length]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility blur {
+  --tw-blur: blur(--value(--blur));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility brightness-* {
+  --tw-brightness: brightness(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility brightness-* {
+  --tw-brightness: brightness(--value(--brightness-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility brightness-* {
+  --tw-brightness: brightness(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility contrast-* {
+  --tw-contrast: contrast(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility contrast-* {
+  --tw-contrast: contrast(--value(--contrast-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility contrast-* {
+  --tw-contrast: contrast(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-arbitrary-property --tw-drop-shadow;
+
+@stillwind-utility drop-shadow-none {
+  --tw-drop-shadow:  ;
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-size: drop-shadow(
+    --stillwind-builtin-shadow-color(--drop-shadow-*, --tw-drop-shadow-color)
+  );
+  --tw-drop-shadow: drop-shadow(--value(--drop-shadow-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow {
+  --tw-drop-shadow-size: drop-shadow(
+    --stillwind-builtin-shadow-color(--drop-shadow, --tw-drop-shadow-color)
+  );
+  --tw-drop-shadow: drop-shadow(--value(--drop-shadow));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-size: drop-shadow(
+    --stillwind-builtin-shadow-color([shadow], --tw-drop-shadow-color)
+  );
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-alpha: --alpha(--modifier());
+  --tw-drop-shadow-size: drop-shadow(
+    --stillwind-builtin-shadow-color(--drop-shadow-*, --tw-drop-shadow-color, --alpha(--modifier()))
+  );
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow {
+  --tw-drop-shadow-alpha: --alpha(--modifier());
+  --tw-drop-shadow-size: drop-shadow(
+    --stillwind-builtin-shadow-color(--drop-shadow, --tw-drop-shadow-color, --alpha(--modifier()))
+  );
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-color: --value(--color-*, current, inherit, transparent, [color]);
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-color: --compat-color(
+    --value(--color-*, current, inherit, transparent, [color]),
+    --alpha(--modifier()),
+    var(--tw-drop-shadow-alpha)
+  );
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-color: --value(--color-*, current, transparent);
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+}
+
+@stillwind-arbitrary-property --tw-drop-shadow-color;
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-color: --compat-color(
+    --value(current, transparent),
+    100%,
+    var(--tw-drop-shadow-alpha)
+  );
+}
+
+@stillwind-utility drop-shadow-* {
+  --tw-drop-shadow-color: --compat-color(
+    --value(--color-*, current, transparent),
+    --alpha(--modifier()),
+    var(--tw-drop-shadow-alpha)
+  );
+  --tw-drop-shadow: var(--tw-drop-shadow-size);
+}
+
+@stillwind-utility grayscale {
+  --tw-grayscale: grayscale(100%);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility grayscale-* {
+  --tw-grayscale: grayscale(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility grayscale-* {
+  --tw-grayscale: grayscale(--value(--grayscale-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility grayscale-* {
+  --tw-grayscale: grayscale(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility hue-rotate-* {
+  --tw-hue-rotate: hue-rotate(--value([angle]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility hue-rotate-* {
+  --tw-hue-rotate: hue-rotate(--value(--hue-rotate-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility hue-rotate-* {
+  --tw-hue-rotate: hue-rotate(calc(--value(integer) * 1deg));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility -hue-rotate-* {
+  --tw-hue-rotate: hue-rotate(calc(--value(--hue-rotate-*) * -1));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility -hue-rotate-* {
+  --tw-hue-rotate: hue-rotate(calc(--value(integer) * 1deg * -1));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility invert {
+  --tw-invert: invert(100%);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility invert-* {
+  --tw-invert: invert(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility invert-* {
+  --tw-invert: invert(--value(--invert-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility invert-* {
+  --tw-invert: invert(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility saturate-* {
+  --tw-saturate: saturate(--value(--saturate-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility saturate-* {
+  --tw-saturate: saturate(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility saturate-* {
+  --tw-saturate: saturate(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility sepia {
+  --tw-sepia: sepia(100%);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility sepia-* {
+  --tw-sepia: sepia(--value(--sepia-*));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility sepia-* {
+  --tw-sepia: sepia(calc(--value(integer) * 1%));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility sepia-* {
+  --tw-sepia: sepia(--value([number-percentage]));
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,)
+    var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,)
+    var(--tw-drop-shadow,);
+}
+
+@stillwind-utility filter-none {
+  filter: none;
+}
+
+/* MARK: `backdrop-filter` */
+
+@stillwind-arbitrary-property --tw-backdrop-*;
+@stillwind-arbitrary-property backdrop-filter;
+
+@stillwind-arbitrary-property --tw-backdrop-blur;
+
+@stillwind-utility backdrop-blur-none {
+  --tw-backdrop-blur: ;
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-blur-* {
+  --tw-backdrop-blur: blur(--value([length]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-blur-* {
+  --tw-backdrop-blur: blur(--value(--backdrop-blur-*, --blur-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-blur {
+  --tw-backdrop-blur: blur(--value(--backdrop-blur, --blur));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-brightness;
+
+@stillwind-utility backdrop-brightness-* {
+  --tw-backdrop-brightness: brightness(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-brightness-* {
+  --tw-backdrop-brightness: brightness(--value(--backdrop-brightness-*, --brightness-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-brightness-* {
+  --tw-backdrop-brightness: brightness(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-contrast;
+
+@stillwind-utility backdrop-contrast-* {
+  --tw-backdrop-contrast: contrast(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-contrast-* {
+  --tw-backdrop-contrast: contrast(--value(--backdrop-contrast-*, --contrast-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-contrast-* {
+  --tw-backdrop-contrast: contrast(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-grayscale;
+
+@stillwind-utility backdrop-grayscale {
+  --tw-backdrop-grayscale: grayscale(100%);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-grayscale-* {
+  --tw-backdrop-grayscale: grayscale(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-grayscale-* {
+  --tw-backdrop-grayscale: grayscale(--value(--backdrop-grayscale-*, --grayscale-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-grayscale-* {
+  --tw-backdrop-grayscale: grayscale(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-hue-rotate;
+
+@stillwind-utility backdrop-hue-rotate-* {
+  --tw-backdrop-hue-rotate: hue-rotate(--value([angle]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-hue-rotate-* {
+  --tw-backdrop-hue-rotate: hue-rotate(--value(--backdrop-hue-rotate-*, --hue-rotate-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-hue-rotate-* {
+  --tw-backdrop-hue-rotate: hue-rotate(calc(--value(integer) * 1deg));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility -backdrop-hue-rotate-* {
+  --tw-backdrop-hue-rotate: hue-rotate(calc(--value(--backdrop-hue-rotate-*, --hue-rotate-*) * -1));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility -backdrop-hue-rotate-* {
+  --tw-backdrop-hue-rotate: hue-rotate(calc(--value(integer) * 1deg * -1));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-invert;
+
+@stillwind-utility backdrop-invert {
+  --tw-backdrop-invert: invert(100%);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-invert-* {
+  --tw-backdrop-invert: invert(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-invert-* {
+  --tw-backdrop-invert: invert(--value(--backdrop-invert-*, --invert-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-invert-* {
+  --tw-backdrop-invert: invert(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-opacity;
+
+@stillwind-utility backdrop-opacity-* {
+  --tw-backdrop-opacity: opacity(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-opacity-* {
+  --tw-backdrop-opacity: opacity(--value(--backdrop-opacity-*, --opacity-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-opacity-* {
+  --tw-backdrop-opacity: opacity(calc(--value(number [0, ∞]) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-saturate;
+
+@stillwind-utility backdrop-saturate-* {
+  --tw-backdrop-saturate: saturate(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-saturate-* {
+  --tw-backdrop-saturate: saturate(--value(--backdrop-saturate-*, --saturate-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-saturate-* {
+  --tw-backdrop-saturate: saturate(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-arbitrary-property --tw-backdrop-sepia;
+
+@stillwind-utility backdrop-sepia {
+  --tw-backdrop-sepia: sepia(100%);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-sepia-* {
+  --tw-backdrop-sepia: sepia(--value([number-percentage]));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-sepia-* {
+  --tw-backdrop-sepia: sepia(--value(--backdrop-sepia-*, --sepia-*));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+@stillwind-utility backdrop-sepia-* {
+  --tw-backdrop-sepia: sepia(calc(--value(integer) * 1%));
+  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
+    var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
+    var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
+    var(--tw-backdrop-sepia,);
+}
+
+/* MARK: `text-shadow` */
+
+@stillwind-arbitrary-property --tw-text-shadow-color;
+
+@stillwind-utility text-shadow-initial {
+  --tw-text-shadow-color: initial;
+}
+
+@stillwind-arbitrary-property text-shadow;
+
+@stillwind-utility text-shadow-none {
+  text-shadow: none;
+}
+
+@stillwind-utility text-shadow-* {
+  text-shadow: --stillwind-builtin-shadow-color(--text-shadow-*, --tw-text-shadow-color);
+}
+
+@stillwind-utility text-shadow {
+  text-shadow: --stillwind-builtin-shadow-color(--text-shadow, --tw-text-shadow-color);
+}
+
+@stillwind-utility text-shadow-* {
+  text-shadow: --stillwind-builtin-shadow-color([shadow], --tw-text-shadow-color);
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-alpha: --alpha(--modifier());
+  text-shadow: --stillwind-builtin-shadow-color(
+    --text-shadow-*,
+    --tw-text-shadow-color,
+    --alpha(--modifier())
+  );
+}
+
+@stillwind-utility text-shadow {
+  --tw-text-shadow-alpha: --alpha(--modifier());
+  text-shadow: --stillwind-builtin-shadow-color(
+    --text-shadow,
+    --tw-text-shadow-color,
+    --alpha(--modifier())
+  );
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-color: --value(--color-*, current, inherit, transparent, [color]);
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-color: --compat-color(
+    --value(--color-*, current, transparent, [color]),
+    --alpha(--modifier()),
+    var(--tw-text-shadow-alpha)
+  );
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-color: --value(--color-*, current, inherit, transparent);
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-color: --compat-color(
+    --value(current, transparent),
+    100%,
+    var(--tw-text-shadow-alpha)
+  );
+}
+
+@stillwind-utility text-shadow-* {
+  --tw-text-shadow-color: --compat-color(
+    --value(--color-*, current, transparent),
+    --alpha(--modifier()),
+    var(--tw-text-shadow-alpha)
+  );
+}