diff --git a/src/views/ChatView.vue b/src/views/ChatView.vue
index ff4f59e..507f17d 100644
--- a/src/views/ChatView.vue
+++ b/src/views/ChatView.vue
@@ -35,6 +35,7 @@
       @close="clearError"
       width="80%"
       center
+      class="chat-dialog"
     >
       <div class="error-content">
         <p>{{ error }}</p>
@@ -180,6 +181,8 @@ export default {
   padding: 16px;
   display: flex;
   flex-direction: column;
+  position: relative;
+  z-index: 10; /* Ensure messages appear above the visualizer */
 }
 
 .empty-state {
@@ -194,7 +197,7 @@ export default {
 
 .visualizer-container {
   position: absolute;
-  bottom: 20px;
+  bottom: 58px; /* Moved up by 1cm (approximately 38px) */
   left: 0;
   right: 0;
   display: flex;
@@ -212,6 +215,11 @@ export default {
   color: #ff4d4f;
 }
 
+/* Ensure dialog appears above the visualizer */
+:deep(.chat-dialog) {
+  z-index: 100;
+}
+
 @media (max-width: 768px) {
   .chat-header h1 {
     font-size: 20px;