some visual fixes

public/index.html

@@ -46,10 +46,6 @@
                            placeholder="Название песни или исполнитель..." 
                            autocomplete="off">
                 </div>
-                
-                <button class="tg-button tg-button--primary tg-button--large" id="searchBtn">
-                    <span class="tg-button__text">Найти</span>
-                </button>
             </div>
         </div>
     </div>

public/script.ts

@@ -45,6 +45,7 @@ class QuixoticApp {
     private results!: HTMLElement;
     private noResults!: HTMLElement;
     private welcomePlaceholder!: HTMLElement;
+    private searchTimeout?: NodeJS.Timeout;
 
     constructor() {
         this.tg = (window as WindowWithTelegram).Telegram?.WebApp;
@@ -76,17 +77,35 @@ class QuixoticApp {
     }
 
     private bindEvents(): void {
-        this.searchBtn.addEventListener('click', () => this.search());
-        this.searchInput.addEventListener('keypress', (e: KeyboardEvent) => {
-            if (e.key === 'Enter') {
-                this.search();
+        // Auto search with debounce timeout
+        this.searchInput.addEventListener('input', () => {
+            // Clear previous timeout
+            if (this.searchTimeout) {
+                clearTimeout(this.searchTimeout);
             }
+
+            const query = this.searchInput.value.trim();
+            
+            // If input is empty, reset to welcome state immediately
+            if (query === '') {
+                this.resetToWelcomeState();
+                return;
+            }
+
+            // Set new timeout for search (500ms delay)
+            this.searchTimeout = setTimeout(() => {
+                this.search();
+            }, 500);
         });
         
-        // Reset to welcome state when input is cleared
-        this.searchInput.addEventListener('input', () => {
-            if (this.searchInput.value.trim() === '') {
-                this.resetToWelcomeState();
+        // Still handle Enter key for immediate search
+        this.searchInput.addEventListener('keypress', (e: KeyboardEvent) => {
+            if (e.key === 'Enter') {
+                // Clear timeout and search immediately
+                if (this.searchTimeout) {
+                    clearTimeout(this.searchTimeout);
+                }
+                this.search();
             }
         });
     }
@@ -104,8 +123,7 @@ class QuixoticApp {
         this.noResults.classList.add('tg-hidden');
         this.noResults.style.display = 'none';
         
-        // Enable search button
-        this.searchBtn.disabled = false;
+
     }
 
     private async search(): Promise<void> {
@@ -159,7 +177,7 @@ class QuixoticApp {
         this.noResults.classList.add('tg-hidden');
         this.noResults.style.display = 'none';
         
-        this.searchBtn.disabled = true;
+
     }
 
     private hideLoading(): void {
@@ -272,13 +290,6 @@ class QuixoticApp {
             if (data.audioUrl) {
                 
                 if (this.tg) {
-                    // Try WebApp method first (might not work)
-                    const payload = {
-                        action: 'send_audio',
-                        audioUrl: data.audioUrl,
-                        title: title
-                    };
-                    
                     const userId = this.tg?.initDataUnsafe?.user?.id;
                     if (!userId) {
                         this.showMessage('❌ Ошибка: не удается определить пользователя', 'error');
@@ -302,7 +313,7 @@ class QuixoticApp {
                         } else {
                             this.showMessage('❌ Ошибка отправки в Telegram', 'error');
                         }
-                    } catch (directError) {
+                    } catch {
                         this.showMessage('❌ Ошибка соединения с ботом', 'error');
                     }
                 } else {

public/style.css

@@ -67,7 +67,7 @@ body {
 .tg-content {
   flex: 1;
   padding: var(--tg-spacing-lg);
-  padding-bottom: 140px;
+  padding-bottom: 100px;
   display: flex;
   flex-direction: column;
   gap: var(--tg-spacing-xl);
@@ -79,9 +79,6 @@ body {
   bottom: 0;
   left: 0;
   right: 0;
-  display: flex;
-  flex-direction: column;
-  gap: var(--tg-spacing-md);
   padding: var(--tg-spacing-lg);
   background: var(--tg-color-bg);
   border-top: 1px solid var(--tg-color-secondary-bg);