Update app.py

app.py

@@ -19,8 +19,12 @@ def init_db():
             }, f, indent=4)
 
 def read_db():
-    with open(DB_FILE, 'r') as f:
-        return json.load(f)
+    try:
+        with open(DB_FILE, 'r') as f:
+            return json.load(f)
+    except (FileNotFoundError, json.JSONDecodeError):
+        init_db()
+        return read_db()
 
 def write_db(data):
     with open(DB_FILE, 'w') as f:
@@ -86,6 +90,7 @@ def index():
                 display: flex;
                 flex-direction: column;
                 transition: opacity 0.3s ease;
+                position: relative;
             }
 
             #login-view {
@@ -123,32 +128,55 @@ def index():
                 width: 100%;
                 height: 100%;
                 flex-direction: column;
-                position: relative;
             }
             
-            .app-content {
+            .content-area {
                 flex-grow: 1;
-                overflow-y: auto;
-                padding-bottom: 60px; /* Space for nav bar */
+                display: flex;
+                overflow: hidden; /* Allows individual views to scroll */
+                position: relative; /* Needed for absolute positioning of views on mobile */
             }
             
-            #chatroom-list-view, #user-list-view, #browser-view, #profile-details-view {
-                display: none;
+            .app-view-section {
                 width: 100%;
                 height: 100%;
-                flex-direction: column;
-                background-color: var(--bg-secondary);
+                flex-shrink: 0;
+                overflow-y: auto;
+                display: none; /* Managed by JS */
+                flex-direction: column; /* Default for views */
+                background-color: var(--bg-primary); /* Default */
+                position: absolute; /* Mobile: Stack views */
+                top: 0;
+                left: 0;
+                right: 0;
+                bottom: 0;
             }
             
-            .view-header {
+            .app-view-section.active {
+                display: flex;
+                position: relative; /* Active view takes up space */
+            }
+
+            #chatroom-list-view {
+                background-color: var(--bg-secondary);
+            }
+             #chat-window-view {
+                background-color: var(--bg-primary);
+            }
+
+            .list-header {
                 padding: 16px;
                 border-bottom: 1px solid var(--border-color);
                 flex-shrink: 0;
+                background-color: var(--bg-secondary);
+            }
+            .list-header-top {
                 display: flex;
                 justify-content: space-between;
                 align-items: center;
+                margin-bottom: 16px;
             }
-            .view-header h2 {
+            .list-header-top h2 {
                 font-size: 1.5rem;
                 font-weight: 600;
             }
@@ -157,7 +185,7 @@ def index():
                 padding: 12px;
                 background-color: var(--bg-tertiary);
                 border-radius: 8px;
-                margin: 16px;
+                margin-bottom: 0; /* Adjusted for list header */
             }
             #user-wallet, #user-nickname {
                 font-size: 0.9rem;
@@ -192,9 +220,13 @@ def index():
                 justify-content: center;
                 gap: 8px;
             }
-            .action-btn:hover {
+            .action-btn:hover:not(:disabled) {
                 transform: translateY(-2px);
                 box-shadow: 0 4px 15px rgba(0, 136, 204, 0.3);
+            }
+             .action-btn:disabled {
+                opacity: 0.5;
+                cursor: not-allowed;
             }
             .action-btn.small {
                 padding: 8px 12px;
@@ -226,6 +258,7 @@ def index():
                 font-weight: 600;
                 color: white;
                 flex-shrink: 0;
+                background-color: #555; /* Fallback */
                 font-size: 1.1rem;
             }
             .item-info {
@@ -238,8 +271,8 @@ def index():
                 overflow: hidden;
                 text-overflow: ellipsis;
             }
-             .item-description {
-                font-size: 0.9rem;
+            .item-address {
+                font-size: 0.85rem;
                 color: var(--text-secondary);
                 white-space: nowrap;
                 overflow: hidden;
@@ -252,21 +285,12 @@ def index():
                 flex-shrink: 0;
             }
 
+            /* Chat Window */
             #chat-window-view {
-                display: none;
+                display: flex; /* Always flex container */
                 flex-direction: column;
-                height: 100%;
-                width: 100%;
-                background-color: var(--bg-primary);
-                position: absolute;
-                top: 0;
-                left: 0;
-                z-index: 10;
-            }
-             #chat-window-view.visible-on-mobile {
-                display: flex !important;
             }
-            
+
             .chat-header {
                 display: flex;
                 align-items: center;
@@ -280,7 +304,8 @@ def index():
                 background: none;
                 border: none;
                 cursor: pointer;
-                display: none; /* Hidden by default, shown on mobile */
+                padding: 0;
+                display: none; /* Managed by JS/Media Query */
             }
             .back-btn svg {
                 width: 24px;
@@ -345,7 +370,7 @@ def index():
                 border-bottom-left-radius: 4px;
             }
             
-            .chat-placeholder, .view-placeholder {
+            .chat-placeholder {
                 display: flex;
                 flex-direction: column;
                 align-items: center;
@@ -355,11 +380,11 @@ def index():
                 color: var(--text-secondary);
                 padding: 20px;
             }
-            .chat-placeholder img, .view-placeholder img { width: 80px; margin-bottom: 20px; opacity: 0.5; }
+            .chat-placeholder img { width: 80px; margin-bottom: 20px; opacity: 0.5; }
 
             .message-form {
                 display: flex;
-                padding: 12px 16px;
+                padding: 16px;
                 gap: 12px;
                 background-color: var(--bg-secondary);
                 border-top: 1px solid var(--border-color);
@@ -387,153 +412,114 @@ def index():
             }
             .send-btn svg { width: 20px; height: 20px; fill: white; }
 
-            /* Browser View Specific Styles */
-            .browser-controls {
-                display: flex;
-                padding: 12px 16px;
-                gap: 8px;
-                background-color: var(--bg-tertiary);
-                flex-shrink: 0;
-            }
-            .browser-input {
-                flex-grow: 1;
-                padding: 8px 12px;
-                border: 1px solid var(--border-color);
-                background-color: var(--bg-primary);
-                color: var(--text-primary);
-                border-radius: 6px;
-                font-size: 0.9rem;
-                outline: none;
+            /* User List View */
+            #user-list-view {
+                 background-color: var(--bg-secondary);
             }
-            .browser-input:focus { border-color: var(--accent-blue); }
-            .browser-iframe {
+            #user-list-view .list-header h2 { margin-bottom: 0; } /* No user profile in this header */
+            #user-list {
                 flex-grow: 1;
-                width: 100%;
-                border: none;
+                overflow-y: auto;
             }
 
-            /* Profile Details View Specific Styles */
-            #profile-details-view .profile-content {
-                padding: 24px;
-                text-align: center;
-            }
-            #profile-details-view .avatar {
-                width: 80px;
-                height: 80px;
-                font-size: 2rem;
-                margin: 20px auto;
-            }
-            #profile-details-view #my-profile-username {
-                font-size: 1.5rem;
-                font-weight: 600;
-                margin-bottom: 8px;
-            }
-            #profile-details-view #my-profile-address {
-                color: var(--text-secondary);
-                font-size: 1rem;
-                word-break: break-all;
-                margin-bottom: 8px;
+            /* Browser View */
+            #browser-view {
+                display: flex;
+                flex-direction: column;
+                background-color: var(--bg-primary);
             }
-            #profile-details-view #my-profile-balance {
-                font-size: 1rem;
-                color: var(--accent-blue-light);
-                margin-bottom: 20px;
+            .browser-header {
+                 display: flex;
+                 align-items: center;
+                 gap: 8px;
+                 padding: 8px 16px;
+                 background-color: var(--bg-secondary);
+                 border-bottom: 1px solid var(--border-color);
+                 flex-shrink: 0;
             }
-             #profile-details-view .username-form {
-                max-width: 300px;
-                margin: 0 auto 20px auto;
+            .browser-header form {
+                flex-grow: 1;
+                display: flex;
+                gap: 8px;
             }
-             #profile-details-view #my-profile-qr-code {
-                background: white;
-                padding: 10px;
-                margin: 20px auto;
-                width: fit-content;
-                border-radius: 8px;
+            .url-input {
+                 flex-grow: 1;
+                 padding: 6px 10px;
+                 border: 1px solid var(--border-color);
+                 background-color: var(--bg-tertiary);
+                 color: var(--text-primary);
+                 border-radius: 4px;
+                 font-size: 0.9rem;
+                 outline: none;
             }
-             #profile-details-view .profile-actions {
-                display: flex;
-                flex-direction: column;
-                gap: 12px;
-                align-items: stretch;
-                max-width: 300px;
-                margin: 0 auto;
+            .browser-iframe {
+                flex-grow: 1;
+                width: 100%;
+                height: 100%;
+                border: none;
             }
 
