diff --git a/apps/stage-tamagotchi/package.json b/apps/stage-tamagotchi/package.json
index de9e9674c..babadea31 100644
--- a/apps/stage-tamagotchi/package.json
+++ b/apps/stage-tamagotchi/package.json
@@ -122,6 +122,7 @@
     "@vueuse/motion": "^3.0.3",
     "@xsai-transformers/embed": "^0.0.7",
     "cac": "^6.7.14",
+    "csstype": "^3.1.3",
     "execa": "^9.6.0",
     "less": "^4.4.0",
     "unocss-preset-scrollbar": "^3.2.0",
diff --git a/apps/stage-web/package.json b/apps/stage-web/package.json
index dd93ccf32..0fb6ce752 100644
--- a/apps/stage-web/package.json
+++ b/apps/stage-web/package.json
@@ -111,6 +111,7 @@
     "@vitejs/plugin-vue": "^6.0.0",
     "@vue-macros/volar": "^3.0.0-beta.17",
     "@vueuse/motion": "^3.0.3",
+    "csstype": "^3.1.3",
     "execa": "^9.6.0",
     "hfup": "^0.6.2",
     "less": "^4.3.0",
diff --git a/cspell.config.yaml b/cspell.config.yaml
index d837a4025..d326512c4 100644
--- a/cspell.config.yaml
+++ b/cspell.config.yaml
@@ -45,6 +45,7 @@ words:
   - crossws
   - csmmap
   - csmvector
+  - csstype
   - cubismbreath
   - cubismdebug
   - cubismdefaultparameterid
