update rewritten ui: small padding

index.html

@@ -47,6 +47,7 @@
 
         .message-bubble {
             max-width: 85%;
+            padding: 15px;
             animation: fadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
         }
 
@@ -269,9 +270,9 @@
     <main id="chat-messages" class="chat-scroll-area px-4 flex-1">
         <div class="max-w-3xl mx-auto space-y-6 pt-6 pb-32" id="chat-container">
             <div class="flex gap-3 items-start">
-                <div class="bot-message p-5 message-bubble shadow-sm">
+                <div class="bot-message message-bubble shadow-sm">
                     <p class="text-slate-700 leading-relaxed text-[15px]">
-                        Hello! I'm <strong>MiniCPM5-1B</strong>. Ask me anything.
+                        Hello! I'm <strong>MiniCPM5-1B</strong>. How can I help you today?
                     </p>
                 </div>
             </div>
@@ -366,7 +367,7 @@
             div.className = `flex gap-3 items-start ${role === 'user' ? 'flex-row-reverse' : ''}`;
             const bubbleClass = role === 'user' ? 'user-message' : 'bot-message';
             div.innerHTML = `
-                <div class="${bubbleClass} p-5 message-bubble shadow-sm">
+                <div class="${bubbleClass} message-bubble shadow-sm">
                     <div class="thinking-container hidden"></div>
                     <div class="content-container leading-relaxed text-[15px]">${role === 'user' ? escapeHtml(text) : marked.parse(text)}</div>
                 </div>
@@ -475,7 +476,7 @@
             chatHistory = [];
             chatContainer.innerHTML = `
                 <div class="flex gap-3 items-start">
-                    <div class="bot-message p-5 message-bubble shadow-sm">
+                    <div class="bot-message message-bubble shadow-sm">
                         <p class="text-slate-700 leading-relaxed text-[15px]">History cleared. How can I help you?</p>
                     </div>
                 </div>