diff --git a/extension/src/content/Sidebar.vue b/extension/src/content/Sidebar.vue
index 6f9c257..73daa6b 100644
--- a/extension/src/content/Sidebar.vue
+++ b/extension/src/content/Sidebar.vue
@@ -15,6 +15,19 @@ const props = defineProps<{
 }>()
 
 const isVisible = ref(false) // Start hidden, wait for trigger
+const selectedStrategy = ref('Insightful')
+const generatedReplies = ref<Array<{strategy: string, content: string}>>([])
+const isGenerating = ref(false)
+
+const defaultStrategies = [
+  { id: 'Insightful', label: 'Cognitive Lift', icon: '<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10"/>' },
+  { id: 'Humorous', label: 'Witty & Fun', icon: '<circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" x2="9.01" y1="9" y2="9"/><line x1="15" x2="15.01" y1="9" y2="9"/>' },
+  { id: 'Professional', label: 'Pro Rigor', icon: '<path d="M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"/><rect width="20" height="14" x="2" y="6" rx="2"/>' },
+  { id: 'Supportive', label: 'Empathetic', icon: '<path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"/>' },
+  { id: 'Critical', label: 'Sharp Critique', icon: '<path d="M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5Z"/>' },
+]
+
+const strategies = ref([...defaultStrategies])
 
 onMounted(() => {
   // Listen for toggle messages directly in the component