fix: preserve light-dark() in the built playground so theme switching works

Author: comhon-project

docs/Installation.md

@@ -36,6 +36,8 @@ import "@query-kit/themes/default";
 
 The default theme uses CSS custom variables for easy customization and supports dark mode via `prefers-color-scheme`.
 
+> **Switching light/dark manually?** The theme colors use the CSS `light-dark()` function, which follows the OS automatically. If you instead toggle the scheme by setting the `color-scheme` property yourself, make sure your build keeps `light-dark()` intact: with conservative browser targets (such as Vite's default `baseline-widely-available`), it is rewritten to a `prefers-color-scheme` fallback that only follows the OS, and manual toggling silently stops working. Set your build's CSS target to browsers that support it natively (Chrome 123+, Firefox 120+, Safari 17.5+). For Vite, this is the `build.cssTarget` option.
+
 3. To use the built-in theme icons, pass `'default'` to the `icons` option:
 ```js
 app.use(plugin, {
@@ -53,6 +55,7 @@ import {
   plugin,    // Vue plugin to install via app.use()
   locale,    // Ref<string> for runtime locale switching
   InputComponent, // Wrapper to attach settings to a custom input component
+  computeFilter, // Build a server-ready filter from a raw filter
   getEntitySchema,
   getEntityTranslation,
   getPropertyTranslation,

packages/vue/vite.playground.config.js

@@ -15,6 +15,13 @@ export default defineConfig(({ mode }) => ({
   root: './playground',
   resolve,
   build: {
+    // Preserve light-dark() in the theme CSS. Vite 8's default target
+    // ('baseline-widely-available') makes lightningcss lower light-dark() into a
+    // prefers-color-scheme polyfill, which only follows the OS and ignores the
+    // `color-scheme` the theme switcher forces. Targeting browsers that support
+    // light-dark() natively keeps it intact so manual light/dark switching works
+    // in the built site.
+    cssTarget: ['chrome123', 'firefox120', 'safari17.5'],
     outDir: '../dist-playground',
     emptyOutDir: true,
   },