-
-            /* Navigation Bar Styles */
-            .nav-bar {
-                position: fixed;
-                bottom: 0;
-                left: 0;
-                width: 100%;
-                height: 56px; /* Standard mobile nav height */
-                background-color: var(--bg-tertiary);
+            /* Bottom Navigation */
+            .bottom-nav {
                 display: flex;
                 justify-content: space-around;
                 align-items: center;
+                height: 60px; /* Fixed height */
+                background-color: var(--bg-secondary);
                 border-top: 1px solid var(--border-color);
-                z-index: 100;
+                flex-shrink: 0; /* Prevents shrinking */
             }
-            .nav-button {
-                flex-grow: 1;
+
+            .nav-item {
                 display: flex;
                 flex-direction: column;
                 align-items: center;
                 justify-content: center;
-                font-size: 0.7rem;
-                color: var(--text-secondary);
-                background: none;
-                border: none;
-                cursor: pointer;
+                flex-grow: 1;
                 padding: 8px 0;
+                cursor: pointer;
+                color: var(--text-secondary);
+                font-size: 0.75rem;
                 transition: color 0.2s ease;
             }
-            .nav-button svg {
-                width: 24px;
-                height: 24px;
+            .nav-item svg {
+                width: 20px;
+                height: 20px;
                 fill: var(--text-secondary);
-                margin-bottom: 2px;
+                margin-bottom: 4px;
                 transition: fill 0.2s ease;
             }
-            .nav-button.active {
+            .nav-item.active {
                 color: var(--accent-blue-light);
             }
-             .nav-button.active svg {
+            .nav-item.active svg {
                 fill: var(--accent-blue-light);
             }
-             .nav-button:hover {
-                color: var(--text-primary);
-            }
-             .nav-button:hover svg {
-                fill: var(--text-primary);
-            }
-            
-            .nav-button#nav-scan {
-                position: relative;
-                top: -16px; /* Lift the middle button */
-                width: 56px;
-                height: 56px;
-                border-radius: 50%;
-                background: linear-gradient(45deg, var(--accent-blue), var(--accent-blue-light));
-                color: white;
-                box-shadow: 0 4px 15px rgba(0, 136, 204, 0.3);
-                transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
-                padding: 0;
-                justify-content: center;
-            }
-             .nav-button#nav-scan svg {
-                width: 28px;
-                height: 28px;
-                fill: white;
-                margin: 0;
-            }
-            .nav-button#nav-scan:hover {
-                transform: scale(1.05);
-                box-shadow: 0 6px 20px rgba(0, 136, 204, 0.4);
-            }
-
 
-            /* Modal Styles */
+            .nav-item.qr-scan {
+                 flex-grow: 0;
+                 width: 56px;
+                 height: 56px;
+                 border-radius: 50%;
+                 background: linear-gradient(45deg, var(--accent-blue), var(--accent-blue-light));
+                 color: white;
+                 margin-top: -20px; /* Visually lift the button */
+                 box-shadow: 0 -4px 15px rgba(0, 136, 204, 0.4);
+                 display: flex;
+                 align-items: center;
+                 justify-content: center;
+                 font-size: 0.8rem;
+                 font-weight: 500;
+            }
+             .nav-item.qr-scan svg {
+                 width: 24px;
+                 height: 24px;
+                 fill: white;
+                 margin: 0;
+            }
+            .nav-item.qr-scan span { display: none; } /* Hide text on QR button */
+
+            /* Modals (Existing styles refined) */
             .modal-overlay {
                 position: fixed;
                 top: 0;
@@ -557,7 +543,7 @@ def index():
                 border: 1px solid var(--border-color);
                 box-shadow: 0 10px 30px rgba(0,0,0,0.5);
             }
-            .modal-content h3 { margin-bottom: 20px; font-weight: 600; font-size: 1.3rem; }
+            .modal-content h3 { margin-bottom: 20px; font-weight: 600; font-size: 1.3rem; color: var(--text-primary); }
             .modal-content label { display: block; margin-bottom: 8px; font-size: 0.9rem; color: var(--text-secondary); }
             .modal-content input {
                 width: 100%;
@@ -565,7 +551,7 @@ def index():
                 margin-bottom: 16px;
                 background-color: var(--bg-tertiary);
                 border: 1px solid var(--border-color);
-                color: white;
+                color: var(--text-primary);
                 border-radius: 6px;
                 font-size: 1rem;
             }
@@ -576,12 +562,34 @@ def index():
                 border: none;
                 cursor: pointer;
                 font-weight: 500;
+                transition: opacity 0.2s ease;
             }
+            .modal-btn:hover { opacity: 0.9; }
             .secondary-btn { background-color: var(--bg-hover); color: white; }
-            
+            .action-modal-btn { /* Reuse action-btn styles */
+                 background: linear-gradient(45deg, var(--accent-blue), var(--accent-blue-light));
+                 color: white;
+            }
+
+            #profile-modal .modal-content { text-align: center; }
+            #profile-avatar-container .avatar {
+                width: 80px;
+                height: 80px;
+                font-size: 2.5rem;
+            }
+            #profile-username { font-size: 1.2rem; font-weight: 600; color: var(--text-primary); margin-top: 10px; }
+            #profile-address { color: var(--text-secondary); font-size: 0.9rem; word-break: break-all; margin-top: 8px; }
+            #profile-qr-code { background: white; padding: 10px; margin: 20px auto; width: fit-content; border-radius: 8px; }
+            #profile-modal p { text-align: center; color: var(--text-secondary); font-size: 0.8rem; margin-top: -10px; margin-bottom: 20px; }
+             #profile-modal .modal-actions { flex-direction: column; gap: 12px; align-items: stretch; }
+
+            #scanner-modal .modal-content { max-width: 450px; }
+            #qr-reader { width: 100%; border: 1px solid var(--border-color); margin-top: 16px; border-radius: 8px; overflow: hidden; }
+            #qr-reader__dashboard_section_swaplink { display: none; } /* Hide camera swap link */
+
             #status-bar {
                 position: fixed;
-                bottom: calc(56px + 20px); /* Above nav bar */
+                bottom: 80px; /* Above the bottom nav */
                 left: 50%;
                 transform: translateX(-50%);
                 background-color: var(--bg-tertiary);
@@ -594,18 +602,14 @@ def index():
                 transition: opacity 0.3s, visibility 0.3s;
                 z-index: 2000;
                 box-shadow: 0 5px 15px rgba(0,0,0,0.3);
-                max-width: 90%;
-                text-align: center;
             }
             #status-bar.success { background-color: var(--success-color); }
             #status-bar.error { background-color: var(--error-color); }
             #status-bar.visible { opacity: 1; visibility: visible; }
 
+            /* Desktop styles */
             @media (min-width: 768px) {
-                body {
-                    background-color: var(--bg-secondary); /* More subtle bg on desktop */
-                }
-                 .main-container {
+                .main-container {
                     max-width: 1100px;
                     max-height: 800px;
                     border-radius: 12px;
@@ -613,81 +617,52 @@ def index():
                     box-shadow: 0 10px 40px rgba(0,0,0,0.3);
                     border: 1px solid var(--border-color);
                 }
-                 #app-view {
+                #app-view {
+                    flex-direction: row;
+                }
+                .content-area {
                     flex-direction: row;
                 }
 
-                .app-content {
+                 .app-view-section {
+                    position: relative; /* No stacking on desktop */
+                    width: auto; /* Width managed by flex/specific rules */
                     flex-grow: 1;
-                    display: flex;
-                    padding-bottom: 0; /* No nav bar padding */
+                    display: flex !important; /* Always visible in its container */
+                    flex-direction: column;
                 }
 
-                #chatroom-list-view, #user-list-view, #browser-view, #profile-details-view {
-                    width: 320px; /* Fixed sidebar width */
+                #chatroom-list-view, #user-list-view {
+                    width: 320px;
                     flex-shrink: 0;
                     border-right: 1px solid var(--border-color);
-                    display: flex !important; /* Always visible sections on desktop */
-                    position: static; /* Remove absolute positioning */
-                    z-index: 1;
                 }
 
-                 #user-list-view, #browser-view, #profile-details-view {
-                    display: none; /* Hide non-active content on desktop by default */
-                 }
-                 
-                #chat-window-view {
-                    width: auto; /* Take remaining width */
-                    flex-grow: 1;
-                    position: static; /* Remove absolute positioning */
-                    z-index: 1;
-                    display: flex; /* Always show chat area on desktop */
-                }
-                #chat-window-view.hidden-on-desktop {
-                     display: flex; /* Ensure it's visible */
+                #chat-window-view, #browser-view {
+                     flex-grow: 1;
                 }
 
-                .back-btn { display: none !important; } /* Hide back button on desktop */
-                
-                .nav-bar {
-                    position: static; /* No fixed nav bar */
-                    height: auto;
-                    background-color: transparent;
-                    border-top: none;
-                    flex-direction: column;
-                    padding: 16px 0;
-                    gap: 8px;
-                    width: 60px; /* Narrow sidebar for navigation */
-                    border-right: 1px solid var(--border-color);
-                    flex-shrink: 0;
-                    justify-content: flex-start;
-                }
-                .nav-button {
-                    flex-grow: 0;
-                    font-size: 0.6rem;
-                    padding: 8px 4px;
-                    width: 100%;
-                    gap: 4px;
-                }
-                 .nav-button svg {
-                    width: 20px;
-                    height: 20px;
+                 /* Hide non-active views from taking up space, but keep them display:flex for layout */
+                 #chatroom-list-view:not(.active),
+                 #user-list-view:not(.active),
+                 #browser-view:not(.active) {
+                     display: none !important; /* Force hide if not active */
                  }
