Theme verification: buttons look identical across all themes (gradient from primary bleeds through)

[jerrythomas]

Description

On /playground/themes, all button variants look nearly identical across every theme. The Default, Primary, Secondary etc. buttons all render with what appears to be a gradient from the primary token, making it impossible to visually differentiate themes.

Expected Behavior

Each theme should produce distinct button styling. For example:

• shadcn: flat border, no gradient
• daisy-ui: rounded pill, solid fill
• material: elevated shadow, ripple-style
• rokkit: current gradient style

Root Cause Hypothesis

The base/global button CSS may be applying a gradient unconditionally, overriding theme-specific button styles. The data-style scoping may not be correctly applied to the data-button selector in theme CSS.

Steps to Reproduce

1. Open /playground/themes
2. Compare button rows across all 10 themes — they all look the same

Affected Files

• packages/themes/src/*/ — check that each theme's button styles properly scope to [data-style="{theme}"] [data-button]
• packages/themes/src/base/ — check that base button styles don't override theme styles

[jerrythomas]

Resolved — the themes comparison page already uses components from @rokkit/ui. All 10 themes have button.css with properly scoped data-style selectors.