Add coerced classes + missing global variables

[ben-rogerson]

This PR adds a bunch of features to bring twin up-to-date with tailwind.

Features like:

Coerced class types

tw`text-[color:rgba(255, 255, 255, .45)]`
tw`border-[color:rgba(255, 255, 255, .45)]`

// ↓ ↓ ↓ ↓ ↓ ↓

({
  "color": "rgba(255, 255, 255, 0.45)"
});
({
  "borderColor": "rgba(255, 255, 255, 0.45)"
});

tw`ring-[color:green]` // Colors with no alpha can be combined with the opacity classes
tw`ring-[color:rgba(255, 255, 255, .45)]` // Colors with an alpha specify their own opacity so can't be combined with opacity classes
tw`ring-[length:10px]`

// ↓ ↓ ↓ ↓ ↓ ↓
({
  "--tw-ring-opacity": "1",
  "--tw-ring-color": "rgba(0, 128, 0, var(--tw-ring-opacity))"
});
({
  "--tw-ring-color": "rgba(255, 255, 255, 0.45)"
});
({
  "--tw-ring-offset-shadow": "var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)",
  "--tw-ring-shadow": "var(--tw-ring-inset) 0 0 0 calc(10px + var(--tw-ring-offset-width)) var(--tw-ring-color)",
  "boxShadow": "var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)"
});

New global variable set

Some of these are existing, but I've synced them all up with the Tailwind JIT which nests them under the *, ::before, ::after" selectors.

"*, ::before, ::after": {
  "boxSizing": "border-box",
  "borderWidth": "0",
  "borderStyle": "solid",
  "--tw-border-opacity": "1",
  "borderColor": "rgba(229, 231, 235, var(--tw-border-opacity))",
  "--tw-translate-x": "0",
  "--tw-translate-y": "0",
  "--tw-rotate": "0",
  "--tw-skew-x": "0",
  "--tw-skew-y": "0",
  "--tw-scale-x": "1",
  "--tw-scale-y": "1",
  "--tw-transform": "translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))",
  "--tw-ring-inset": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-ring-offset-width": "0px",
  "--tw-ring-offset-color": "#fff",
  "--tw-ring-color": "rgba(59, 130, 246, 0.5)",
  "--tw-ring-offset-shadow": "0 0 #0000",
  "--tw-ring-shadow": "0 0 #0000",
  "--tw-shadow": "0 0 #0000",
  "--tw-blur": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-brightness": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-contrast": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-grayscale": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-hue-rotate": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-invert": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-saturate": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-sepia": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-drop-shadow": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-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)",
  "--tw-backdrop-blur": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-brightness": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-contrast": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-grayscale": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-hue-rotate": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-invert": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-opacity": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-saturate": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-backdrop-sepia": "var(--tw-empty,/*!*/ /*!*/)",
  "--tw-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)"
},

All of the classes that use these new global variables have been updated too.