diff --git a/packages/stage-ui/histoire.config.ts b/packages/stage-ui/histoire.config.ts
index 132b3d5f2..208071e0e 100644
--- a/packages/stage-ui/histoire.config.ts
+++ b/packages/stage-ui/histoire.config.ts
@@ -26,6 +26,7 @@ export default defineConfig({
   viteNodeTransformMode: {
     web: [
       /\.web\.vue$/,
+      /\.web\.story\.vue$/,
     ],
   },
   tree: {
@@ -42,22 +43,26 @@ export default defineConfig({
         id: 'form',
         title: 'Form',
       },
-      {
-        id: 'menu',
-        title: 'Menu',
-      },
-      {
-        id: 'providers',
-        title: 'Providers',
-      },
       {
         id: 'misc',
         title: 'Misc',
       },
+      {
+        id: 'data-pane',
+        title: 'Data Pane',
+      },
+      {
+        id: 'menu',
+        title: 'Menu',
+      },
       {
         id: 'widgets',
         title: 'Widgets',
       },
+      {
+        id: 'gadgets',
+        title: 'Gadgets',
+      },
       {
         id: 'physics',
         title: 'Physics',
@@ -67,12 +72,8 @@ export default defineConfig({
         title: 'Graphics',
       },
       {
-        id: 'gadgets',
-        title: 'Gadgets',
-      },
-      {
-        id: 'data-gui',
-        title: 'Data GUI',
+        id: 'providers',
+        title: 'Providers',
       },
     ],
   },
diff --git a/packages/stage-ui/package.json b/packages/stage-ui/package.json
index 67204f5ea..c83e82f63 100644
--- a/packages/stage-ui/package.json
+++ b/packages/stage-ui/package.json
@@ -142,6 +142,7 @@
     "@unocss/reset": "^66.3.3",
     "@vitejs/plugin-vue": "^6.0.0",
     "clustr": "^0.0.3",
+    "csstype": "^3.1.3",
     "histoire": "1.0.0-alpha.2",
     "unocss": "^66.3.3",
     "unplugin-info": "^1.2.2",
diff --git a/packages/stage-ui/src/components/DataPane/ColorPicker.vue b/packages/stage-ui/src/components/DataPane/ColorPicker.vue
new file mode 100644
index 000000000..cdf1c87e8
--- /dev/null
+++ b/packages/stage-ui/src/components/DataPane/ColorPicker.vue
@@ -0,0 +1,159 @@
+<script lang="ts" setup>
+import type { DataType, Globals } from 'csstype'
+
+import { useEventListener, useMouseInElement } from '@vueuse/core'
+import { convertHsvToRgb } from 'culori'
+import { computed, onMounted, ref } from 'vue'
+
+const hue = ref(0)
+const modelValue = defineModel<Globals | DataType.Color>({ required: false })
+
+const showPicker = ref(false)
+const colorMapRef = ref<HTMLDivElement>()
+
+const { elementX, elementY } = useMouseInElement(colorMapRef)
+
+// Track dragging state
+const isDragging = ref(false)
+const pickerX = ref(0)
+const pickerY = ref(0)
+
+// Calculate color based on picker position
+const currentColor = computed(() => {
+  if (!colorMapRef.value)
+    return modelValue.value
+
+  const rect = colorMapRef.value.getBoundingClientRect()
+  const x = Math.max(0, Math.min(pickerX.value, rect.width))
+  const y = Math.max(0, Math.min(pickerY.value, rect.height))
+
+  const saturation = (x) / rect.width * 100
+  const value = (rect.height - y) / rect.height * 100
+
+  const rgb = convertHsvToRgb({ h: hue.value, s: saturation, v: value })
+  return `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`
+})
+
+// Enhanced mousedown to hide cursor globally
+function handleMouseDown(event: MouseEvent) {
+  isDragging.value = true
+  updatePickerPosition()
+  event.preventDefault()
+}
+
+function updatePickerPosition() {
+  if (!colorMapRef.value)
+    return
+
+  const rect = colorMapRef.value.getBoundingClientRect()
+
+  pickerX.value = Math.max(0, Math.min(elementX.value, rect.width))
+  pickerY.value = Math.max(0, Math.min(elementY.value, rect.height))
+}
+
+function handleMouseMove() {
+  if (isDragging.value) {
+    updatePickerPosition()
+  }
+}
+
+function handleGlobalMouseMove(event: MouseEvent) {
+  if (isDragging.value) {
+    if (colorMapRef.value) {
+      const rect = colorMapRef.value.getBoundingClientRect()
+      const globalX = event.clientX - rect.left
+      const globalY = event.clientY - rect.top
+
+      pickerX.value = Math.max(0, Math.min(globalX, rect.width))
+      pickerY.value = Math.max(0, Math.min(globalY, rect.height))
+
+      modelValue.value = currentColor.value as Globals | DataType.Color
+    }
+  }
+}
+
+function handleGlobalMouseUp() {
+  if (isDragging.value) {
+    handleDragEnd()
+  }
+}
+
+function handleDragEnd() {
+  if (isDragging.value) {
+    modelValue.value = currentColor.value as Globals | DataType.Color
+    isDragging.value = false
+  }
+}
+
+onMounted(() => {
+  useEventListener('mousemove', handleGlobalMouseMove)
+  useEventListener('mouseup', handleGlobalMouseUp)
+})
+</script>
+
+<template>
+  <div h-full w-full>
+    <div relative w-full class="data-pane-teleport-wrapper">
+      <label>
+        <div min-h-5 :style="{ backgroundColor: modelValue }" />
+        <input v-model="showPicker" type="checkbox" invisible absolute appearance-none>
+      </label>
+      <div v-if="showPicker" translate-y="100%" absolute bottom--3 left-0 z-10 h-70 w-90 overflow-hidden rounded-xl>
+        <div bg="white dark:neutral-900" h-full w-full p-2>
+          <div
+            ref="colorMapRef"
+            class="color-map"
+            :style="{ cursor: isDragging ? 'none' : 'crosshair' }"
+            rounded-md
+            @mousedown="handleMouseDown"
+            @mousemove="handleMouseMove"
+          >
+            <div
+              class="color-picker"
+              absolute
+              :style="{
+                top: `${pickerY - 12}px`,
+                left: `${pickerX - 12}px`,
+                transform: isDragging ? 'scale(1.2)' : '',
+              }"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.color-map::before {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background-image: linear-gradient(to bottom, transparent, black);
+}
+
+.color-map {
+  width: 100%;
+  height: 100%;
+  background-image: linear-gradient(to left, rgb(255, 0, 0), white);
+  display: inline-block;
+  position: relative;
+  overflow: hidden;
+  cursor: crosshair;
+  user-select: none;
+}
+
+.color-picker {
+  width: 24px;
+  height: 24px;
+  display: inline-block;
+  position: absolute;
+  border-radius: 50%;
+  border: 2px solid white;
+  pointer-events: none;
+  transition: transform 0.15s ease-in-out;
+}
+</style>
diff --git a/packages/stage-ui/src/components/DataGui/Range.story.vue b/packages/stage-ui/src/components/DataPane/Range.story.vue
similarity index 88%
rename from packages/stage-ui/src/components/DataGui/Range.story.vue
rename to packages/stage-ui/src/components/DataPane/Range.story.vue
index cd8131c37..87645acaa 100644
--- a/packages/stage-ui/src/components/DataGui/Range.story.vue
+++ b/packages/stage-ui/src/components/DataPane/Range.story.vue
@@ -9,7 +9,7 @@ const maxValue = ref(100)
 </script>
 
 <template>
-  <Story title="Range" group="data-gui" :layout="{ type: 'grid', width: 500 }">
+  <Story title="Range" group="data-pane" :layout="{ type: 'grid', width: 500 }">
     <template #controls>
       <ThemeColorsHueControl />
     </template>
diff --git a/packages/stage-ui/src/components/DataGui/Range.vue b/packages/stage-ui/src/components/DataPane/Range.vue
similarity index 100%
rename from packages/stage-ui/src/components/DataGui/Range.vue
rename to packages/stage-ui/src/components/DataPane/Range.vue
diff --git a/packages/stage-ui/src/components/DataPane/index.story.vue b/packages/stage-ui/src/components/DataPane/index.story.vue
new file mode 100644
index 000000000..f6ed11d3c
--- /dev/null
+++ b/packages/stage-ui/src/components/DataPane/index.story.vue
@@ -0,0 +1,162 @@
+<script setup lang="ts">
+import type { DataType, Globals } from 'csstype'
+import type { Ref } from 'vue'
+
+import { ref } from 'vue'
+
+import ColorPicker from './ColorPicker.vue'
+
+type DataPaneSchemaTypes
+  = | DataPaneSchemaNumber
+    | DataPaneSchemaColor
+    | DataPaneSchemaString
+    | DataPaneSchemaBoolean
+    | DataPaneSchemaSelect
+    | DataPaneSchemaJSON
+    | DataPaneSchemaPoint
+    | DataPaneSchemaFile
+    | DataPaneSchemaDate
+
+interface DataPaneSchema {
+  [key: string]: DataPaneSchemaTypes
+}
+
+interface DataPaneSchemaNumber {
+  type: 'number'
+  default?: number
+  min?: number
+  max?: number
+  step?: number
+  label?: string
+}
+
+interface DataPaneSchemaColor {
+  type: 'color'
+  default?: string
+  defaultMode?: 'hex' | 'rgb' | 'hsl'
+  label?: string
+}
+
+interface DataPaneSchemaString {
+  type: 'string'
+  default?: string
+  label?: string
+}
+
+interface DataPaneSchemaBoolean {
+  type: 'boolean'
+  default?: boolean
+  label?: string
+}
+
+interface DataPaneSchemaSelect {
+  type: 'select'
+  options: Array<string> | Array<{ label: string, value: string }>
+  default?: string
+  label?: string
+}
+
+interface DataPaneSchemaJSON {
+  type: 'json'
+  default?: string
+  label?: string
+}
+
+interface DataPaneSchemaPoint {
+  type: 'point'
+  default?: { x: number, y: number }
+  label?: string
+}
+
+interface DataPaneSchemaFile {
+  type: 'file'
+  default?: File
+  label?: string
+}
+
+interface DataPaneSchemaDate {
+  type: 'date'
+  default?: Date
+  label?: string
+}
+
+type SchemaToValueType<T extends DataPaneSchemaTypes>
+  = T extends DataPaneSchemaNumber ? number
+    : T extends DataPaneSchemaColor ? Globals | DataType.Color
+      : T extends DataPaneSchemaString ? string
+        : T extends DataPaneSchemaBoolean ? boolean
+          : T extends DataPaneSchemaSelect ? string
+            : T extends DataPaneSchemaJSON ? string
+              : T extends DataPaneSchemaPoint ? { x: number, y: number }
+                : T extends DataPaneSchemaFile ? File
+                  : T extends DataPaneSchemaDate ? Date
+                    : never
+
+type InferDataPaneType<T extends DataPaneSchema> = {
+  [K in keyof T]: SchemaToValueType<T[K]>
+}
+
+function useDataPane<T extends DataPaneSchema>(schema: T): {
+  data: Ref<InferDataPaneType<T>>
+  schema: { [K in keyof InferDataPaneType<T>]: T[K] }
+  states: Ref<Record<keyof T, unknown>>
+  stateOf: <S>(key: string) => S
+} {
+  const data = ref<InferDataPaneType<T>>({} as any)
+  const states = ref<Record<keyof T, any>>({} as Record<keyof T, unknown>)
+
+  function initStateFor(key: string, defaultValue: unknown) {
+    if (!states.value[key]) {
+      states.value[key] = defaultValue
+    }
+  }
+
+  function stateOf<S>(key: string): S {
+    return states.value[key]
+  }
+
+  for (const key in schema) {
+    const fieldSchema = schema[key]
+    if (fieldSchema.default !== undefined) {
+      data.value[key] = fieldSchema.default as SchemaToValueType<typeof fieldSchema>
+    }
+
+    if (fieldSchema.type === 'color') {
+      initStateFor(key, { showColorPicker: false })
+    }
+  }
+
+  return {
+    data: data as Ref<InferDataPaneType<T>>,
+    schema,
+    states: states as Ref<Record<keyof T, unknown>>,
+    stateOf,
+  }
+}
+
+const { data, schema } = useDataPane({
+  number: { type: 'number', default: 50, min: 0, max: 100, step: 0.01, label: 'Number' },
+  color: { type: 'color', default: '#ff0000', defaultMode: 'hex', label: 'Color' },
+})
+</script>
+
+<template>
+  <Story title="Data Pane" group="data-pane" :layout="{ type: 'grid', width: 500 }">
+    <template #controls>
+      <ThemeColorsHueControl />
+    </template>
+
+    <Variant id="default-min" title="Default">
+      <div h-100 flex flex-col>
+        <template v-for="(fieldSchema, fieldName) in schema" :key="fieldName">
+          <template v-if="fieldSchema.type === 'number'">
+            <input v-model="data[fieldName]" type="number" class="data-pane">
+          </template>
+          <template v-if="fieldSchema.type === 'color'">
+            <ColorPicker v-model="data[fieldName] as Globals | DataType.Color" />
+          </template>
+        </template>
+      </div>
+    </Variant>
+  </Story>
+</template>
diff --git a/packages/stage-ui/src/components/DataGui/index.ts b/packages/stage-ui/src/components/DataPane/index.ts
similarity index 100%
rename from packages/stage-ui/src/components/DataGui/index.ts
rename to packages/stage-ui/src/components/DataPane/index.ts
diff --git a/packages/stage-ui/src/components/index.ts b/packages/stage-ui/src/components/index.ts
index 4557ac828..170f0fce9 100644
--- a/packages/stage-ui/src/components/index.ts
+++ b/packages/stage-ui/src/components/index.ts
@@ -1,4 +1,4 @@
-export * from './DataGui'
+export * from './DataPane'
 export * from './Gadgets'
 export * from './Graphics'
 export * from './Layouts'
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a6e24d403..73b87e00e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -339,6 +339,9 @@ importers:
       '@tresjs/core':
         specifier: ^4.3.6
         version: 4.3.6(three@0.178.0)(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3))
+      '@tweakpane/core':
+        specifier: ^2.0.5
+        version: 2.0.5
       '@types/audioworklet':
         specifier: ^0.0.81
         version: 0.0.81
@@ -435,6 +438,9 @@ importers:
       three:
         specifier: ^0.178.0
         version: 0.178.0
+      tweakpane:
+        specifier: ^4.0.5
+        version: 4.0.5
       unified:
         specifier: ^11.0.5
         version: 11.0.5
@@ -580,6 +586,9 @@ importers:
       cac:
         specifier: ^6.7.14
         version: 6.7.14
+      csstype:
+        specifier: ^3.1.3
+        version: 3.1.3
       execa:
         specifier: ^9.6.0
         version: 9.6.0
@@ -679,6 +688,9 @@ importers:
       '@tresjs/core':
         specifier: ^4.3.6
         version: 4.3.6(three@0.178.0)(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3))
