Themes playground: add Themes section to sidebar with per-component-group comparison pages

[jerrythomas]

Description

The /playground/themes page currently shows all 10 themes stacked vertically with buttons, inputs, toggles, and cards. It works as a quick overview but makes it hard to compare themes across specific component groups.

Proposed Changes

1. Add a "Themes" section to the playground sidebar — currently there is no Themes section in site/src/routes/(play)/playground/+layout.svelte.

2. Create per-component-group comparison pages under /playground/themes/:

   • /playground/themes/inputs — all 10 themes × input, button, toggle, switch, range, rating
   • /playground/themes/navigation — all 10 themes × list, tree, menu, select, multi-select
   • /playground/themes/display — all 10 themes × card, pill, alert-list, message, table
   • /playground/themes/forms — all 10 themes × form elements
   • /playground/themes/feedback — all 10 themes × progress, stepper, status-list

Each page renders the same component group in a grid of data-style="{theme}" sections so differences are immediately visible side-by-side.

Affected Files

• site/src/routes/(play)/playground/+layout.svelte — add Themes section to sidebar
• site/src/routes/(play)/playground/themes/ — new sub-route pages per group

[jerrythomas]

Done — added Themes section to playground sidebar with 5 comparison pages: Inputs & Buttons, Cards, Core Components, Navigation, Feedback & Display. Each page shows all 10 themes side-by-side.