feat(app): glassmorphism chat UI with widget embed system

- Glassmorphism chat window matching Proux design rules (glass layers,
  gradient backgrounds, glow effects, blur intensities, inner glows)
- Conversation ID displayed in header, side-switching (left/right layout)
- Chat store with Pinia: conversations, messages, streaming state
- OpenRouter AI integration with SSE streaming (Llama 4 Maverick free model)
- Chat components: ChatWindow, ChatHeader, ChatInput, ChatMessage,
  StreamingDots (typing indicator)
- Embeddable widget system: floating action button (FAB) + modal popup
  with scale-in animation, side-aware positioning
- Widget demo page (/widget-demo) showing AIUI embedded in a mock "Acme App"
  with documentation of 4 integration methods: script tag, web component,
  npm package, and iframe
- Theme composable with dark/light mode, system preference detection
- Custom CSS: glass variants (subtle/medium/strong/light/dark), glow effects,
  gradient text, animation keyframes, thin scrollbar
- Responsive: mobile-first, 44px touch targets, dvh viewport

Made-with: Cursor

packages/app/src/components/chat/ChatInput.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="p-3 md:p-4">
+    <div
+      class="glass rounded-2xl px-4 py-3 flex items-end gap-3 transition-all duration-300 inner-glow"
+      :class="isFocused ? 'border-white/20 glow-soft' : ''"
+    >
+      <textarea
+        ref="textareaRef"
+        v-model="text"
+        rows="1"
+        :placeholder="placeholder"
+        class="flex-1 resize-none bg-transparent text-sm text-white outline-none placeholder:text-white/30 min-h-[24px] max-h-[120px]"
+        @focus="isFocused = true"
+        @blur="isFocused = false"
+        @keydown.enter.exact.prevent="send"
+        @input="autoResize"
+      />
+      <button
+        :disabled="!canSend"
+        class="shrink-0 w-9 h-9 flex items-center justify-center rounded-xl transition-all duration-200"
+        :class="canSend
+          ? 'bg-accent text-white hover:bg-accent-hover active:scale-90'
+          : 'bg-white/5 text-white/20 cursor-not-allowed'"
+        aria-label="Send message"
+        @click="send"
+      >
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 12L3.269 3.126A59.768 59.768 0 0121.485 12 59.77 59.77 0 013.27 20.876L5.999 12zm0 0h7.5" />
+        </svg>
+      </button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, nextTick } from 'vue'
+
+const props = withDefaults(
+  defineProps<{
+    disabled?: boolean
+    placeholder?: string
+  }>(),
+  {
+    disabled: false,
+    placeholder: 'Message AIUI...',
+  }
+)
+
+const emit = defineEmits<{
+  send: [text: string]
+}>()
+
+const text = ref('')
+const isFocused = ref(false)
+const textareaRef = ref<HTMLTextAreaElement | null>(null)
+
+const canSend = computed(() => text.value.trim().length > 0 && !props.disabled)
+
+function send() {
+  if (!canSend.value) return
+  emit('send', text.value.trim())
+  text.value = ''
+  nextTick(autoResize)
+}
+
+function autoResize() {
+  const el = textareaRef.value
+  if (!el) return
+  el.style.height = 'auto'
+  el.style.height = Math.min(el.scrollHeight, 120) + 'px'
+}
+</script>