modified the .gitignore file and added mobile responsiveness

.gitignore

@@ -1,3 +1,7 @@
 __pycache__
 Fake
-Real
+Real
+.vercel
+vercel.json
+.vercel
+temp_audio.wav

static/styles.css

@@ -119,3 +119,89 @@ ul {
   list-style-type: none;
   padding-left: 0; /* Optional: removes default left padding */
 }
+
+/* Mobile Responsive Styles */
+@media (max-width: 768px) {
+  /* Container adjustments for smaller screens */
+  .container {
+    width: 90%;
+    height: auto;
+    padding: 15px;
+  }
+
+  /* Title font size for better readability */
+  .title {
+    font-size: 1.5em;
+  }
+
+  /* Form layout adjustments */
+  .upload-form {
+    gap: 0.75rem;
+  }
+
+  .file-label {
+    font-size: 1em;
+  }
+
+  .file-input {
+    padding: 6px;
+    font-size: 0.9em;
+  }
+
+  /* Button adjustments */
+  .submit-button,
+  .return-button {
+    padding: 8px 16px;
+    font-size: 0.9em;
+  }
+
+  /* Results section adjustments */
+  .result-section {
+    padding: 1rem;
+  }
+
+  .result-title {
+    font-size: 1.3em;
+  }
+
+  .result-text {
+    font-size: 1em;
+  }
+
+  .result-image {
+    max-width: 90%;
+  }
+
+  /* Fake Frame Intervals list spacing */
+  .intervals-list ul {
+    padding-left: 10px; /* Adds a bit of space to the left */
+  }
+
+  /* Plot container adjustments */
+  .plot-container {
+    overflow-x: auto; /* Allows horizontal scrolling if plot exceeds screen width */
+  }
+}
+
+/* Extra Small Screens (Phones) */
+@media (max-width: 480px) {
+  .title {
+    font-size: 1.3em;
+  }
+
+  .file-label,
+  .result-text {
+    font-size: 0.9em;
+  }
+
+  .file-input {
+    padding: 5px;
+    font-size: 0.8em;
+  }
+
+  .submit-button,
+  .return-button {
+    padding: 6px 12px;
+    font-size: 0.8em;
+  }
+}