Tailwind Catalyst complexity

Anyone else try Tailwind Catalyst and think it's just too complex? I want to use it because I like Tailwind, Catalyst is visually very appealing, and it's by the Tailwind team themselves so it feels very "official". But goddam it's overwhelming at first blush.

It has classes like this:

after:shadow-[inset_0_1px_--theme(--color-white/15%)]

and this:

const colors = {
  'dark/zinc': [
    '[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]/25',
    '[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:var(--color-zinc-700)]/90',
  ]
}

Types like this:

type ButtonProps = (
  | { color?: keyof typeof styles.colors; outline?: never; plain?: never }
  | { color?: never; outline: true; plain?: never }
  | { color?: never; outline?: never; plain: true }
) & { className?: string; children: React.ReactNode } & (
    | Omit<Headless.ButtonProps, 'as' | 'className'>
    | Omit<React.ComponentPropsWithoutRef<typeof Link>, 'className'>
  )

Uses slots and data attribute everywhere for styling:

// Control layout
'*:data-[slot=control]:col-start-2 *:data-[slot=control]:self-start sm:*:data-[slot=control]:mt-0.5',
// Label layout
'*:data-[slot=label]:col-start-1 *:data-[slot=label]:row-start-1',
// Description layout
'*:data-[slot=description]:col-start-1 *:data-[slot=description]:row-start-2',

The Button component itself is 204 lines of code and 13kb (sure it's mostly color variants, ripping out the ones I don't need brings it down to just 120 lines...for a button)

https://preview.redd.it/vpvdgtsivhhf1.png?width=1548&format=png&auto=webp&s=cd00577fb5c085aa6f8d60ef7f1527934a07eb0c

Like I get it I don't have to use it, it's opinionated, it needs to cover all use cases, and it's meant to be adapted to your needs, but I can barely makes heads or tails of some of this.