+      '@tweakpane/core':
+        specifier: ^2.0.5
+        version: 2.0.5
       '@valibot/to-json-schema':
         specifier: 1.0.0-rc.0
         version: 1.0.0-rc.0(valibot@1.0.0-beta.9(typescript@5.8.3))
@@ -790,6 +802,9 @@ importers:
       three:
         specifier: ^0.178.0
         version: 0.178.0
+      tweakpane:
+        specifier: ^4.0.5
+        version: 4.0.5
       unified:
         specifier: ^11.0.5
         version: 11.0.5
@@ -896,6 +911,9 @@ importers:
       '@vueuse/motion':
         specifier: ^3.0.3
         version: 3.0.3(magicast@0.3.5)(rollup@2.79.2)(vue@3.5.17(typescript@5.8.3))
+      csstype:
+        specifier: ^3.1.3
+        version: 3.1.3
       execa:
         specifier: ^9.6.0
         version: 9.6.0
@@ -1046,7 +1064,7 @@ importers:
         version: 0.1.3
       unplugin-yaml:
         specifier: ^3.0.2
-        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
+        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
       vitepress:
         specifier: ^2.0.0-alpha.8
         version: 2.0.0-alpha.8(@algolia/client-search@5.32.0)(@types/node@24.0.15)(change-case@5.4.4)(fuse.js@7.1.0)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(nprogress@0.2.0)(postcss@8.5.6)(react@18.3.1)(search-insights@2.17.3)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0)
