diff --git a/src/main.rs b/src/main.rs
index 69bc67a..d3aaa4a 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -745,44 +745,42 @@ fn handle_relative_connection(
                         }
 
                         .visual-novel-box {
-                            border: 2px solid #3a3a3a;
-                            border-radius: 10px;
-                            padding: 20px;
-                            margin: 1rem auto;
+                            border: 0.2vw solid #3a3a3a;
+                            border-radius: 1vw;
+                            padding: 2vw;
+                            margin: 1vh 0;
                             background: rgba(255, 255, 255, 0.9);
-                            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-                            position: relative;
-                            width: 80%;
-                            max-width: 600px;
-                            min-width: 300px;
+                            box-shadow: 0 0.4vw 0.6vw rgba(0, 0, 0, 0.1);
+                            width: 90%;
+                            min-width: 85%;
+                            font-size: 1.6vw;
+                            position: absolute;
+                            bottom: 3vh;
+                            left: 50%;
+                            transform: translateX(-50%);
                         }
 
                         .character-name {
                             font-family: 'Georgia', serif;
-                            font-size: 1.2rem;
+                            font-size: 1.8vw;
                             font-weight: bold;
-                            padding: 0 15px;
+                            padding: 0 1.5vw;
                             background: #4a6b8a;
                             color: white;
-                            border-radius: 5px;
+                            border-radius: 0.5vw;
                             margin: 0;
                             transform: translateY(-60%);
                             position: absolute;
                             top: 0;
-                            left: 20px;
+                            left: 1vw;
                         }
 
                         .dialogue-content {
-                            font-family: 'Arial', sans-serif;
-                            font-size: 1.1rem;
-                            line-height: 1.6;
-                            color: #333;
-                            margin-top: 10px;
-                            min-height: 40px;
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-                            padding: 10px 0;
+                            font-size: 1.6vw;
+                            line-height: 1.4;
+                            max-height: 20vh;
+                            overflow-y: auto;
+                            padding: 1vh 0.5vw;
                         }
 
                         .visual-novel-box::after {