UI: новый общий стиль, тёмная/светлая тема, настраиваемая палитра

- styles/main.css: роли цветов (по умолчанию «Индиго»), шкала отступов/скруглений/шрифтов,
  цвета отношений для обеих тем; жёсткие цвета в стилях заменены на роли.
- Палитра: пресеты и личные правки, «Оформление» Авто/День/Ночь, долгое нажатие —
  редактор цветов с экспортом/импортом.
- Каналы: пузыри постов автора, плашки дней, строка «Написать в канал…», «О канале»,
  создание канала с адресом из названия; лента открывается на свежих постах.
- Чаты: плоский список, чипы-фильтры, пузыри, плашки дней; нижняя панель скрыта в переписке.
- Корневые разделы — единая шапка; профиль и чужой профиль — общая карточка;
  настройки, кошелёк, сеансы — меню-списки.
- Нижняя панель: иконки без подписей, бейджи на иконках.
- confirmDialog вместо window.confirm/alert; на телефоне диалоги — шторки снизу.
- docs/UI-Design/ISSUES-for-dev.md — найденные ошибки сервера/UI.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

shine-UI/styles/features/developer-tools.css

@@ -19,7 +19,7 @@
 .key-storage-note--strong {
   font-size: 17px;
   font-weight: 700;
-  color: #eef4ff;
+  color: var(--text-primary);
 }
 
 
@@ -35,19 +35,19 @@
   gap: 8px;
   padding: 8px 10px;
   border-radius: 10px;
-  border: 1px solid rgba(143, 167, 215, 0.18);
-  background: rgba(14, 24, 45, 0.42);
+  border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent);
+  background: var(--surface);
 }
 
 
 .pwa-diag-key {
-  color: #cdd9f2;
+  color: var(--text-primary);
   font-size: 13px;
 }
 
 
 .pwa-diag-value {
-  color: #edf3ff;
+  color: var(--text-primary);
   font-size: 13px;
   text-align: right;
   word-break: break-word;
@@ -58,29 +58,29 @@
   width: 10px;
   height: 10px;
   border-radius: 50%;
-  background: #64708a;
+  background: var(--surface);
 }
 
 
 .pwa-diag-indicator.is-ok {
-  background: #66d69a;
-  box-shadow: 0 0 0 3px rgba(102, 214, 154, 0.18);
+  background: var(--success);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--success) 18%, transparent);
 }
 
 
 .pwa-diag-indicator.is-warn {
-  background: #f0c56b;
+  background: var(--warning);
 }
 
 
 .pwa-diag-indicator.is-bad {
-  background: #e48792;
-  box-shadow: 0 0 0 3px rgba(228, 135, 146, 0.18);
+  background: var(--danger);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 18%, transparent);
 }
 
 
 .pwa-diag-indicator.is-neutral {
-  background: #8994ab;
+  background: var(--text-primary);
 }
 
 
@@ -104,9 +104,9 @@
   padding: 10px;
   font-size: 12px;
   line-height: 1.35;
-  color: #dfe9ff;
-  background: rgba(8, 15, 28, 0.82);
-  border: 1px solid rgba(134, 157, 205, 0.2);
+  color: var(--text-primary);
+  background: var(--surface);
+  border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
 }
 
 
@@ -121,7 +121,7 @@
 
 .arweave-uploads-toolbar {
   align-items: center;
-  background: linear-gradient(135deg, rgba(15, 23, 42, 0.98), rgba(30, 41, 59, 0.98));
+  background: linear-gradient(135deg, var(--surface), var(--surface));
   border-bottom: 1px solid transparent;
   box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
   box-sizing: border-box;
@@ -155,7 +155,7 @@
 
 .arweave-uploads-title {
   align-self: center;
-  color: #f8fafc;
+  color: var(--text-primary);
   font-size: 0.94rem;
   font-weight: 800;
   min-width: 0;
@@ -167,7 +167,7 @@
 
 
 .arweave-uploads-menu {
-  background: rgba(15, 23, 42, 0.98);
+  background: var(--surface);
   border: 1px solid transparent;
   border-radius: 0.85rem;
   box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
@@ -187,7 +187,7 @@
 
 
 .arweave-uploads-menu .text-btn {
-  color: #f8fafc;
+  color: var(--text-primary);
   text-align: left;
 }