@@ -1092,7 +1110,7 @@ importers:
     devDependencies:
       unplugin-yaml:
         specifier: ^3.0.2
-        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
+        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
 
   packages/memory-pgvector:
     dependencies:
@@ -1244,6 +1262,9 @@ importers:
       '@tresjs/core':
         specifier: ^4.3.6
         version: 4.3.6(three@0.178.0)(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3))
+      '@tweakpane/core':
+        specifier: ^2.0.5
+        version: 2.0.5
       '@vueuse/core':
         specifier: ^13.5.0
         version: 13.5.0(vue@3.5.17(typescript@5.8.3))
@@ -1340,6 +1361,9 @@ importers:
       three:
         specifier: ^0.178.0
         version: 0.178.0
+      tweakpane:
+        specifier: ^4.0.5
+        version: 4.0.5
       unified:
         specifier: ^11.0.5
         version: 11.0.5
@@ -1455,6 +1479,9 @@ importers:
       clustr:
         specifier: ^0.0.3
         version: 0.0.3
+      csstype:
+        specifier: ^3.1.3
+        version: 3.1.3
       histoire:
         specifier: 1.0.0-alpha.2
         version: 1.0.0-alpha.2(@types/node@24.0.15)(bufferutil@4.0.9)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(utf-8-validate@5.0.10)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
