From e71bf0623fd940773b66f2358438f36ff0d34aed Mon Sep 17 00:00:00 2001
From: Max Ronzhin <m.ronzhin@ssphera.ru>
Date: Tue, 11 Aug 2026 20:49:33 +0300
Subject: [PATCH] =?UTF-8?q?feat(auth):=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2?=
 =?UTF-8?q?=D0=B8=D1=82=D1=8C=20=D0=B2=D0=BA=D0=BB=D0=B0=D0=B4=D0=BA=D1=83?=
 =?UTF-8?q?=20=C2=AB=D0=97=D0=B0=D0=B9=D1=82=D0=B8=20=D0=BA=D0=B0=D0=BA=20?=
 =?UTF-8?q?=D0=B3=D0=BE=D1=81=D1=82=D1=8C=C2=BB=20=D0=BD=D0=B0=20=D1=8D?=
 =?UTF-8?q?=D0=BA=D1=80=D0=B0=D0=BD=D1=8B=20=D0=B2=D1=85=D0=BE=D0=B4=D0=B0?=
 =?UTF-8?q?/=D1=80=D0=B5=D0=B3=D0=B8=D1=81=D1=82=D1=80=D0=B0=D1=86=D0=B8?=
 =?UTF-8?q?=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Незалогиненный пользователь может сразу перейти на /join, не выбирая
между входом и регистрацией. На узких экранах (375/360px) подпись
сокращается до «Гость», чтобы вкладка осталась в одну строку.
---
 frontend/src/pages/LoginPage.tsx    |  4 ++++
 frontend/src/pages/RegisterPage.tsx |  4 ++++
 frontend/src/styles/auth.css        | 14 ++++++++++++++
 3 files changed, 22 insertions(+)

diff --git a/frontend/src/pages/LoginPage.tsx b/frontend/src/pages/LoginPage.tsx
index cca3cd2..ea650d9 100644
--- a/frontend/src/pages/LoginPage.tsx
+++ b/frontend/src/pages/LoginPage.tsx
@@ -70,6 +70,10 @@ export function LoginPage() {
           <Link to="/register" className="tab" role="tab" aria-selected="false">
             Регистрация
           </Link>
+          <Link to="/join" className="tab" role="tab" aria-selected="false">
+            <span className="label-full">Зайти как гость</span>
+            <span className="label-short">Гость</span>
+          </Link>
         </div>
 
         <form
diff --git a/frontend/src/pages/RegisterPage.tsx b/frontend/src/pages/RegisterPage.tsx
index 2ab6c22..2232795 100644
--- a/frontend/src/pages/RegisterPage.tsx
+++ b/frontend/src/pages/RegisterPage.tsx
@@ -133,6 +133,10 @@ export function RegisterPage() {
           <span className="tab is-active" role="tab" aria-selected="true">
             Регистрация
           </span>
+          <Link to="/join" className="tab" role="tab" aria-selected="false">
+            <span className="label-full">Зайти как гость</span>
+            <span className="label-short">Гость</span>
+          </Link>
         </div>
         <h2 className="screen-title">Создать аккаунт</h2>
         <form onSubmit={handleSubmit} noValidate>
diff --git a/frontend/src/styles/auth.css b/frontend/src/styles/auth.css
index e561ca3..c329580 100644
--- a/frontend/src/styles/auth.css
+++ b/frontend/src/styles/auth.css
@@ -104,6 +104,11 @@
 }
 .tab.is-active { background: var(--color-surface); color: var(--color-ink-700); font-weight: 600; box-shadow: var(--shadow-sm); }
 
+/* Короткая подпись вкладки «Зайти как гость» — на узком экране (см. @media
+   ниже) длинный вариант переносится на 2 строки и делает вкладку выше
+   соседних; та же схема, что у «Мини-окно»/«Мини» в RoomToolbar.tsx/room.css. */
+.tab .label-short { display: none; }
+
 .field { margin-bottom: var(--space-5); }
 .field label { display: block; font: var(--text-body); font-weight: 600; color: var(--color-ink-900); margin-bottom: var(--space-2); }
 .input-wrap { position: relative; display: flex; align-items: center; }
@@ -289,4 +294,13 @@
   .stat-glass { flex-basis: 100%; }
 
   .form-panel { padding: var(--space-6) var(--space-4) var(--space-10); }
+
+  /* Три вкладки (Вход/Регистрация/Зайти как гость) на ширину 375/360px в
+     исходный `width: fit-content` не помещаются — растягиваем группу на
+     всю ширину блока и даём каждой вкладке одинаковую долю вместо
+     ужимания по контенту, иначе текст «Регистрация» переносится. */
+  .tabs { width: 100%; }
+  .tab { flex: 1; justify-content: center; padding: 8px 6px; font-size: 13px; }
+  .tab .label-full { display: none; }
+  .tab .label-short { display: inline; }
 }