-                 .nav-button#nav-scan {
-                    position: static; /* Remove lifted effect */
-                    width: 40px;
-                    height: 40px;
-                    top: auto;
-                    margin: 8px auto; /* Center small icon */
+                 #chat-window-view:not(.active) {
+                     /* On desktop, chat view can be visible alongside list view */
                  }
-                  .nav-button#nav-scan svg {
-                    width: 20px;
-                    height: 20px;
-                  }
 
+
+                .back-btn { display: none !important; } /* No back button on desktop */
+
+                .bottom-nav {
+                    display: none; /* Hide bottom nav on desktop */
+                }
                 #status-bar {
-                    bottom: 20px; /* Standard bottom position */
+                    bottom: 20px; /* Move status bar back down */
                 }
+                .user-profile { margin-bottom: 16px;} /* Restore margin */
+                .list-header-top { margin-bottom: 16px;} /* Restore margin */
             }
         </style>
     </head>
@@ -701,114 +676,91 @@ def index():
         </div>
 
         <div id="app-view" class="main-container">
-            <div class="nav-bar">
-                <button class="nav-button" data-view="chatroom-list-view" id="nav-chats">
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg>
-                    <span>Чаты</span>
-                </button>
-                <button class="nav-button" data-view="user-list-view" id="nav-users">
-                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5s-3 1.34-3 3 1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
-                    <span>Пользователи</span>
-                </button>
-                <button class="nav-button" id="nav-scan">
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M3 11h8V3H3v8zm2-6h4v4H5V5zM3 21h8v-8H3v8zm2-6h4v4H5v-4zm8-12v8h8V3h-8zm6 6h-4V5h4v4zm-2 10a2 2 0 100-4 2 2 0 000 4z"/></svg>
-                </button>
-                 <button class="nav-button" data-view="browser-view" id="nav-browser">
-                    <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><rect fill="none" height="24" width="24"/><g><g><path d="M20,4H4C2.9,4,2,4.9,2,6v12c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V6C22,4.9,21.1,4,20,4z M4,6h16v2H4V6z M20,18H4V10h16V18 z"/><circle cx="8.5" cy="14.5" r="1.5"/><circle cx="15.5" cy="14.5" r="1.5"/></g></g></svg>
-                    <span>Браузер</span>
-                </button>
-                 <button class="nav-button" data-view="profile-details-view" id="nav-profile">
-                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>
-                    <span>Профиль</span>
-                </button>
-            </div>
-
-            <div class="app-content">
-                <div id="chatroom-list-view">
-                    <div class="view-header">
-                        <h2>Чаты</h2>
-                        <div style="display: flex; align-items: center; gap: 8px;">
-                            <button id="create-room-show-modal" class="action-btn small">
+            <div class="content-area">
+                <div id="chatroom-list-view" class="app-view-section">
+                    <div class="list-header">
+                        <div class="list-header-top">
+                            <h2>Чаты</h2>
+                             <button id="create-room-show-modal" class="action-btn small">
                                 <svg xmlns="http://www.w3.org/2000/svg" height="16" viewBox="0 0 24 24" width="16" fill="white"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
                                 <span>Новый</span>
                             </button>
                         </div>
+                         <div class="user-profile">
+                            <div id="user-wallet"></div>
+                            <div id="user-nickname"></div>
+                            <form class="username-form" id="username-form">
+                                <input type="text" id="username-input" class="username-input" placeholder="Установить никнейм" autocomplete="off">
+                                <button type="submit" class="action-btn small">✓</button>
+                            </form>
+                        </div>
                     </div>
                     <div id="chatroom-list"></div>
-                     <div class="view-placeholder" id="chat-list-placeholder">
-                        <img src="https://ton.org/download/ton_symbol.svg" alt="TON Symbol">
-                        <h2>Начните общение</h2>
-                        <p>Создайте новый чат или дождитесь, пока вас кто-то пригласит.</p>
-                    </div>
                 </div>
 
-                <div id="user-list-view">
-                     <div class="view-header">
+                <div id="user-list-view" class="app-view-section">
+                    <div class="list-header">
                         <h2>Пользователи</h2>
                     </div>
                     <div id="user-list"></div>
-                    <div class="view-placeholder" id="user-list-placeholder">
-                        <img src="https://ton.org/download/ton_symbol.svg" alt="TON Symbol">
-                        <h2>Загрузка пользователей...</h2>
-                        <p>Список зарегистрированных пользователей появится здесь.</p>
-                    </div>
                 </div>
 
-                <div id="browser-view">
-                    <div class="view-header">
-                        <h2>Браузер</h2>
+                <div id="chat-window-view" class="app-view-section">
+                    <div id="chat-placeholder" class="chat-placeholder">
+                        <img src="https://ton.org/download/ton_symbol.svg" alt="TON Symbol">
+                        <h2>Выберите чат</h2>
+                        <p>Начните общение в одном из существующих чатов или создайте свой собственный.</p>
                     </div>
-                    <div class="browser-controls">
-                        <input type="text" id="browser-url" class="browser-input" placeholder="https://google.com" value="https://google.com">
-                        <button id="browser-go" class="action-btn small">Go</button>
+                    <div id="active-chat" style="display: none; width: 100%; height: 100%; flex-direction: column;">
+                        <div class="chat-header">
+                            <button class="back-btn" id="back-to-list-btn">
+                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
+                            </button>
+                            <div id="chat-header-avatar" class="avatar"></div>
+                            <span id="chat-header-title"></span>
+                        </div>
+                        <div id="messages-container"></div>
+                        <form id="message-form" class="message-form">
+                            <input type="text" id="message-input" placeholder="Сообщение..." autocomplete="off">
+                            <button type="submit" class="action-btn send-btn" id="send-btn">
+                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
+                            </button>
+                        </form>
                     </div>
-                    <iframe id="browser-iframe" class="browser-iframe" src="https://google.com"></iframe>
                 </div>
 
-                <div id="profile-details-view">
-                    <div class="view-header">
-                        <h2>Мой Профиль</h2>
-                    </div>
-                    <div class="profile-content">
-                        <div id="my-profile-avatar" class="avatar"></div>
-                        <p id="my-profile-username"></p>
-                        <p id="my-profile-address"></p>
-                         <p id="my-profile-balance"></p>
-                        <form class="username-form" id="my-username-form">
-                            <input type="text" id="my-username-input" class="username-input" placeholder="Установить никнейм" autocomplete="off">
-                            <button type="submit" class="action-btn small">✓</button>
-                        </form>
-                        <p style="text-align: center; color: var(--text-secondary); font-size: 0.8rem; margin-bottom: 12px;">Мой QR-код:</p>
-                         <div id="my-profile-qr-code" style="background: white; padding: 10px; margin: 0 auto 20px auto; width: fit-content; border-radius: 8px;"></div>
-                         <div class="profile-actions">
-                             <!-- Add more profile actions here if needed -->
-                         </div>
+                 <div id="browser-view" class="app-view-section">
+                    <div class="browser-header">
+                         <form id="browser-form">
+                            <input type="text" id="url-input" class="url-input" placeholder="Введите URL или поисковый запрос" autocomplete="off">
+                            <button type="submit" class="action-btn small">Перейти</button>
+                         </form>
                     </div>
+                     <iframe id="browser-iframe" class="browser-iframe" src="https://www.google.com"></iframe>
                 </div>
 
             </div>
 
-            <div id="chat-window-view">
-                 <div id="chat-placeholder" class="chat-placeholder">
-                    <img src="https://ton.org/download/ton_symbol.svg" alt="TON Symbol">
-                    <h2>Выберите чат</h2>
-                    <p>Начните общение в одном из существующих чатов или создайте свой собственный.</p>
+            <div class="bottom-nav">
+                <div class="nav-item" data-view="chats">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z"/></svg>
+                    <span>Чаты</span>
                 </div>
-                <div id="active-chat" style="display: none; width: 100%; height: 100%; flex-direction: column;">
-                    <div class="chat-header">
-                        <button class="back-btn" id="back-to-list-btn">
-                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
-                        </button>
-                        <div id="chat-header-avatar" class="avatar"></div>
-                        <span id="chat-header-title"></span>
-                    </div>
-                    <div id="messages-container"></div>
-                    <form id="message-form" class="message-form">
-                        <input type="text" id="message-input" placeholder="Сообщение..." autocomplete="off">
-                        <button type="submit" class="action-btn send-btn" id="send-btn">
-                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
-                        </button>
-                    </form>
+                <div class="nav-item" data-view="users">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.55 1.26 2.78 2.83 3.46 4.45.1-.01.2-.02.31-.05V19h4v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
+                    <span>Пользователи</span>
+                </div>
+                 <div class="nav-item qr-scan" data-view="scanner">
+                     <svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24" fill="white"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M3 11h8V3H3v8zm2-6h4v4H5V5zM3 21h8v-8H3v8zm2-6h4v4H5v-4zm8-12v8h8V3h-8zm6 6h-4V5h4v4zm-2 10a2 2 0 100-4 2 2 0 000 4z"/></svg>
+                     <span>QR</span>
+                </div>
+                <div class="nav-item" data-view="browser">
+                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-5 14H4V6h11v12zm-1-7l-1.25 2.75L10 15l2.75-1.25L15 10l-1 1z"/></svg>
+                    <span>Браузер</span>
+                </div>
+                <div class="nav-item" data-view="profile">
+                    <svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>
+                    <span>Профиль</span>
                 </div>
             </div>
 