@@ -1466,7 +1493,7 @@ importers:
         version: 1.2.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(esbuild@0.25.5)(rollup@4.45.1)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
       unplugin-yaml:
         specifier: ^3.0.2
-        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
+        version: 3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
       vite:
         specifier: ^6.3.5
         version: 6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)
@@ -5384,6 +5411,9 @@ packages:
       three: '>=0.133'
       vue: '>=3.4'
 
+  '@tweakpane/core@2.0.5':
+    resolution: {integrity: sha512-punBgD5rKCF5vcNo6BsSOXiDR/NSs9VM7SG65QSLJIxfRaGgj54ree9zQW6bO3pNFf3AogiGgaNODUVQRk9YqQ==}
+
   '@tweenjs/tween.js@23.1.3':
     resolution: {integrity: sha512-vJmvvwFxYuGnF2axRtPYocag6Clbb5YS7kLL+SO/TeVFzHqDIWrNKYtcsPMibjDx9O+bu+psAy9NKfWklassUA==}
 
@@ -11828,6 +11858,9 @@ packages:
     resolution: {integrity: sha512-eZ7wI6KjtT1eBqCnh2JPXWNUAxtoxxfi6VdBdZFvil0ychCOTxbm7YLRBi1JSt7U3c+u3CLxpoPxLdvr/Npr3A==}
     hasBin: true
 
