...

app/styles.css

@@ -38,19 +38,58 @@
   color: #fef3c7;
 }
 
-  /* Поле для конспекта
+/* Поле для конспекта */
 #plan-output {
   border: 2px dashed #bbb;
   border-radius: 12px;
-  background-color: ##f5f5f5;
+  background-color: #f5f5f5;
   padding: 20px;
   min-height: 1500px;
   font-style: italic;
   color: #555;
   box-shadow: 0 2px 6px rgba(0,0,0,0.05);
+
+  /* Новые стили для таблиц */
+  overflow-x: auto; /* Горизонтальный скролл при необходимости */
+  white-space: normal; /* Отменяем переносы для таблиц */
+}
+
+/* Стили для Markdown-таблиц */
+#plan-output table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: 1em 0;
+  font-style: normal;
+  color: #333;
+}
+
+#plan-output th, #plan-output td {
+  padding: 8px 12px;
+  border: 1px solid #ddd;
+  text-align: left;
+  white-space: nowrap; /* Запрещаем перенос текста в ячейках */
+}
+
+#plan-output th {
+  background-color: #f0f0f0;
+  font-weight: bold;
+}
+
+/* Для узких экранов - адаптация */
+@media (max-width: 768px) {
+  #plan-output {
+    padding: 12px;
+    min-height: auto;
+  }
+
+  #plan-output table {
+    font-size: 0.9em;
+  }
+
+  #plan-output th, #plan-output td {
+    padding: 6px 8px;
+  }
 }
-*/
-/*#f5f5f5*/
 
 /* Стилизуем заголовок аккордеона (самую "кнопку") */
 .feedback-button {