diff --git a/app/actions.ts b/app/actions.ts
index 001bd93..4b01217 100644
--- a/app/actions.ts
+++ b/app/actions.ts
@@ -1,9 +1,9 @@
+// app/actions.ts
 'use server';
 
 import { generateObject, CoreMessage } from 'ai';
 import { google } from '@ai-sdk/google'
 import { z } from 'zod';
-import { load } from 'cheerio';
 
 export async function suggestQuestions(history: any[]) {
   'use server';
@@ -146,7 +146,8 @@ Always remember to run the appropriate tool first, then compose your response ba
 Run tools step by step and not combined in a single response at all costs!!
 Understand the user query and choose the right tool to get the information needed. Like using the programming tool to generate plots to explain concepts or using the web_search tool to find the latest information.
 All tool should be called only once per response. All tool call parameters are mandatory always!
-Format your response in paragraphs(min 6) with 3-8 sentences each, keeping it long but informative. DO NOT use pointers or make lists of any kind at ALL!
+Format your response: give a structured answer with headings for each section no h1 tho. try to use bullet points instead of just a plain paragraph. put citation after each bullet point instead of at the end of the whole answer. Answers should be very informative and detailed. No short answers at all costs!!
+Do not ever complete the sentence inside the citation at all costs!! Always complete the sentence and then put the citation at the end after the last word of the sentence not as the last word of the sentence.
 Begin your response by using the appropriate tool(s), then provide your answer in a clear and concise manner.
 Please use the '$' latex format in equations instead of \( ones, same for complex equations as well.
 
diff --git a/components/ui/form-component.tsx b/components/ui/form-component.tsx
index b8c02f3..70a31ac 100644
--- a/components/ui/form-component.tsx
+++ b/components/ui/form-component.tsx
@@ -58,8 +58,8 @@ const getColorClasses = (color: string, isSelected: boolean = false) => {
                 : `${baseClasses} !text-orange-700 dark:!text-orange-300 hover:!bg-orange-200 dark:hover:!bg-orange-800/70`;
         case 'glossyblack':
             return isSelected
-            ? `${baseClasses} ${selectedClasses} bg-gradient-to-br from-black to-neutral-800 !text-white shadow-inner`
-            : `${baseClasses} !text-black dark:!text-white hover:!bg-black/10 dark:hover:!bg-black/40`;
+                ? `${baseClasses} ${selectedClasses} bg-gradient-to-br from-black to-neutral-800 !text-white shadow-inner`
+                : `${baseClasses} !text-black dark:!text-white hover:!bg-black/10 dark:hover:!bg-black/40`;
         default:
             return isSelected
                 ? `${baseClasses} ${selectedClasses} !bg-neutral-500 dark:!bg-neutral-600 !text-white hover:!bg-neutral-600 dark:hover:!bg-neutral-700`
@@ -634,15 +634,18 @@ const FormComponent: React.FC<FormComponentProps> = ({
     const postSubmitFileInputRef = useRef<HTMLInputElement>(null);
     const [isFocused, setIsFocused] = useState(false);
 
+    const MIN_HEIGHT = 56;
+    const MAX_HEIGHT = 400;
+
     const autoResizeInput = (target: HTMLTextAreaElement) => {
-        if (target) {
-            target.style.height = 'auto'; // trigger recalculate scrollHeight
-            let additionalLineHeight = 0;
-            if (target.value) {
-                additionalLineHeight = parseFloat(window.getComputedStyle(target).lineHeight);
-            }
-            target.style.height = `${target.scrollHeight + additionalLineHeight}px`;
-        }
+        if (!target) return;
+        requestAnimationFrame(() => {
+            target.style.height = 'auto'; // reset
+            let newHeight = target.scrollHeight;
+            newHeight = Math.min(Math.max(newHeight, MIN_HEIGHT), MAX_HEIGHT);
+            target.style.height = `${newHeight}px`;
+            target.style.overflowY = newHeight >= MAX_HEIGHT ? 'auto' : 'hidden';
+        });
     };
 
     const handleInput = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -812,8 +815,8 @@ const FormComponent: React.FC<FormComponentProps> = ({
                     onFocus={handleFocus}
                     onBlur={handleBlur}
                     className={cn(
-                        "min-h-[40px] w-full resize-none rounded-lg",
-                        "overflow-y-auto overflow-x-hidden",
+                        "min-h-[40px] max-h-[300px] w-full resize-none rounded-lg",
+                        "overflow-x-hidden",
                         "text-base leading-relaxed",
                         "bg-neutral-100 dark:bg-neutral-900",
                         "border border-neutral-200 dark:border-neutral-700",