diff --git a/assets/css/discord.css b/assets/css/discord.css
index 04dfcd1..ec1c135 100644
--- a/assets/css/discord.css
+++ b/assets/css/discord.css
@@ -665,9 +665,19 @@ body {
     border-radius: 4px;
 }
 .custom-scrollbar::-webkit-scrollbar-thumb:hover {
-    background: #1a1b1e;
+    background: #4e5058;
 }
 
+.no-scrollbar::-webkit-scrollbar {
+    display: none;
+}
+
+.no-scrollbar {
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+}
+
+
 .emoji-picker {
     position: fixed;
     background-color: #1e1f22;
diff --git a/assets/js/main.js b/assets/js/main.js
index 67fc062..f19f225 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -98,7 +98,7 @@ document.addEventListener('DOMContentLoaded', () => {
                 grid.innerHTML = '';
                 
                 if (emotes.length === 0) {
-                    grid.innerHTML = '<div class="col-12 text-center text-muted p-4" style="grid-column: span 8;">Aucune emote personnalisée. Ajoutez-en une !</div>';
+                    grid.innerHTML = '<div class="col-12 text-center text-muted p-4" style="grid-column: 1 / -1;">Aucune emote personnalisée. Ajoutez-en une !</div>';
                 } else {
                     emotes.forEach(emote => {
                         const div = document.createElement('div');
@@ -245,26 +245,30 @@ document.addEventListener('DOMContentLoaded', () => {
             this.hide();
             
             const picker = document.createElement('div');
-            picker.className = 'emoji-picker p-0 overflow-hidden d-flex flex-column';
-            picker.style.width = options.width || '350px';
-            picker.style.height = options.height || '450px';
+            picker.className = 'universal-emoji-picker p-0 overflow-hidden d-flex flex-column';
+            picker.style.width = options.width || '900px';
+            picker.style.height = options.height || '500px';
             picker.style.backgroundColor = '#313338';
             picker.style.border = '1px solid #1e1f22';
             picker.style.borderRadius = '8px';
             picker.style.boxShadow = '0 8px 24px rgba(0,0,0,0.5)';
-            picker.style.zIndex = '4000';
+            picker.style.zIndex = '11000'; // Higher than most modals
             picker.style.position = 'fixed';
+            picker.style.padding = '0'; // Explicitly override any CSS
 
             // Tab Navigation
             const tabs = document.createElement('div');
-            tabs.className = 'd-flex overflow-auto border-bottom border-secondary p-1 custom-scrollbar';
+            tabs.className = 'd-flex overflow-x-auto border-bottom border-secondary p-1 no-scrollbar';
             tabs.style.gap = '2px';
             tabs.style.backgroundColor = '#2b2d31';
+            tabs.style.flexShrink = '0';
+            tabs.style.minHeight = '42px';
 
             // Search Container
             const searchContainer = document.createElement('div');
             searchContainer.className = 'p-2 border-bottom border-secondary';
             searchContainer.style.backgroundColor = '#313338';
+            searchContainer.style.flexShrink = '0';
             
             const searchInput = document.createElement('input');
             searchInput.type = 'text';
@@ -274,11 +278,12 @@ document.addEventListener('DOMContentLoaded', () => {
 
             // Grid Container
             const grid = document.createElement('div');
-            grid.className = 'flex-grow-1 overflow-auto p-2 custom-scrollbar';
+            grid.className = 'flex-grow-1 overflow-auto p-1 custom-scrollbar'; // Reduced padding
             grid.style.display = 'grid';
-            grid.style.gridTemplateColumns = 'repeat(8, 1fr)';
-            grid.style.gap = '5px';
+            grid.style.gridTemplateColumns = 'repeat(15, 1fr)';
+            grid.style.gap = '2px';
             grid.style.backgroundColor = '#313338';
+            grid.style.alignContent = 'start';
 
             const renderGrid = async (cat = null, term = '') => {
                 grid.innerHTML = '';
@@ -286,12 +291,14 @@ document.addEventListener('DOMContentLoaded', () => {
                 if (term) {
                     const customEmotes = window.CUSTOM_EMOTES_CACHE || [];
                     const filteredCustom = customEmotes.filter(e => e.name.toLowerCase().includes(term.toLowerCase()) || e.code.toLowerCase().includes(term.toLowerCase()));
-                    
+                    const filteredStandard = ALL_EMOJIS.filter(e => e.includes(term));
+
                     filteredCustom.forEach(emote => {
                         const div = document.createElement('div');
-                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-2';
+                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-1';
                         div.style.cursor = 'pointer';
-                        div.innerHTML = `<img src="${emote.path}" style="width: 24px; height: 24px; object-fit: contain;">`;
+                        div.style.aspectRatio = '1/1';
+                        div.innerHTML = `<img src="${emote.path}" style="width: 32px; height: 32px; object-fit: contain;">`;
                         div.title = emote.code;
                         div.onclick = (e) => {
                             e.stopPropagation();
@@ -301,12 +308,12 @@ document.addEventListener('DOMContentLoaded', () => {
                         grid.appendChild(div);
                     });
 
-                    const filteredStandard = ALL_EMOJIS.filter(e => e.includes(term));
                     filteredStandard.forEach(emoji => {
                         const div = document.createElement('div');
-                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-2';
+                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-1';
                         div.style.cursor = 'pointer';
                         div.style.fontSize = '24px';
+                        div.style.aspectRatio = '1/1';
                         div.textContent = emoji;
                         div.onclick = (e) => {
                             e.stopPropagation();
@@ -321,14 +328,15 @@ document.addEventListener('DOMContentLoaded', () => {
                 if (cat === 'Custom') {
                     const customEmotes = (window.CUSTOM_EMOTES_CACHE && window.CUSTOM_EMOTES_CACHE.length > 0) ? window.CUSTOM_EMOTES_CACHE : await window.loadCustomEmotes();
                     if (customEmotes.length === 0) {
-                        grid.innerHTML = '<div class="col-12 text-center text-muted p-4" style="grid-column: span 8; font-size: 0.8em;">Aucune emote personnalisée.</div>';
+                        grid.innerHTML = '<div class="col-12 text-center text-muted p-4" style="grid-column: span 15; font-size: 0.8em;">Aucune emote personnalisée.</div>';
                         return;
                     }
                     customEmotes.forEach(emote => {
                         const div = document.createElement('div');
-                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-2';
+                        div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-1';
                         div.style.cursor = 'pointer';
-                        div.innerHTML = `<img src="${emote.path}" style="width: 24px; height: 24px; object-fit: contain;">`;
+                        div.style.aspectRatio = '1/1';
+                        div.innerHTML = `<img src="${emote.path}" style="width: 32px; height: 32px; object-fit: contain;">`;
                         div.title = emote.code;
                         div.onclick = (e) => {
                             e.stopPropagation();
@@ -343,9 +351,10 @@ document.addEventListener('DOMContentLoaded', () => {
                 let list = EMOJI_CATEGORIES[cat];
                 (list || []).forEach(emoji => {
                     const div = document.createElement('div');
-                    div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-2';
+                    div.className = 'role-emoji-item rounded d-flex align-items-center justify-content-center p-1';
                     div.style.cursor = 'pointer';
                     div.style.fontSize = '24px';
+                    div.style.aspectRatio = '1/1';
                     div.textContent = emoji;
                     div.onclick = (e) => {
                         e.stopPropagation();
@@ -400,10 +409,18 @@ document.addEventListener('DOMContentLoaded', () => {
             const rect = anchor.getBoundingClientRect();
             let top = rect.top - picker.offsetHeight - 10;
             if (top < 0) top = rect.bottom + 10;
+            
             let left = rect.left;
             if (left + picker.offsetWidth > window.innerWidth) left = window.innerWidth - picker.offsetWidth - 20;
             if (left < 10) left = 10;
 
+            // Ensure it doesn't go off screen at the bottom
+            if (top + picker.offsetHeight > window.innerHeight) {
+                top = window.innerHeight - picker.offsetHeight - 10;
+            }
+            // Ensure it doesn't go off screen at the top
+            if (top < 0) top = 10;
+
             picker.style.top = `${top}px`;
             picker.style.left = `${left}px`;
 
@@ -428,7 +445,7 @@ document.addEventListener('DOMContentLoaded', () => {
     };
 
     // Replace old showEmojiPicker and role grid logic
-    window.showEmojiPicker = (anchor, callback) => UniversalEmojiPicker.show(anchor, callback, { width: '350px', height: '400px' });
+    window.showEmojiPicker = (anchor, callback) => UniversalEmojiPicker.show(anchor, callback, { width: '900px', height: '500px' });
 
     window.renderEmojiToElement = (code, el) => {
         if (!el) return;
@@ -464,7 +481,7 @@ document.addEventListener('DOMContentLoaded', () => {
                 const preview = document.getElementById(config.preview);
                 if (input) input.value = emoji;
                 window.renderEmojiToElement(emoji, preview);
-            }, { width: "350px", height: "400px" });
+            }, { width: "900px", height: "500px" });
             return;
         }
 
@@ -478,7 +495,7 @@ document.addEventListener('DOMContentLoaded', () => {
                     chatInput.value += emoji;
                     chatInput.focus();
                 }
-            }, { keepOpen: true, width: "350px", height: "400px" });
+            }, { keepOpen: true, width: "900px", height: "500px" });
             return;
         }
 
diff --git a/assets/pasted-20260216-163622-0013f90f.png b/assets/pasted-20260216-163622-0013f90f.png
new file mode 100644
index 0000000..4c36fa8
Binary files /dev/null and b/assets/pasted-20260216-163622-0013f90f.png differ
diff --git a/assets/pasted-20260216-170004-77ff069d.png b/assets/pasted-20260216-170004-77ff069d.png
new file mode 100644
index 0000000..337a2f4
Binary files /dev/null and b/assets/pasted-20260216-170004-77ff069d.png differ
diff --git a/index.php b/index.php
index 3f378cd..fe968f2 100644
--- a/index.php
+++ b/index.php
@@ -1052,9 +1052,10 @@ $projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
     </div>
 </div>
 
+<!-- Server Settings Modal -->
 <!-- Server Settings Modal -->
 <div class="modal fade" id="serverSettingsModal" tabindex="-1">
-    <div class="modal-dialog">
+    <div class="modal-dialog modal-xl">
         <div class="modal-content">
             <div class="modal-header">
                 <h5 class="modal-title">Server Settings</h5>
diff --git a/requests.log b/requests.log
index 1cd2039..2fd0355 100644
--- a/requests.log
+++ b/requests.log
@@ -234,3 +234,11 @@
 2026-02-16 16:32:49 - GET /?fl_project=38443 - POST: []
 2026-02-16 16:32:51 - GET /index.php?server_id=1&channel_id=17 - POST: []
 2026-02-16 16:33:28 - GET /index.php?server_id=1&channel_id=17 - POST: []
+2026-02-16 16:38:10 - GET / - POST: []
+2026-02-16 16:38:17 - GET /?fl_project=38443 - POST: []
+2026-02-16 16:58:08 - GET /index.php?server_id=1&channel_id=17 - POST: []
+2026-02-16 16:58:15 - GET /index.php?server_id=1&channel_id=17 - POST: []
+2026-02-16 17:01:50 - GET /?fl_project=38443 - POST: []
+2026-02-16 17:03:56 - GET / - POST: []
+2026-02-16 17:04:02 - GET /?fl_project=38443 - POST: []
+2026-02-16 17:08:30 - GET /index.php?server_id=1&channel_id=17 - POST: []