@@ -824,7 +776,7 @@ def index():
                     <input type="password" id="room-password">
                     <div class="modal-actions">
                         <button type="button" id="create-room-cancel" class="modal-btn secondary-btn">Отмена</button>
-                        <button type="submit" class="modal-btn action-btn">Создать</button>
+                        <button type="submit" class="modal-btn action-modal-btn">Создать</button>
                     </div>
                 </form>
             </div>
@@ -838,22 +790,22 @@ def index():
                     <input type="password" id="password-input" required>
                     <div class="modal-actions">
                         <button type="button" id="password-cancel" class="modal-btn secondary-btn">Отмена</button>
-                        <button type="submit" class="modal-btn action-btn">Войти</button>
+                        <button type="submit" class="modal-btn action-modal-btn">Войти</button>
                     </div>
                 </form>
             </div>
         </div>
 
         <div id="profile-modal" class="modal-overlay">
-            <div class="modal-content" style="text-align: center;">
+            <div class="modal-content">
                 <h3 id="profile-modal-title">Профиль пользователя</h3>
                 <div id="profile-avatar-container" style="margin: 20px auto; display: inline-block;"></div>
-                <p id="profile-username-modal" style="font-size: 1.2rem; font-weight: 600;"></p>
-                <p id="profile-address-modal" style="color: var(--text-secondary); font-size: 0.9rem; word-break: break-all; margin-top: 8px;"></p>
-                <div id="profile-qr-code-modal" style="background: white; padding: 10px; margin: 20px auto; width: fit-content; border-radius: 8px;"></div>
+                <p id="profile-username" style="font-size: 1.2rem; font-weight: 600;"></p>
+                <p id="profile-address" style="color: var(--text-secondary); font-size: 0.9rem; word-break: break-all; margin-top: 8px;"></p>
+                <div id="profile-qr-code" style="background: white; padding: 10px; margin: 20px auto; width: fit-content; border-radius: 8px;"></div>
                 <p style="text-align: center; color: var(--text-secondary); font-size: 0.8rem; margin-top: -10px; margin-bottom: 20px;">Отсканируйте для открытия профиля</p>
                 <div class="modal-actions" style="flex-direction: column; gap: 12px; align-items: stretch;">
-                    <button id="send-ton-btn" class="modal-btn action-btn">Отправить TON</button>
+                    <button id="send-ton-btn" class="modal-btn action-modal-btn">Отправить TON</button>
                     <button id="profile-close-btn" class="modal-btn secondary-btn">Закрыть</button>
                 </div>
             </div>
@@ -862,7 +814,7 @@ def index():
         <div id="scanner-modal" class="modal-overlay">
             <div class="modal-content">
                 <h3>Сканировать QR-код</h3>
-                <div id="qr-reader" style="width: 100%; border: 1px solid var(--border-color); margin-top: 16px; border-radius: 8px; overflow: hidden;"></div>
+                <div id="qr-reader"></div>
                 <div class="modal-actions">
                     <button id="scanner-close-btn" class="modal-btn secondary-btn">Отмена</button>
                 </div>
@@ -882,23 +834,21 @@ def index():
                 let activeChatroomId = null;
                 let messagePollingInterval = null;
                 let chatroomsData = {};
-                let usersData = {};
                 let html5QrCode = null;
-                let profileQrCodeInstance = null;
-                let myProfileQrCodeInstance = null;
-                
+                let profileQrCode = null;
+                let currentView = 'chats'; // Default view
+
                 const loginView = document.getElementById('login-view');
                 const appView = document.getElementById('app-view');
                 const chatroomListView = document.getElementById('chatroom-list-view');
                 const userListView = document.getElementById('user-list-view');
-                const browserView = document.getElementById('browser-view');
-                const profileDetailsView = document.getElementById('profile-details-view');
                 const chatWindowView = document.getElementById('chat-window-view');
+                const browserView = document.getElementById('browser-view');
                 const chatPlaceholder = document.getElementById('chat-placeholder');
                 const activeChat = document.getElementById('active-chat');
                 const profileModal = document.getElementById('profile-modal');
                 const scannerModal = document.getElementById('scanner-modal');
-                const navButtons = document.querySelectorAll('.nav-button');
+                const bottomNavItems = document.querySelectorAll('.bottom-nav .nav-item');
 
                 const AVATAR_COLORS = ['#e57373', '#81c784', '#64b5f6', '#ffb74d', '#9575cd', '#4db6ac', '#f06292'];
 
@@ -919,9 +869,13 @@ def index():
                     statusBar.className = 'status-bar';
                     if (type === 'success') statusBar.classList.add('success');
                     else if (type === 'error') statusBar.classList.add('error');
-                    
+
                     statusBar.classList.add('visible');
-                    setTimeout(() => statusBar.classList.remove('visible'), duration);
+                    setTimeout(() => {
+                        statusBar.classList.remove('visible');
+                        // Allow time for transition before removing class
+                         setTimeout(() => statusBar.className = 'status-bar', 300);
+                    }, duration);
                 };
 
                 const apiCall = async (endpoint, options = {}) => {
@@ -938,51 +892,20 @@ def index():
                         throw error;
                     }
                 };
-                
+
                 const truncateAddress = (address) => address ? `${address.substring(0, 4)}...${address.substring(address.length - 4)}` : '';
 
-                const updateMyProfileView = async () => {
-                    if (!currentUser.address) return;
-
-                    const username = currentUser.username || `User ${truncateAddress(currentUser.address)}`;
-                    const avatarContainer = document.getElementById('my-profile-avatar');
-                    const usernameEl = document.getElementById('my-profile-username');
-                    const addressEl = document.getElementById('my-profile-address');
-                    const balanceEl = document.getElementById('my-profile-balance');
-                    const qrCodeEl = document.getElementById('my-profile-qr-code');
-                    const usernameInput = document.getElementById('my-username-input');
-
-                    avatarContainer.innerHTML = '';
-                    avatarContainer.appendChild(getAvatar(username));
-                    usernameEl.textContent = username;
-                    addressEl.textContent = currentUser.address;
+                const updateUserInfo = () => {
+                    document.getElementById('user-wallet').textContent = `Кошелек: ${truncateAddress(currentUser.address)}`;
+                    const nicknameEl = document.getElementById('user-nickname');
+                    const usernameInput = document.getElementById('username-input');
+                    nicknameEl.textContent = currentUser.username ? `Ник: ${currentUser.username}` : `Никнейм не установлен`;
                     usernameInput.value = currentUser.username || '';
-
-                    if (tonConnectUI.wallet?.account?.balance) {
-                         const balanceNano = tonConnectUI.wallet.account.balance;
-                         const balanceTon = (parseInt(balanceNano) / 1_000_000_000).toFixed(2);
-                         balanceEl.textContent = `Баланс: ${balanceTon} TON`;
-                    } else {
-                         balanceEl.textContent = `Баланс: Недоступно`;
-                    }
-
-                    qrCodeEl.innerHTML = '';
-                    if (myProfileQrCodeInstance) {
-                         myProfileQrCodeInstance.clear();
-                    }
-                    myProfileQrCodeInstance = new QRCode(qrCodeEl, {
-                        text: currentUser.address,
-                        width: 150,
-                        height: 150,
-                        colorDark : "#000000",
-                        colorLight : "#ffffff",
-                        correctLevel : QRCode.CorrectLevel.H
-                    });
                 };
-                
-                document.getElementById('my-username-form').addEventListener('submit', async (e) => {
+
+                document.getElementById('username-form').addEventListener('submit', async (e) => {
                     e.preventDefault();
-                    const newUsername = document.getElementById('my-username-input').value.trim();
+                    const newUsername = document.getElementById('username-input').value.trim();
                     if (!newUsername || newUsername.length < 3) {
                         showStatus('Никнейм должен быть не короче 3 символов.', 'error');
                         return;
@@ -998,11 +921,11 @@ def index():
                             body: JSON.stringify({ address: currentUser.address, username: newUsername })
                         });
                         currentUser.username = newUsername;
-                        updateMyProfileView();
+                        updateUserInfo();
                         showStatus('Никнейм успешно обновлен!', 'success');
-                        fetchChatrooms();
-                         fetchUsers();
-                        if (activeChatroomId) fetchMessages(activeChatroomId); 
+                        fetchChatrooms(); // Update chat list names
+                        fetchUsers(); // Update user list names
+                        if (activeChatroomId) fetchMessages(activeChatroomId); // Update chat messages names
                     } catch (err) {}
                 });
 
@@ -1018,24 +941,109 @@ def index():
                     } catch (err) {
                         currentUser.username = null;
                     }
