Multi-Theme CSS Generation -- 3

I will provide a set of 30 reference sites and I need you to distill each one into a clean, reusable theme. Every theme must go beyond a simple colour-swap: it should capture the full typography palette and replicate every CSS token (border, radii, shadows, animations, background, etc.) so that I can drop the result into my design-system build pipeline.

Here is what matters most:
• The css should completely replicate the reference website themes
• All CSS properties inclusing page/section background, typography etc must match the source pixel-for-pixel; headings, body text, UI labels and any special font treatments should feel identical.
• All CSS properties should be delivered in a single css file per theme alongside a compiled demo page that shows the css in action.

You will receive:
1. A list of live websites and, where available, their design guidelines.
2. My component library so you can test each theme quickly.
3. an index.css with classes used in my component library, you need to edit this file only.

Deliverables for each site:
– index.css that replicates the themes
– image of every component in each theme
– image of a page created with the index.css


Acceptance criteria:
✓ Visual parity between demo page, components and the supplied reference site when the variables are swapped in
✓ No changes in component library
✓ Responsive desing

If you are experienced with design-system theming and have an eye for precise typography, I would love to see a short sample or a link to past token-based work.