fix(room): топбар и тулбар на мобильном не применялись + не тот блок скрывался

Правки для узких экранов стояли в середине room.css, а `.tb-btn`/
`.room-toolbar` объявлены ниже — при равной специфичности побеждает порядок
в исходнике, поэтому тулбар на мобильном не менялся вовсе (скрылся только
инвайт-чип, объявленный выше блока). Блок перенесён в конец файла.

В топбаре теперь скрываются название конференции и статус (слева), а чип
«№ … / Пригласить» остаётся — с телефона он нужнее (скопировать ссылку и
позвать участника). Тулбару добавлены flex-wrap и min-width: 0, чтобы он не
вылезал за ширину окна ни при каких подписях кнопок.

frontend/src/styles/room.css

@@ -115,26 +115,6 @@ video[data-lk-source='screen_share'] { object-fit: contain; background: #000; }
 @media (max-width: 600px) {
   .stage-tiles.lk-focus-layout { grid-template-columns: 1fr; }
   .stage { padding: var(--space-3) var(--space-4); gap: var(--space-3); }
-
-  /* Топбар: инвайт-чип (номер + копирование ссылки) убираем — на узком
-     экране это не помещалось рядом с названием (см. аудит мобильной версии),
-     сверху остаётся только название конференции и статус «активна». */
-  .room-topbar { padding: var(--space-3) var(--space-4); }
-  .room-invite-chip { display: none; }
-
-  /* Тулбар: демонстрация/полноэкранный режим/мини-окно скрыты на мобильном
-     (редко нужны с телефона, а тулбар со всеми 8 кнопками физически не
-     помещается в ширину экрана) — из оставшихся 5 кнопок собираем более
-     компактный вариант, чтобы они уместились без переноса и горизонтального
-     скролла. */
-  .tb-btn--screenshare,
-  .tb-btn--fullscreen,
-  .tb-btn--pip {
-    display: none;
-  }
-  .room-toolbar { padding: var(--space-3) var(--space-2); gap: 2px; }
-  .tb-btn { min-width: 0; padding: 6px 8px; }
-  .tb-btn .icon-shell { width: 40px; height: 40px; }
 }
 
 /*
@@ -500,3 +480,37 @@ video[data-lk-source='screen_share'] { object-fit: contain; background: #000; }
   --lk-grid-gap: var(--space-4);
   --lk-control-bar-height: 0px;
 }
+
+/* ---------- Узкие экраны: топбар и тулбар комнаты ----------
+   ВАЖНО: этот блок обязан идти строго ПОСЛЕДНИМ в файле. Селекторы ниже
+   (`.tb-btn`, `.room-toolbar`) имеют ту же специфичность, что и безусловные
+   правила выше, а при равной специфичности побеждает порядок в исходнике, а
+   не факт совпадения media query — тот же грабли уже ловили в
+   auth.css/calendar.css/lobby.css (см. комментарии там). Первая версия этого
+   блока стояла в середине файла: `.room-invite-chip` (объявлен ВЫШЕ) скрылся,
+   а `.tb-btn`/`.room-toolbar` (объявлены НИЖЕ) продолжали побеждать — тулбар
+   на мобильном не менялся вовсе.
+
+   Топбар: скрываем название конференции и строку статуса — они и так есть
+   в самой конференции, а вот чип «№ … / Пригласить» с телефона нужен чаще
+   (скопировать ссылку и позвать участника), поэтому он остаётся.
+
+   Тулбар: демонстрация экрана, полноэкранный режим и мини-окно с телефона
+   практически не нужны, а все 8 кнопок в ширину экрана физически не
+   помещаются — скрываем их и уплотняем оставшиеся пять
+   (микрофон/камера/устройства/чат/выход). `flex-wrap` + `min-width: 0` —
+   страховка на совсем узких экранах, чтобы футер ни при каких подписях не
+   вылезал за ширину окна. */
+@media (max-width: 600px) {
+  .room-topbar { padding: var(--space-3) var(--space-4); justify-content: flex-end; }
+  .room-title-block { display: none; }
+
+  .tb-btn--screenshare,
+  .tb-btn--fullscreen,
+  .tb-btn--pip { display: none; }
+
+  .room-toolbar { padding: var(--space-3) var(--space-2); gap: 2px; flex-wrap: wrap; }
+  .tb-btn { min-width: 0; padding: 6px 6px; }
+  .tb-btn .icon-shell { width: 40px; height: 40px; }
+  .tb-btn span.label { font-size: 11px; }
+}