+                    updateUserInfo();
                     loginView.style.display = 'none';
                     appView.style.display = 'flex';
-                    showView('chatroom-list-view'); // Default view after login
+                    showView('chats'); // Show default view after login
                     fetchChatrooms();
-                    // Users and Profile views fetch data when selected
+                    fetchUsers();
+                };
+
+                const stopMessagePolling = () => {
+                    if (messagePollingInterval) {
+                        clearInterval(messagePollingInterval);
+                        messagePollingInterval = null;
+                    }
+                };
+
+                const startMessagePolling = (roomId) => {
+                     stopMessagePolling(); // Ensure no double polling
+                     messagePollingInterval = setInterval(() => fetchMessages(roomId), 3000);
+                };
+
+                const showView = (viewName) => {
+                     stopMessagePolling(); // Stop polling when switching views
+
+                    const views = {
+                        'chats': chatroomListView,
+                        'users': userListView,
+                        'chat': chatWindowView, // Special case for chat window on mobile
+                        'browser': browserView,
+                        'profile': profileModal, // Profile is a modal, handle separately
+                        'scanner': scannerModal // Scanner is a modal, handle separately
+                    };
+
+                    // Handle modals first
+                    if (viewName === 'profile') {
+                        if (currentUser.address) showProfile(currentUser.address);
+                        return; // Don't change main content view
+                    }
+                    if (viewName === 'scanner') {
+                        showScanner();
+                        return; // Don't change main content view
+                    }
+
+                    // Handle main content views
+                    currentView = viewName;
+                    const isMobile = window.innerWidth < 768;
+
+                    document.querySelectorAll('.app-view-section').forEach(view => {
+                        view.classList.remove('active');
+                    });
+
+                    bottomNavItems.forEach(item => {
+                         item.classList.remove('active');
+                         if (item.dataset.view === viewName) {
+                             item.classList.add('active');
+                         }
+                    });
+
+                    if (isMobile) {
+                        // On mobile, only one main view is visible at a time
+                        if (viewName === 'chat') {
+                             views[viewName].classList.add('active');
+                             document.getElementById('back-to-list-btn').style.display = 'block';
+                             activeChat.style.display = 'flex'; // Ensure active chat is visible
+                             chatPlaceholder.style.display = 'none'; // Hide placeholder
+                             if (activeChatroomId) startMessagePolling(activeChatroomId); // Restart polling if in chat
+                        } else {
+                            views[viewName].classList.add('active');
+                            document.getElementById('back-to-list-btn').style.display = 'none';
+                             activeChat.style.display = 'none'; // Hide active chat content
+                            chatPlaceholder.style.display = 'flex'; // Show placeholder
+                        }
+                    } else {
+                        // On desktop, chat/browser appears next to list
+                        // Show the requested view (chats/users/browser)
+                        if (viewName !== 'chat') { // 'chat' view is handled by selecting a room
+                             views[viewName].classList.add('active');
+                        }
+
+                        // Ensure the chat window is visible *if* a room is selected, regardless of the button clicked
+                         // But hide its content if we're not in the 'chat' context
+                        chatWindowView.classList.add('active'); // Chat window area is always visible on desktop
+
+                        if (activeChatroomId && viewName === 'chats') {
+                            activeChat.style.display = 'flex';
+                            chatPlaceholder.style.display = 'none';
+                             startMessagePolling(activeChatroomId);
+                        } else {
+                            activeChat.style.display = 'none';
+                            chatPlaceholder.style.display = 'flex';
+                        }
+                    }
                 };
 
                 const renderChatrooms = (rooms) => {
                     const list = document.getElementById('chatroom-list');
                     list.innerHTML = '';
-                     document.getElementById('chat-list-placeholder').style.display = rooms.length === 0 ? 'flex' : 'none';
                     chatroomsData = {};
                     rooms.forEach(room => {
                         chatroomsData[room.id] = room;
                         const item = document.createElement('div');
                         item.className = 'chatroom-item';
                         item.dataset.id = room.id;
-                        
+
                         item.appendChild(getAvatar(room.name));
 
                         const infoDiv = document.createElement('div');
@@ -1043,13 +1051,7 @@ def index():
                         const nameSpan = document.createElement('div');
                         nameSpan.className = 'item-name';
                         nameSpan.textContent = room.name;
-                         const descSpan = document.createElement('div');
-                         descSpan.className = 'item-description';
-                         // Could add last message preview here if backend supported it
-                         descSpan.textContent = room.is_private ? 'Приватный чат' : 'Открытый чат';
-
                         infoDiv.appendChild(nameSpan);
-                         infoDiv.appendChild(descSpan);
                         item.appendChild(infoDiv);
 
                         if (room.is_private) {
@@ -1062,59 +1064,48 @@ def index():
                         list.appendChild(item);
                     });
                 };
-                
+
                 const fetchChatrooms = async () => {
-                    if (!currentUser.address) return;
                     try {
                         const data = await apiCall('/api/chatrooms');
                         renderChatrooms(data.chatrooms);
                     } catch (err) {}
                 };
 
-                const renderUsers = (users) => {
-                     const list = document.getElementById('user-list');
-                     list.innerHTML = '';
-                     document.getElementById('user-list-placeholder').style.display = users.length === 0 ? 'flex' : 'none';
-                     usersData = {};
+                 const renderUsers = (users) => {
+                    const list = document.getElementById('user-list');
+                    list.innerHTML = '';
                      users.forEach(user => {
-                         usersData[user.address] = user;
                          const item = document.createElement('div');
                          item.className = 'user-item';
                          item.dataset.address = user.address;
 
-                         const displayName = user.username || `User ${truncateAddress(user.address)}`;
-                         item.appendChild(getAvatar(displayName));
+                         item.appendChild(getAvatar(user.username || user.address));
 
                          const infoDiv = document.createElement('div');
                          infoDiv.className = 'item-info';
                          const nameSpan = document.createElement('div');
                          nameSpan.className = 'item-name';
-                         nameSpan.textContent = displayName;
+                         nameSpan.textContent = user.username || 'Не установлен';
+                         infoDiv.appendChild(nameSpan);
                          const addressSpan = document.createElement('div');
-                         addressSpan.className = 'item-description';
+                         addressSpan.className = 'item-address';
                          addressSpan.textContent = truncateAddress(user.address);
-
-                         infoDiv.appendChild(nameSpan);
                          infoDiv.appendChild(addressSpan);
+
                          item.appendChild(infoDiv);
 
                          item.addEventListener('click', () => showProfile(user.address));
                          list.appendChild(item);
                      });
-                };
+                 };
 
-                const fetchUsers = async () => {
-                    if (!currentUser.address) return;
-                     document.getElementById('user-list-placeholder').style.display = 'flex';
+                 const fetchUsers = async () => {
                     try {
                         const data = await apiCall('/api/users');
                         renderUsers(data.users);
-                    } catch (err) {
-                         renderUsers([]); // Clear list on error
-                     } finally {
-                         document.getElementById('user-list-placeholder').style.display = 'none';
-                     }
-                };
+                    } catch (err) {}
+                 };
 
 
                 const renderMessages = (messages) => {
@@ -1129,7 +1120,7 @@ def index():
                         avatar.classList.add('message-avatar');
                         avatar.style.cursor = 'pointer';
                         avatar.onclick = () => showProfile(msg.sender_address);
-                        
+
                         const contentDiv = document.createElement('div');
                         contentDiv.className = 'message-content';
 
@@ -1137,7 +1128,7 @@ def index():
                         senderDiv.className = 'message-sender';
                         senderDiv.textContent = msg.display_name;
                         senderDiv.onclick = () => showProfile(msg.sender_address);
-                        
+
                         const bubbleDiv = document.createElement('div');
                         bubbleDiv.className = 'message-bubble';
                         bubbleDiv.textContent = msg.text;
@@ -1150,83 +1141,38 @@ def index():
                         container.appendChild(msgDiv);
                     });
 
-                    if(shouldScroll) {
+                    if(shouldScroll || messages.length <= 5) { // Scroll to bottom on initial load or if already there
                         container.scrollTop = container.scrollHeight;
                     }
                 };
-                
+
                 const fetchMessages = async (roomId) => {
-                    if (!currentUser.address || !roomId) return;
+                    if (!roomId) return;
                     try {
                         const data = await apiCall(`/api/messages/${roomId}`);
                         renderMessages(data.messages);
                     } catch (err) {
-                        if (messagePollingInterval) clearInterval(messagePollingInterval);
+                        // Error fetching messages, polling will stop automatically if apiCall throws
                     }
                 };
 