+  tweakpane@4.0.5:
+    resolution: {integrity: sha512-rxEXdSI+ArlG1RyO6FghC4ZUX8JkEfz8F3v1JuteXSV0pEtHJzyo07fcDG+NsJfN5L39kSbCYbB9cBGHyuI/tQ==}
+
   type-check@0.4.0:
     resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
     engines: {node: '>= 0.8.0'}
@@ -16726,6 +16759,8 @@ snapshots:
     transitivePeerDependencies:
       - typescript
 
+  '@tweakpane/core@2.0.5': {}
+
   '@tweenjs/tween.js@23.1.3': {}
 
   '@tybys/wasm-util@0.10.0':
@@ -18686,6 +18721,107 @@ snapshots:
       - yaml
     optional: true
 
+  astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0):
+    dependencies:
+      '@astrojs/compiler': 2.12.2
+      '@astrojs/internal-helpers': 0.6.1
+      '@astrojs/markdown-remark': 6.3.2
+      '@astrojs/telemetry': 3.3.0
+      '@capsizecss/unpack': 2.4.0(encoding@0.1.13)
+      '@oslojs/encoding': 1.1.0
+      '@rollup/pluginutils': 5.2.0(rollup@4.45.1)
+      acorn: 8.15.0
+      aria-query: 5.3.2
+      axobject-query: 4.1.0
+      boxen: 8.0.1
+      ci-info: 4.2.0
+      clsx: 2.1.1
+      common-ancestor-path: 1.0.1
+      cookie: 1.0.2
+      cssesc: 3.0.0
+      debug: 4.4.1
+      deterministic-object-hash: 2.0.2
+      devalue: 5.1.1
+      diff: 5.2.0
+      dlv: 1.1.3
+      dset: 3.1.4
+      es-module-lexer: 1.7.0
+      esbuild: 0.25.5
+      estree-walker: 3.0.3
+      flattie: 1.1.1
+      fontace: 0.3.0
+      github-slugger: 2.0.0
+      html-escaper: 3.0.3
+      http-cache-semantics: 4.2.0
+      import-meta-resolve: 4.1.0
+      js-yaml: 4.1.0
+      kleur: 4.1.5
+      magic-string: 0.30.17
+      magicast: 0.3.5
+      mrmime: 2.0.1
+      neotraverse: 0.6.18
+      p-limit: 6.2.0
+      p-queue: 8.1.0
+      package-manager-detector: 1.3.0
+      picomatch: 4.0.2
+      prompts: 2.4.2
+      rehype: 13.0.2
+      semver: 7.7.2
+      shiki: 3.8.1
+      tinyexec: 0.3.2
+      tinyglobby: 0.2.14
+      tsconfck: 3.1.6(typescript@5.8.3)
+      ultrahtml: 1.6.0
+      unifont: 0.5.2
+      unist-util-visit: 5.0.0
+      unstorage: 1.16.0
+      vfile: 6.0.3
+      vite: 6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)
+      vitefu: 1.0.7(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))
+      xxhash-wasm: 1.1.0
+      yargs-parser: 21.1.1
+      yocto-spinner: 0.2.3
+      zod: 3.25.76
+      zod-to-json-schema: 3.24.6(zod@3.25.76)
+      zod-to-ts: 1.2.0(typescript@5.8.3)(zod@3.25.76)
+    optionalDependencies:
+      sharp: 0.33.5
+    transitivePeerDependencies:
+      - '@azure/app-configuration'
+      - '@azure/cosmos'
+      - '@azure/data-tables'
+      - '@azure/identity'
+      - '@azure/keyvault-secrets'
+      - '@azure/storage-blob'
+      - '@capacitor/preferences'
+      - '@deno/kv'
+      - '@netlify/blobs'
+      - '@planetscale/database'
+      - '@types/node'
+      - '@upstash/redis'
+      - '@vercel/blob'
+      - '@vercel/kv'
+      - aws4fetch
+      - db0
+      - encoding
+      - idb-keyval
+      - ioredis
+      - jiti
+      - less
+      - lightningcss
+      - rollup
+      - sass
+      - sass-embedded
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+      - tsx
+      - typescript
+      - uploadthing
+      - yaml
+    optional: true
+
   async-mutex@0.3.2:
     dependencies:
       tslib: 2.8.1
