diff --git a/templates/index.html b/templates/index.html
index 1a28e30..e90b69f 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -71,10 +71,10 @@
         transition: all 0.2s ease;
     }
     
-    .post-row:hover:not(.active), .event-row:hover:not(.active) {
+    .post-row:hover:not(.active), .event-row:hover:not(.active), .category-row:hover:not(.active) {
         background-color: #f1f1f1;
     }
-    .post-row.active, .event-row.active {
+    .post-row.active, .event-row.active, .category-row.active {
         background-color: #e3f2fd !important;
         background-image: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%) !important;
         outline: 2px solid #0d6efd;
@@ -82,7 +82,7 @@
         box-shadow: 0 2px 4px rgba(13, 110, 253, 0.15);
     }
     
-    .post-row.active td, .event-row.active td {
+    .post-row.active td, .event-row.active td, .category-row.active td {
         background-color: transparent !important;
     }
     .status-badge {
@@ -91,7 +91,7 @@
     }
     
     /* Улучшенная видимость бейджей на выбранных строках */
-    .post-row.active .status-badge, .event-row.active .status-badge {
+    .post-row.active .status-badge, .event-row.active .status-badge, .category-row.active .status-badge {
         box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
         border: 1px solid rgba(255, 255, 255, 0.3);
     }
@@ -102,7 +102,7 @@
     }
     
     /* Улучшенная контрастность текста на выбранных строках */
-    .post-row.active td, .event-row.active td {
+    .post-row.active td, .event-row.active td, .category-row.active td {
         color: #1a1a1a;
         font-weight: 600;
     }
@@ -110,7 +110,8 @@
     /* Специальный стиль для превью текста на выбранных строках */
     .post-row.active .post-text-preview, 
     .post-row.active .shortname-preview,
-    .event-row.active .event-name-preview {
+    .event-row.active .event-name-preview,
+    .category-row.active .category-name-preview {
         color: #2c3e50;
         font-weight: 600;
     }
@@ -1856,10 +1857,14 @@
             }
             tableBody.innerHTML = '';
             categories.forEach(category => {
-                const publicationBadge = category.marked_for_publication
+                // Проверяем наличие полей и создаем бейджи
+                const markedForPub = category.marked_for_publication === true || category.marked_for_publication === 1;
+                const isPublished = category.is_tg_published === true || category.is_tg_published === 1;
+                
+                const publicationBadge = markedForPub && !isPublished
                     ? '<span class="badge bg-warning status-badge">Для публикации</span>'
                     : '';
-                const publishedBadge = category.is_tg_published
+                const publishedBadge = isPublished
                     ? '<span class="badge bg-primary status-badge ms-1">Опубликовано</span>'
                     : '';
                 const row = `
@@ -1946,35 +1951,39 @@
             };
             // Создаем HTML для деталей
             let detailsHtml = `
-            <div style="position: relative;">
-                ${category.image_url ? `
-                <div id="category-image-container" style="position: absolute; top: 0; right: 0; z-index: 10; display: none;">
-                    <img id="category-image" src="${category.image_url}" 
-                         style="max-width: 200px; max-height: 200px; width: auto; height: auto; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"
-                         alt="Изображение площадки">
-                </div>
-                ` : ''}
-                <div class="mb-3" id="category-content" ${category.image_url ? 'style="padding-right: 220px;"' : ''}>
-                    <div class="mb-2">
-                        <strong>ID:</strong> ${category.id || 'Не указано'}
+            <div>
+                <div class="row mb-3">
+                    <div class="col-md-8">
+                        <div class="mb-2">
+                            <strong>ID:</strong> ${category.id || 'Не указано'}
+                        </div>
+                        <div class="mb-2">
+                            <strong>Название:</strong> ${category.title || 'Не указано'}
+                        </div>
+                        <div class="mb-2">
+                            <strong>Статус:</strong> 
+                            ${category.marked_for_publication && !category.is_tg_published ? '<span class="badge bg-warning">Для публикации</span>' : ''}
+                            ${!category.marked_for_publication && !category.is_tg_published ? '<span class="badge bg-secondary">Не для публикации</span>' : ''}
+                            ${category.is_tg_published ? '<span class="badge bg-primary">Опубликовано</span>' : ''}
+                        </div>
+                        ${category.is_tg_published ? `
+                        <div class="mb-2">
+                            <strong>Опубликовано в TG</strong> ${category.tg_id ? `[ID ${category.tg_id}]` : ''} ${category.tg_published_date ? formatDateTime(category.tg_published_date) : ''}
+                        </div>
+                        ` : ''}
+                        <div class="mb-2">
+                            <strong>Количество событий:</strong> ${category.event_count || 0}
+                        </div>
                     </div>
-                    <div class="mb-2">
-                        <strong>Название:</strong> ${category.title || 'Не указано'}
-                    </div>
-                    <div class="mb-2">
-                        <strong>Статус:</strong> 
-                        ${category.marked_for_publication && !category.is_tg_published ? '<span class="badge bg-warning">Для публикации</span>' : ''}
-                        ${!category.marked_for_publication && !category.is_tg_published ? '<span class="badge bg-secondary">Не для публикации</span>' : ''}
-                        ${category.is_tg_published ? '<span class="badge bg-primary">Опубликовано</span>' : ''}
-                    </div>
-                    ${category.is_tg_published ? `
-                    <div class="mb-2">
-                        <strong>Опубликовано в TG</strong> ${category.tg_id ? `[ID ${category.tg_id}]` : ''} ${category.tg_published_date ? formatDateTime(category.tg_published_date) : ''}
+                    ${category.image_url ? `
+                    <div class="col-md-4">
+                        <div id="category-image-container" style="text-align: right; display: none;">
+                            <img id="category-image" src="${category.image_url}" 
+                                 style="max-width: 200px; max-height: 200px; width: auto; height: auto; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"
+                                 alt="Изображение площадки">
+                        </div>
                     </div>
                     ` : ''}
-                    <div class="mb-2">
-                        <strong>Количество событий:</strong> ${category.event_count || 0}
-                    </div>
                 </div>`;
             if (category.description) {
                 detailsHtml += `
@@ -1990,7 +1999,6 @@
             if (category.image_url) {
                 const img = document.getElementById('category-image');
                 const imgContainer = document.getElementById('category-image-container');
-                const contentDiv = document.getElementById('category-content');
                 
                 if (img && imgContainer) {
                     img.onload = function() {
@@ -2000,10 +2008,6 @@
                     img.onerror = function() {
                         // Изображение не загрузилось, скрываем контейнер
                         imgContainer.style.display = 'none';
-                        // Убираем отступ справа, если изображение не загрузилось
-                        if (contentDiv) {
-                            contentDiv.style.paddingRight = '';
-                        }
                     };
                 }
             }