-                const showView = (viewId) => {
-                    const views = [chatroomListView, userListView, browserView, profileDetailsView];
-                    views.forEach(view => {
-                         view.style.display = 'none';
-                         view.classList.remove('active');
-                    });
-                    document.getElementById(viewId).style.display = 'flex';
-                    document.getElementById(viewId).classList.add('active');
-
-                    navButtons.forEach(button => button.classList.remove('active'));
-                    document.querySelector(`.nav-button[data-view="${viewId}"]`)?.classList.add('active');
-
-                    if (messagePollingInterval) {
-                         clearInterval(messagePollingInterval);
-                         messagePollingInterval = null;
-                    }
-                     activeChat.style.display = 'none';
-                     chatPlaceholder.style.display = 'flex';
-                     chatWindowView.classList.remove('visible-on-mobile');
-
-
-                    if (viewId === 'user-list-view' && currentUser.address) {
-                        fetchUsers();
-                    } else if (viewId === 'chatroom-list-view' && currentUser.address) {
-                        fetchChatrooms();
-                    } else if (viewId === 'profile-details-view' && currentUser.address) {
-                         updateMyProfileView();
-                    }
-
-                     // Handle desktop split view state
-                     handleResize();
-                };
-                
                 const selectChatroom = (roomId, isPrivate) => {
                     const roomData = chatroomsData[roomId];
-                    if (!roomData || !currentUser.address) return;
+                    if (!roomData) return;
 
                     const proceedToRoom = () => {
-                        if (messagePollingInterval) clearInterval(messagePollingInterval);
                         activeChatroomId = roomId;
-                        
+
                         document.getElementById('chat-header-title').textContent = roomData.name;
                         const headerAvatar = document.getElementById('chat-header-avatar');
                         headerAvatar.innerHTML = '';
                         headerAvatar.appendChild(getAvatar(roomData.name));
 
-                        chatPlaceholder.style.display = 'none';
-                        activeChat.style.display = 'flex';
-
-                         if (window.innerWidth < 768) {
-                            chatroomListView.style.display = 'none';
-                            chatWindowView.classList.add('visible-on-mobile');
-                         } else {
-                             // On desktop, chat window is always visible next to the list
-                             chatWindowView.style.display = 'flex';
-                             chatroomListView.style.display = 'flex'; // Ensure list is visible
-                         }
-                        
+                        showView('chat'); // Switch view to chat window
                         fetchMessages(roomId);
-                        messagePollingInterval = setInterval(() => fetchMessages(roomId), 3000);
+                        startMessagePolling(roomId);
                     };
-                    
+
                     if (isPrivate) {
                         const passwordModal = document.getElementById('password-modal');
                         const passwordForm = document.getElementById('password-form');
@@ -1237,9 +1183,11 @@ def index():
 
                         const formSubmitHandler = async (e) => {
                             e.preventDefault();
-                            passwordForm.removeEventListener('submit', formSubmitHandler);
                             const password = passwordInput.value;
                             passwordModal.style.display = 'none';
+                            passwordForm.removeEventListener('submit', formSubmitHandler); // Remove listener immediately
+                            document.getElementById('password-cancel').onclick = null; // Remove cancel handler
+
                             try {
                                 await apiCall('/api/join_chatroom', {
                                     method: 'POST',
@@ -1247,14 +1195,18 @@ def index():
                                     body: JSON.stringify({ chatroom_id: roomId, password })
                                 });
                                 proceedToRoom();
-                            } catch (err) {}
+                            } catch (err) {
+                                // Error message shown by apiCall
+                            }
                         };
                         passwordForm.addEventListener('submit', formSubmitHandler);
 
                         document.getElementById('password-cancel').onclick = () => {
                             passwordModal.style.display = 'none';
-                            passwordForm.removeEventListener('submit', formSubmitHandler);
+                            passwordForm.removeEventListener('submit', formSubmitHandler); // Clean up
+                            document.getElementById('password-cancel').onclick = null;
                         };
+
                     } else {
                         proceedToRoom();
                     }
@@ -1279,8 +1231,9 @@ def index():
                                     text: text
                                 })
                             });
+                             // Fetch messages immediately after sending
                             await fetchMessages(activeChatroomId);