@@ -24984,6 +25120,8 @@ snapshots:
       turbo-windows-64: 2.5.5
       turbo-windows-arm64: 2.5.5
 
+  tweakpane@4.0.5: {}
+
   type-check@0.4.0:
     dependencies:
       prelude-ls: 1.2.1
@@ -25571,7 +25709,7 @@ snapshots:
       rollup: 4.45.1
       vite: rolldown-vite@7.0.9(@types/node@24.0.15)(esbuild@0.25.5)(jiti@2.4.2)(less@4.4.0)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)
 
-  unplugin-yaml@3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)):
+  unplugin-yaml@3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)):
     dependencies:
       '@rollup/pluginutils': 5.2.0(rollup@4.45.1)
       unplugin: 2.3.5
@@ -25579,13 +25717,13 @@ snapshots:
     optionalDependencies:
       '@nuxt/kit': 3.14.1592(magicast@0.3.5)(rollup@4.45.1)
       '@nuxt/schema': 3.14.1592(magicast@0.3.5)(rollup@4.45.1)
-      astro: 5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0)
+      astro: 5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0)
       esbuild: 0.25.5
       rolldown: 1.0.0-beta.29
       rollup: 4.45.1
       vite: 6.3.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)
 
-  unplugin-yaml@3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)):
+  unplugin-yaml@3.0.2(@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.45.1))(astro@5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0))(esbuild@0.25.5)(rolldown@1.0.0-beta.29)(rollup@4.45.1)(vite@7.0.5(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)):
     dependencies:
       '@rollup/pluginutils': 5.2.0(rollup@4.45.1)
       unplugin: 2.3.5
@@ -25593,7 +25731,7 @@ snapshots:
     optionalDependencies:
       '@nuxt/kit': 3.14.1592(magicast@0.3.5)(rollup@4.45.1)
       '@nuxt/schema': 3.14.1592(magicast@0.3.5)(rollup@4.45.1)
-      astro: 5.10.1(@types/node@24.0.15)(encoding@0.1.13)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0)
+      astro: 5.10.1(@types/node@24.0.15)(jiti@2.4.2)(less@4.4.0)(lightningcss@1.30.1)(rollup@4.45.1)(terser@5.43.1)(tsx@4.20.3)(typescript@5.8.3)(yaml@2.8.0)
       esbuild: 0.25.5
       rolldown: 1.0.0-beta.29
       rollup: 4.45.1