Fix CSS variable syntax in adding-custom-styles docs to use --spacing (#2312)

## Summary
• Fix CSS variable syntax from `var(--spacing-6)` to `--spacing(6)` in
custom styles documentation
• Update to align with Tailwind CSS v4 variable syntax conventions

## Test plan
- [ ] Verify the documentation renders correctly
- [ ] Confirm the CSS variable syntax matches Tailwind v4 conventions

---------

Co-authored-by: Jordan Pittman <jordan@cryptica.me>

Author: philipp-spiess

src/docs/adding-custom-styles.mdx

@@ -264,8 +264,8 @@ Traditionally these would be classes like `card`, `btn`, `badge` — that kind o
 @layer components {
   .card {
     background-color: var(--color-white);
-    border-radius: var(--rounded-lg);
-    padding: var(--spacing-6);
+    border-radius: var(--radius-lg);
+    padding: --spacing(6);
     box-shadow: var(--shadow-xl);
   }
   /* [!code highlight:2] */