-                            document.getElementById('messages-container').scrollTop = document.getElementById('messages-container').scrollHeight;
+                             // No need to scroll manually, renderMessages handles it
                         } finally {
                             input.disabled = false;
                             sendBtn.disabled = false;
@@ -1301,7 +1254,14 @@ def index():
                     e.preventDefault();
                     const name = document.getElementById('room-name').value.trim();
                     const password = document.getElementById('room-password').value;
-                    if (!name || !currentUser.address) return;
+                    if (!name) {
+                         showStatus('Название чата не может быть пустым.', 'error');
+                         return;
+                    }
+                    if (!currentUser.address) {
+                         showStatus('Ошибка: Пользователь не авторизован.', 'error');
+                         return;
+                    }
 
                     try {
                         await apiCall('/api/create_chatroom', {
@@ -1315,64 +1275,64 @@ def index():
                     } catch (err) {}
                 });
 
-                const showProfile = async (address) => {
-                    if (!address) return;
+                const showProfile = async (addressToShow) => {
+                    if (!addressToShow) {
+                         showStatus('Ошибка: Не указан адрес пользователя.', 'error');
+                         return;
+                    }
                     try {
                         const userData = await apiCall('/api/user_data', {
                             method: 'POST',
                             headers: { 'Content-Type': 'application/json' },
-                            body: JSON.stringify({ address: address })
+                            body: JSON.stringify({ address: addressToShow })
                         });
-                        
-                        const username = userData.username || `User ${truncateAddress(address)}`;
+
+                        const username = userData.username || `User ${truncateAddress(addressToShow)}`;
                         const avatarContainer = document.getElementById('profile-avatar-container');
-                        const usernameEl = document.getElementById('profile-username-modal');
-                        const addressEl = document.getElementById('profile-address-modal');
-                        const qrCodeEl = document.getElementById('profile-qr-code-modal');
+                        const usernameEl = document.getElementById('profile-username');
+                        const addressEl = document.getElementById('profile-address');
+                        const qrCodeEl = document.getElementById('profile-qr-code');
                         const sendTonBtn = document.getElementById('send-ton-btn');
-                        
+
                         avatarContainer.innerHTML = '';
                         avatarContainer.appendChild(getAvatar(username));
-                        
+
                         usernameEl.textContent = username;
-                        addressEl.textContent = address;
-                        
+                        addressEl.textContent = addressToShow;
+
                         qrCodeEl.innerHTML = '';
-                        if (profileQrCodeInstance) {
-                            profileQrCodeInstance.clear();
+                        if (profileQrCode) {
+                            profileQrCode.clear(); // Clear previous QR code
+                            profileQrCode = null;
                         }
-                        profileQrCodeInstance = new QRCode(qrCodeEl, {
-                            text: address,
+                        profileQrCode = new QRCode(qrCodeEl, {
+                            text: addressToShow,
                             width: 150,
                             height: 150,
                             colorDark : "#000000",
                             colorLight : "#ffffff",
                             correctLevel : QRCode.CorrectLevel.H
                         });
-                        
+
                         sendTonBtn.onclick = async () => {
                             if (!tonConnectUI.connected) {
                                 showStatus('Подключите кошелек для отправки TON.', 'error');
                                 return;
                             }
-                             if (address === currentUser.address) {
-                                showStatus('Нельзя отправить TON себе.', 'error');
-                                return;
-                             }
                             const amountString = prompt("Введите сумму в TON для отправки:", "0.1");
                             if (amountString === null) return;
-                            
+
                             const amount = parseFloat(amountString);
                             if (isNaN(amount) || amount <= 0) {
                                 showStatus('Неверная сумма.', 'error');
                                 return;
                             }
-                            
+
                             const amountInNanoTon = Math.floor(amount * 1_000_000_000).toString();
 
                             const transaction = {
-                                validUntil: Math.floor(Date.now() / 1000) + 600,
-                                messages: [ { address: address, amount: amountInNanoTon } ]
+                                validUntil: Math.floor(Date.now() / 1000) + 600, // 10 minutes
+                                messages: [ { address: addressToShow, amount: amountInNanoTon } ]
                             };
 
                             try {
@@ -1383,8 +1343,8 @@ def index():
                                 showStatus('Транзакция отклонена.', 'error');
                             }
                         };
-                        
-                        sendTonBtn.style.display = (address === currentUser.address || !tonConnectUI.connected) ? 'none' : 'block';
+
+                        sendTonBtn.style.display = (addressToShow === currentUser.address) ? 'none' : 'block';
                         profileModal.style.display = 'flex';
                     } catch (err) {
                         showStatus('Не удалось загрузить профиль.', 'error');
@@ -1393,20 +1353,29 @@ def index():
 
                 const showScanner = () => {
                     scannerModal.style.display = 'flex';
-                    html5QrCode = new Html5Qrcode("qr-reader");
+                    if (!html5QrCode) {
+                         html5QrCode = new Html5Qrcode("qr-reader");
+                    }
+
                     const qrCodeSuccessCallback = (decodedText, decodedResult) => {
                         hideScanner();
+                        // Basic validation for TON addresses
                         if (decodedText && decodedText.length > 40 && (decodedText.startsWith('EQ') || decodedText.startsWith('UQ'))) {
                             showProfile(decodedText);
                         } else {
-                             showStatus('Отсканирован недействительный QR-код адреса TON.', 'error');
+                            showStatus('Отсканирован недействительный QR-код (не похож на адрес TON).', 'error');
                         }
                     };
-                    const config = { fps: 10, qrbox: { width: 250, height: 250 } };
-                    html5QrCode.start({ facingMode: "environment" }, config, qrCodeSuccessCallback)
+                    const config = { fps: 10, qrbox: { width: 250, height: 250 }, aspectRatio: 1.0 };
+
+                    // Check for camera permissions and start scanning
+                    html5QrCode.start({ facingMode: "environment" }, config, qrCodeSuccessCallback, (errorMessage) => {
+                        // Optional: report errors
+                        // console.warn(`QR code no match: ${errorMessage}`);
+                    })
                         .catch(err => {
-                            showStatus('Не удалось запустить сканер.', 'error');
-                            hideScanner();
+                            showStatus(`Не удалось запустить сканер: ${err}`, 'error');
+                            hideScanner(); // Hide modal if start fails
                         });
                 };
 
@@ -1417,114 +1386,143 @@ def index():
                     scannerModal.style.display = 'none';
                 };
 
-                document.getElementById('browser-go').addEventListener('click', () => {
-                    const urlInput = document.getElementById('browser-url');
-                    let url = urlInput.value.trim();
-                    if (!url) return;
-                    if (!url.startsWith('http://') && !url.startsWith('https://')) {
-                        url = 'https://' + url; // Default to https
-                         urlInput.value = url;
-                    }
-                    document.getElementById('browser-iframe').src = url;
-                });
+                 // Browser View Logic
+                 document.getElementById('browser-form').addEventListener('submit', (e) => {
+                     e.preventDefault();
+                     const urlInput = document.getElementById('url-input');
+                     let url = urlInput.value.trim();
+                     const iframe = document.getElementById('browser-iframe');
+
+                     if (!url) return;
+
+                     // Simple URL sanitization/prefixing
+                     if (!url.startsWith('http://') && !url.startsWith('https://')) {
+                         // Assume it's a search query or missing protocol
+                          if (url.includes('.')) { // Looks like a domain
+                              url = 'https://' + url;
+                         } else { // Assume it's a search query
+                             url = `https://www.google.com/search?q=${encodeURIComponent(url)}`;
+                         }
+                     }
+
+                      try {
+                           iframe.src = url;
+                           // Update input value to the potentially corrected URL
+                           urlInput.value = url;
+                      } catch (e) {
+                           showStatus('Не удалось загрузить URL. Проверьте формат.', 'error');
+                      }
+                 });
 
-                navButtons.forEach(button => {
-                    if (button.id === 'nav-scan') {
-                        button.addEventListener('click', showScanner);
-                    } else {
-                         button.addEventListener('click', () => {
-                            const viewId = button.dataset.view;
-                            if (viewId) {
-                                 if (viewId === 'chatroom-list-view') {
-                                     // Reset chat window on mobile when navigating away from chat
-                                     if (window.innerWidth < 768) {
-                                         activeChatroomId = null;
-                                         activeChat.style.display = 'none';
-                                         chatPlaceholder.style.display = 'flex';
-                                         chatWindowView.classList.remove('visible-on-mobile');
-                                     }
-                                 }
-                                showView(viewId);
-                            }
-                        });
-                    }
-                });
 
+                // Event listeners for modals and navigation
                 document.getElementById('profile-close-btn').addEventListener('click', () => profileModal.style.display = 'none');
                 document.getElementById('scanner-close-btn').addEventListener('click', hideScanner);
-                
-                document.getElementById('back-to-list-btn').addEventListener('click', () => {
-                    activeChatroomId = null;
-                    activeChat.style.display = 'none';
-                    chatPlaceholder.style.display = 'flex';
-                    chatWindowView.classList.remove('visible-on-mobile');
-                    chatroomListView.style.display = 'flex'; // Show the list again
-                    // No need to call showView because we are staying within the chatroom list context
-                });
-                
-                const handleResize = () => {
-                    const isMobile = window.innerWidth < 768;
-
-                    // Navigation bar display
-                    const navBar = document.querySelector('.nav-bar');
-                    if (isMobile) {
-                        navBar.style.flexDirection = 'row';
-                        navBar.style.position = 'fixed';
-                        navBar.style.width = '100%';
-                        navBar.style.height = '56px';
-                        navBar.style.borderRight = 'none';
-                        navBar.style.borderTop = '1px solid var(--border-color)';
-                        navBar.style.padding = '0';
-                    } else {
-                        navBar.style.flexDirection = 'column';
-                        navBar.style.position = 'static';
-                        navBar.style.width = '60px';
-                        navBar.style.height = 'auto';
-                        navBar.style.borderRight = '1px solid var(--border-color)';
-                         navBar.style.borderTop = 'none';
-                        navBar.style.padding = '16px 0';
+                document.getElementById('back-to-list-btn').addEventListener('click', () => showView('chats')); // Go back to chats list
+
+
+                bottomNavItems.forEach(item => {
+                    if (item.dataset.view) {
+                        item.addEventListener('click', () => {
+                            // Special handling for chat window on mobile back button
+                            if (window.innerWidth < 768 && currentView === 'chat' && item.dataset.view !== 'chat') {
+                                // If currently in chat on mobile and clicking another nav item,
+                                // hide chat content first, then show the new view.
+                                activeChatroomId = null; // Effectively leave chat state
+                                activeChat.style.display = 'none';
+                                chatPlaceholder.style.display = 'flex';
+                            }
+                            showView(item.dataset.view);
+                        });
                     }
+                });
 
-                    // Back button visibility
-                    document.getElementById('back-to-list-btn').style.display = isMobile && activeChatroomId ? 'block' : 'none';
 
-                    // Main content views visibility
-                    const activeViewId = document.querySelector('.app-content > div.active')?.id;
+                const handleResize = () => {
+                     // Re-apply view logic on resize
+                     showView(currentView);
+
+                     const isMobile = window.innerWidth < 768;
+                     const backBtn = document.getElementById('back-to-list-btn');
+
+                     if (isMobile) {
+                         // On mobile, only show back button if current view is 'chat'
+                        if (currentView === 'chat' && activeChat.style.display === 'flex') {
+                            backBtn.style.display = 'block';
+                            chatroomListView.classList.remove('active');
+                            userListView.classList.remove('active');
+                            browserView.classList.remove('active');
+                            chatWindowView.classList.add('active');
+                        } else {
+                             backBtn.style.display = 'none';
+                            // Ensure correct view is active based on currentView
+                            document.querySelectorAll('.app-view-section').forEach(view => {
+                                view.classList.remove('active');
+                            });
+                             if (currentView === 'chats') chatroomListView.classList.add('active');
+                             if (currentView === 'users') userListView.classList.add('active');
+                             if (currentView === 'browser') browserView.classList.add('active');
 
-                    // On desktop, show the active view AND the chat window (if active)
-                    if (!isMobile) {
-                        [chatroomListView, userListView, browserView, profileDetailsView].forEach(view => {
-                            view.style.display = view.id === activeViewId ? 'flex' : 'none';
-                        });
-                        // Always show chat window area on desktop, hide placeholder if chat is active
-                        chatWindowView.style.display = 'flex';
-                        chatPlaceholder.style.display = activeChatroomId ? 'none' : 'flex';
-                        activeChat.style.display = activeChatroomId ? 'flex' : 'none';
-
-                         // Special case: if chat is active AND chatrooms is the active view, show both
-                         if (activeChatroomId && activeViewId === 'chatroom-list-view') {
-                             chatroomListView.style.display = 'flex';
-                             chatWindowView.style.display = 'flex';
+                            activeChat.style.display = 'none';
+                            chatPlaceholder.style.display = 'flex';
+                        }
+                     } else {
+                          // On desktop, back button is never visible
+                         backBtn.style.display = 'none';
+
+                         // On desktop, multiple sections can be displayed via flex
+                          chatroomListView.classList.remove('active'); // No need for .active class on desktop views
+                          userListView.classList.remove('active');
+                          chatWindowView.classList.remove('active');
+                          browserView.classList.remove('active');
+
+
+                          // Ensure the selected view and chat window are displayed side-by-side
+                         document.querySelectorAll('.app-view-section').forEach(view => view.style.display = 'none');
+
+
+                         if (currentView === 'chats') {
+                              chatroomListView.style.display = 'flex';
+                              chatWindowView.style.display = 'flex';
+                              if (activeChatroomId) {
+                                  activeChat.style.display = 'flex';
+                                  chatPlaceholder.style.display = 'none';
+                              } else {
+                                   activeChat.style.display = 'none';
+                                  chatPlaceholder.style.display = 'flex';
+                              }
+                         } else if (currentView === 'users') {
+                             userListView.style.display = 'flex';
+                             chatWindowView.style.display = 'flex'; // Keep chat window area visible
+                             activeChat.style.display = 'none'; // But hide chat content
+                             chatPlaceholder.style.display = 'flex';
+                         } else if (currentView === 'browser') {
+                             browserView.style.display = 'flex';
+                             chatWindowView.style.display = 'flex'; // Keep chat window area visible
+                             activeChat.style.display = 'none'; // But hide chat content
+                             chatPlaceholder.style.display = 'flex';
+                         } else if (currentView === 'chat') { // If we were in chat on mobile and resized to desktop
+                              chatroomListView.style.display = 'flex';
+                              chatWindowView.style.display = 'flex';
+                              if (activeChatroomId) {
+                                   activeChat.style.display = 'flex';
+                                  chatPlaceholder.style.display = 'none';
+                                  startMessagePolling(activeChatroomId); // Resume polling if active
+                              } else {
+                                  // Should not happen if currentView is 'chat' but activeChatroomId is null
+                                  activeChat.style.display = 'none';
+                                  chatPlaceholder.style.display = 'flex';
+                                  showView('chats'); // Default back to chats view
+                              }
                          }
 
-
-                    } else {
-                        // On mobile, only show either the active view or the chat window if active
-                        [chatroomListView, userListView, browserView, profileDetailsView].forEach(view => {
-                            view.style.display = 'none';
-                        });
-
-                         if (activeChatroomId) {
-                            chatWindowView.classList.add('visible-on-mobile');
-                         } else {
-                            chatWindowView.classList.remove('visible-on-mobile');
-                            document.getElementById(activeViewId || 'chatroom-list-view').style.display = 'flex'; // Show the currently selected main view
-                         }
-                    }
+                     }
                 };
 
                 window.addEventListener('resize', handleResize);
-                
+
+
+                // Initial TON Connect setup
                 tonConnectUI.onStatusChange(wallet => {
                     if (wallet) {
                         const address = TON_CONNECT_UI.toUserFriendlyAddress(wallet.account.address, false);
@@ -1533,37 +1531,22 @@ def index():
                         currentUser = { address: null, username: null };
                         appView.style.display = 'none';
                         loginView.style.display = 'flex';
-                        if (messagePollingInterval) clearInterval(messagePollingInterval);
+                        stopMessagePolling();
                         activeChatroomId = null;
-                         chatroomsData = {};
-                         usersData = {};
-                         document.getElementById('chatroom-list').innerHTML = '';
-                         document.getElementById('user-list').innerHTML = '';
-                         document.getElementById('messages-container').innerHTML = '';
-                         activeChat.style.display = 'none';
-                         chatPlaceholder.style.display = 'flex';
-                         chatWindowView.classList.remove('visible-on-mobile');
-                         // Ensure chatroom list view is visible again on mobile after logout
-                         if (window.innerWidth < 768) {
-                            chatroomListView.style.display = 'flex';
-                         }
-                    }
-                     // Update profile view and button states based on connection status
-                    if (document.querySelector('.app-content > div.active')?.id === 'profile-details-view') {
-                        updateMyProfileView();
                     }
                 });
 
-                 // Initial check on load
-                 if (tonConnectUI.connected) {
-                    const address = TON_CONNECT_UI.toUserFriendlyAddress(tonConnectUI.wallet.account.address, false);
-                    initializeUser(address);
-                 } else {
+                // Initial view setup
+                handleResize(); // Apply initial layout based on screen size
+                if (!tonConnectUI.connected) {
                     loginView.style.display = 'flex';
                     appView.style.display = 'none';
-                 }
+                } else {
+                    // If already connected on page load, initialize user and show app
+                     const address = TON_CONNECT_UI.toUserFriendlyAddress(tonConnectUI.wallet.account.address, false);
+                     initializeUser(address);
+                }
 
-                 handleResize(); // Apply correct layout on initial load
             });
         </script>
     </body>
@@ -1571,7 +1554,6 @@ def index():
     '''
     return Response(html_content, mimetype='text/html')
 
-
 @app.route('/api/user_data', methods=['POST'])
 def get_user_data():
     data = request.get_json()
@@ -1584,30 +1566,40 @@ def get_user_data():
     return jsonify({'username': username})
 
 @app.route('/api/users', methods=['GET'])
-def get_all_users():
+def get_users():
     db = read_db()
     users_list = []
     for address, user_info in db['users'].items():
-        users_list.append({
-            'address': address,
-            'username': user_info.get('username')
-        })
-    # Add users from messages who don't have a username registered
-    all_addresses = set(db['users'].keys())
-    for room_messages in db['messages'].values():
-        for msg in room_messages:
-            sender_address = msg['sender_address']
-            if sender_address not in all_addresses:
-                all_addresses.add(sender_address)
-                users_list.append({
-                    'address': sender_address,
-                    'username': None # No registered username
-                })
-    
-    # Sort users by username or address prefix
-    sorted_users = sorted(users_list, key=lambda x: (x['username'] is None, x['username'] or x['address']))
-
-    return jsonify({'users': sorted_users})
+         users_list.append({
+             'address': address,
+             'username': user_info.get('username')
+         })
+     # Add users from messages who aren't in the users dict yet
+    all_sender_addresses = set()
+    for chatroom_messages in db['messages'].values():
+         for msg in chatroom_messages:
+             all_sender_addresses.add(msg['sender_address'])
+
+    for address in all_sender_addresses:
+         if address not in db['users']:
+              users_list.append({
+                  'address': address,
+                  'username': None
+              })
+
+    # Remove duplicates based on address (though set usage above should prevent most)
+    seen_addresses = set()
+    unique_users = []
+    for user in users_list:
+        if user['address'] not in seen_addresses:
+            unique_users.append(user)
+            seen_addresses.add(user['address'])
+
+
+    # Sort by username or address
+    unique_users.sort(key=lambda x: (x['username'] is None, x['username'] or x['address']))
+
+    return jsonify({'users': unique_users})
 
 
 @app.route('/api/set_username', methods=['POST'])
@@ -1678,25 +1670,31 @@ def join_chatroom():
 def get_messages(chatroom_id):
     db = read_db()
     if chatroom_id not in db['messages']:
+        # Check if chatroom exists but has no messages yet
+        if chatroom_id in db['chatrooms']:
+             return jsonify({'messages': []})
         return jsonify({'error': 'Chatroom not found'}), 404
-    
+
     messages_with_names = []
     room_messages = db['messages'].get(chatroom_id, [])
-    
-    # Collect all sender addresses in this chat
-    sender_addresses_in_chat = {msg['sender_address'] for msg in room_messages}
-    
-    # Fetch usernames for all relevant addresses in one go
-    user_display_names = {}
-    for address in sender_addresses_in_chat:
-        user_info = db['users'].get(address)
-        display_name = (user_info.get('username') if user_info and user_info.get('username') 
-                        else f"{address[:4]}...{address[-4:]}")
-        user_display_names[address] = display_name
+
+    # Collect all sender addresses in this chatroom
+    sender_addresses_in_room = {msg['sender_address'] for msg in room_messages}
+
+    # Fetch user data for all senders in the room efficiently
+    users_in_room = {}
+    for address in sender_addresses_in_room:
+         user_info = db['users'].get(address)
+         users_in_room[address] = user_info.get('username') if user_info else None
+
 
     for msg in room_messages:
+        sender_address = msg['sender_address']
+        username = users_in_room.get(sender_address)
+        display_name = username if username else f"{sender_address[:4]}...{sender_address[-4:]}"
+
         msg_copy = msg.copy()
-        msg_copy['display_name'] = user_display_names.get(msg['sender_address'], f"{msg['sender_address'][:4]}...{msg['sender_address'][-4:]}") # Fallback just in case
+        msg_copy['display_name'] = display_name
         messages_with_names.append(msg_copy)
 
     return jsonify({'messages': messages_with_names})
@@ -1710,10 +1708,20 @@ def send_message():
 
     if not all([chatroom_id, sender_address, text]):
         return jsonify({'error': 'Missing data'}), 400
+    if not sender_address: # Double check sender address exists
+         return jsonify({'error': 'Sender address is required'}), 400
 
     db = read_db()
     if chatroom_id not in db['messages']:
-        return jsonify({'error': 'Chatroom not found'}), 404
+        # Check if chatroom exists but message list is missing (shouldn't happen with init_db)
+        if chatroom_id in db['chatrooms']:
+            db['messages'][chatroom_id] = []
+        else:
+            return jsonify({'error': 'Chatroom not found'}), 404
+
+    # Ensure sender is in users list if not already
+    if sender_address not in db['users']:
+        db['users'][sender_address] = {} # Add with default empty info
 
     message = {
         'id': str(uuid.uuid4()),
@@ -1721,8 +1729,9 @@ def send_message():
         'text': text,
         'timestamp': datetime.utcnow().isoformat() + "Z"
     }
-    
-    if len(db['messages'][chatroom_id]) >= 100: # Keep last 100 messages
+
+    # Keep only the last 100 messages per chatroom
+    if len(db['messages'][chatroom_id]) >= 100:
         db['messages'][chatroom_id].pop(0)
 
     db['messages'][chatroom_id].append(message)
@@ -1732,4 +1741,4 @@ def send_message():
 
 if __name__ == '__main__':
     init_db()
-    app.run(host='0.0.0.0', port=7860, debug=True) # debug=True for easier development
+    app.run(host='0.0.0.0', port=7860)