diff --git a/src/main.rs b/src/main.rs
index 01282d9..bf35af8 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -595,12 +595,14 @@ fn handle_relative_connection(
                 );
 
                 let section_html = html! {
-                    fieldset class="dialog-block" {
+                    fieldset class="visual-novel-box" {
                         @if !block.name.is_empty() {
-                            legend { (block.name) }
+                            legend class="character-name" { (block.name) }
                         }
-                        @if let Ok(content) = String::from_utf8(block_content) {
-                            (maud::PreEscaped(content))
+                        div class="dialog-content" {
+                            @if let Ok(content) = String::from_utf8(block_content) {
+                                (maud::PreEscaped(content))
+                            }
                         }
                     }
                 };
@@ -694,6 +696,53 @@ fn handle_relative_connection(
                             padding: 1rem;
                             justify-content: flex-end;
                         }
+
+                        .visual-novel-box {
+                            border: 2px solid #3a3a3a;
+                            border-radius: 10px;
+                            padding: 20px;
+                            margin: 1rem 0;
+                            background: rgba(255, 255, 255, 0.9);
+                            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+                            position: relative;
+                            min-height: 120px;
+                            width: 80%;
+                            margin-left: auto;
+                            margin-right: auto;
+                        }
+
+                        .character-name {
+                            font-family: 'Georgia', serif;
+                            font-size: 1.2rem;
+                            font-weight: bold;
+                            padding: 0 15px;
+                            background: #4a6b8a;
+                            color: white;
+                            border-radius: 5px;
+                            margin: 0;
+                            transform: translateY(-50%);
+                            position: absolute;
+                            top: 0;
+                            left: 20px;
+                        }
+
+                        .dialogue-content {
+                            font-family: 'Arial', sans-serif;
+                            font-size: 1.1rem;
+                            line-height: 1.6;
+                            color: #333;
+                            margin-top: 10px;
+                        }
+
+                        .visual-novel-box::after {
+                            content: '';
+                            position: absolute;
+                            bottom: 10px;
+                            right: 10px;
+                            width: 20px;
+                            height: 20px;
+                            opacity: 0.5;
+                        }
                     "))
                 }