From c826d581ea58609e4b38ab91e0ec761362b71cb8 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 24 Aug 2026 05:32:10 +0000
Subject: [PATCH 1/4] =?UTF-8?q?=D0=9E=D1=82=D0=BA=D1=80=D1=8B=D1=82=D1=8B?=
 =?UTF-8?q?=D0=B5=20=D0=B2=D0=BE=D0=BF=D1=80=D0=BE=D1=81=D1=8B:=20=D0=BF?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=B5=D0=BB=D1=8C=20=D0=BD=D0=B0=D0=B4=20=D0=BA?=
 =?UTF-8?q?=D0=BB=D0=B0=D0=B2=D0=B8=D0=B0=D1=82=D1=83=D1=80=D0=BE=D0=B9=20?=
 =?UTF-8?q?=D0=B2=20=D0=BF=D0=BE=D0=BB=D0=B5=20=D0=B2=D0=B2=D0=BE=D0=B4?=
 =?UTF-8?q?=D0=B0,=20=D1=81=D1=82=D0=BE=D1=80=D0=BE=D0=BD=D0=B0=20=D1=81?=
 =?UTF-8?q?=D0=BE=D0=BE=D0=B1=D1=89=D0=B5=D0=BD=D0=B8=D0=B9=20=D0=B2=20?=
 =?UTF-8?q?=D0=BB=D0=B5=D0=BD=D1=82=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

По итогам теста с реальными пользователями. Решений пока нет — оба пункта
меняют текущее поведение (композер) и принятый макет ленты (ADR-024),
нужно решение перед ADR и кодом.
---
 docs/open-questions.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/docs/open-questions.md b/docs/open-questions.md
index 8b3e929..b2dcbfe 100644
--- a/docs/open-questions.md
+++ b/docs/open-questions.md
@@ -5,5 +5,7 @@
 - Серверный «перец» для ключевого блоба: дополнительное шифрование блоба серверным ключом, хранящимся вне базы. Плюс: дамп базы сам по себе перестаёт быть материалом для оффлайн-перебора. Минус: не защищает от оператора; потеря серверного ключа — невозможность входа с новых устройств для всех. Решение отложено.
 - Блокировка собеседника и персональные инвайты — если общего инвайт-кода и лимитов (ADR-019, ADR-021) окажется мало.
 - Подписи сообщений вторым ключом — если потребуется защита от сговора участника комнаты с сервером (ADR-016).
+- Поле ввода — `textarea` в мобильном Safari поднимает системную панель навигации по полям («‹ ›» и «готово») над клавиатурой: живой экран съедает лишние ~50 px, обжито пользователями плохо. Направление — заменить на `contenteditable`-блок (`role="textbox"`, `aria-multiline="true"`): у него этой панели нет, а клавиатура остаётся текстовой. Ручная работа взамен браузерной: placeholder, счётчик и обрезка на 4000 символов, автовысота, `paste` только как текст — без этого блока `innerHTML` в него попадёт вставкой, а `innerHTML` в клиенте запрещён (CLAUDE.md). Enter/Shift+Enter и `isComposing` — переносятся как есть. Решение отложено: выбрать между этим и более дешёвым вариантом (поле вне `<form>`, `autocomplete="off"`) — если он снимает панель хотя бы в Safari, возни меньше.
+- Выравнивание сообщений по стороне: свои — вправо, чужие — влево, как в обычных мессенджерах. Сейчас лента — общий список с колонкой автора (`docs/ui.md`, «Чат»; `docs/identity/brief.md`, «Компоновка»: сетка `132px 1fr` на десктопе, автор над группой на мобильном) — сторона у сообщения не задана нигде. Пользователям в тесте медленно читать, кто есть кто. Смена — это пересмотр принятого в ADR-024 макета ленты, нужен новый ADR, если решение — делать. Ограничение айдентики: без пузырей, скруглений и теней (`identity/brief.md`) — выравнивание, не bubble-чат.
 
 Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей.

From 334ce959350a63ec653f16eb93d6478fd08c3219 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 24 Aug 2026 06:10:18 +0000
Subject: [PATCH 2/4] =?UTF-8?q?ADR-064:=20=D1=81=D1=82=D1=80=D0=BE=D0=BA?=
 =?UTF-8?q?=D0=B0=20=D0=B2=D0=B2=D0=BE=D0=B4=D0=B0=20=D1=87=D0=B0=D1=82?=
 =?UTF-8?q?=D0=B0=20=E2=80=94=20div=20=D0=B2=D0=BC=D0=B5=D1=81=D1=82=D0=BE?=
 =?UTF-8?q?=20form?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Убирает системную панель навигации по полям над клавиатурой на iOS
(Safari и Chrome): она держится на элементе <form>, а не на textarea
как таковом. Дешёвый вариант вместо contenteditable — сначала пробуем
его, дороже (переписывать paste/placeholder/лимит руками) не потребовалось.

Отправка теперь идёт по click на кнопке и по keydown Enter вместо
события submit — форму убрали, role="form" держит ту же семантику
для скринридера.
---
 docs/decisions/064-composer-not-form.md | 28 +++++++++++++++++++++++++
 docs/open-questions.md                  |  1 -
 web/js/ui/chat.js                       | 19 ++++++++++-------
 3 files changed, 40 insertions(+), 8 deletions(-)
 create mode 100644 docs/decisions/064-composer-not-form.md

diff --git a/docs/decisions/064-composer-not-form.md b/docs/decisions/064-composer-not-form.md
new file mode 100644
index 0000000..172c7b2
--- /dev/null
+++ b/docs/decisions/064-composer-not-form.md
@@ -0,0 +1,28 @@
+# ADR-064: строка ввода — div, а не form
+
+Уточняет `docs/ui.md`, «Доступность»: `form` в списке семантики держит `role="form"`, а не элемент `<form>`, — для строки ввода чата.
+
+## Контекст
+
+Тест с реальными пользователями (iPhone, Safari и Chrome): над клавиатурой при фокусе в строке ввода всплывает системная панель навигации между полями — «‹ ›» и «готово», около 50 px. Полю переходить некуда — оно на экране одно, — а место съедено.
+
+Панель — не наша вёрстка, это поведение WebKit для полей, лежащих внутри `<form>`. Строка ввода была оформлена именно так: `<form class="compose">` с `<textarea>` и кнопкой `type="submit"`.
+
+Дорогой вариант — `contenteditable` вместо `textarea` — снял бы панель гарантированно, но потребовал бы вручную переписать то, что сейчас даёт браузер бесплатно: placeholder, обрезку на 4000 символов, автовысоту, и обязательно — очистку `paste` до текста, потому что `contenteditable` иначе вставляет форматированный HTML, а `innerHTML` в клиенте запрещён (CLAUDE.md).
+
+Дешёвый вариант — вынести поле из `<form>` — не трогает ничего из этого: `textarea` остаётся `textarea`.
+
+## Решение
+
+- `<form class="compose">` → `<div class="compose" role="form">`. `role="form"` — тот же ориентир для скринридера, что и элемент `<form>`, без вызывающих панель heuristics WebKit.
+- Кнопка отправки — `type="button"` с явным `click`, вместо `type="submit"` и события `submit` на форме.
+- `autocomplete="off"` на самом поле — на случай, если панель зависит ещё и от него, а не только от `<form>`.
+- `textarea`, `maxLength`, `field-sizing: content`, placeholder — без изменений.
+
+Остальные формы (вход, `#/new`, участники, настройки) не тронуты: там несколько полей в форме, панель навигации между ними — по крайней мере, не чистый минус, и незачем менять то, что не жаловались.
+
+## Следствия
+
+- Проверить можно только на реальном устройстве — эмуляции панели WebKit нет; headless-Chromium её и не показывал никогда, так что автотест здесь не поставить.
+- Если панель не уйдёт (вдруг триггер — не `<form>`, а что-то ещё в эвристике Safari), следующий шаг — `contenteditable`, со всей его ценой из «Контекста».
+- `Enter` на десктопе и кнопка «>» на мобильном по-прежнему отправляют — обработчики `keydown` и `click` делают то же, что раньше `submit`.
diff --git a/docs/open-questions.md b/docs/open-questions.md
index b2dcbfe..e74f6e3 100644
--- a/docs/open-questions.md
+++ b/docs/open-questions.md
@@ -5,7 +5,6 @@
 - Серверный «перец» для ключевого блоба: дополнительное шифрование блоба серверным ключом, хранящимся вне базы. Плюс: дамп базы сам по себе перестаёт быть материалом для оффлайн-перебора. Минус: не защищает от оператора; потеря серверного ключа — невозможность входа с новых устройств для всех. Решение отложено.
 - Блокировка собеседника и персональные инвайты — если общего инвайт-кода и лимитов (ADR-019, ADR-021) окажется мало.
 - Подписи сообщений вторым ключом — если потребуется защита от сговора участника комнаты с сервером (ADR-016).
-- Поле ввода — `textarea` в мобильном Safari поднимает системную панель навигации по полям («‹ ›» и «готово») над клавиатурой: живой экран съедает лишние ~50 px, обжито пользователями плохо. Направление — заменить на `contenteditable`-блок (`role="textbox"`, `aria-multiline="true"`): у него этой панели нет, а клавиатура остаётся текстовой. Ручная работа взамен браузерной: placeholder, счётчик и обрезка на 4000 символов, автовысота, `paste` только как текст — без этого блока `innerHTML` в него попадёт вставкой, а `innerHTML` в клиенте запрещён (CLAUDE.md). Enter/Shift+Enter и `isComposing` — переносятся как есть. Решение отложено: выбрать между этим и более дешёвым вариантом (поле вне `<form>`, `autocomplete="off"`) — если он снимает панель хотя бы в Safari, возни меньше.
 - Выравнивание сообщений по стороне: свои — вправо, чужие — влево, как в обычных мессенджерах. Сейчас лента — общий список с колонкой автора (`docs/ui.md`, «Чат»; `docs/identity/brief.md`, «Компоновка»: сетка `132px 1fr` на десктопе, автор над группой на мобильном) — сторона у сообщения не задана нигде. Пользователям в тесте медленно читать, кто есть кто. Смена — это пересмотр принятого в ADR-024 макета ленты, нужен новый ADR, если решение — делать. Ограничение айдентики: без пузырей, скруглений и теней (`identity/brief.md`) — выравнивание, не bubble-чат.
 
 Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей.
diff --git a/web/js/ui/chat.js b/web/js/ui/chat.js
index 48aae63..2a2ed56 100644
--- a/web/js/ui/chat.js
+++ b/web/js/ui/chat.js
@@ -197,9 +197,16 @@ async function refreshRoom(view, known) {
 // composer — полоса состояния и строка ввода: рамка 1 px ink, слева «>»
 // цветом mark. Enter отправляет только на десктопе; на мобильном он делает
 // перенос, а отправляет кнопка «>» справа (docs/ui.md, «Чат»).
+//
+// div, не form: поле формы на iOS Safari/Chrome поднимает над клавиатурой
+// системную панель навигации между полями («‹ ›» и «готово») — лишние
+// ~50 px ради одного поля, которому переходить некуда. role="form" держит
+// ту же семантику для скринридера (docs/ui.md, «Доступность»), без form-а;
+// autocomplete="off" на поле — по той же причине, на случай если панель
+// зависит ещё и от него.
 function composer(view) {
-  const form = el("form", "compose");
-  form.noValidate = true;
+  const form = el("div", "compose");
+  form.setAttribute("role", "form");
 
   view.bar = el("p", "bar");
   view.bar.hidden = true;
@@ -213,12 +220,14 @@ function composer(view) {
   view.field.rows = 1;
   view.field.placeholder = "сообщение";
   view.field.maxLength = view.limit;
+  view.field.autocomplete = "off";
 
   view.counter = el("span", "counter");
   view.counter.hidden = true;
 
   view.send = el("button", "input__send", ">");
-  view.send.type = "submit";
+  view.send.type = "button";
+  view.send.addEventListener("click", () => submit(view));
 
   row.append(prompt, view.field, view.counter, el("span", "enter", "enter — отправить"), view.send);
   form.append(view.bar, row);
@@ -234,10 +243,6 @@ function composer(view) {
     event.preventDefault();
     submit(view);
   });
-  form.addEventListener("submit", (event) => {
-    event.preventDefault();
-    submit(view);
-  });
 
   return form;
 }

From 9935acb86dec9c18a430a165c79890d579e0eaca Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 24 Aug 2026 06:37:57 +0000
Subject: [PATCH 3/4] =?UTF-8?q?ADR-065:=20=D1=81=D0=BE=D0=BE=D0=B1=D1=89?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BF=D0=BE=20=D1=81=D1=82=D0=BE?=
 =?UTF-8?q?=D1=80=D0=BE=D0=BD=D0=B0=D0=BC=20=E2=80=94=20=D1=81=D0=B2=D0=BE?=
 =?UTF-8?q?=D0=B8=20=D0=B2=D0=BF=D1=80=D0=B0=D0=B2=D0=BE,=20=D1=87=D1=83?=
 =?UTF-8?q?=D0=B6=D0=B8=D0=B5=20=D0=B2=D0=BB=D0=B5=D0=B2=D0=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Заменяет десктопную сетку «автор 132 px + текст» (часть ADR-024) единым
для десктопа и мобильного потоком: блок сообщения прижат к своему краю
ленты, ширина ограничена, текст внутри блока по-прежнему слева. Разделители
дат и «новые» — во всю ширину. CSS-класс grid переименован в feed-list —
сетки в разметке больше нет.

Проверено вживую (два аккаунта, DM, скриншоты 390 и 1280 px через
Playwright/Chromium) — своя и чужая сторона видны на обоих брейкпоинтах,
перенос длинного текста и разделители работают.

Обновлены ui.md, identity/brief.md и эталонный мок screens.html.
sw.js VERSION → v5 (менялись app.css и js/ui/chat.js, накопительно
с композером из ADR-064 — ни то ни другое ещё не в проде).
---
 docs/decisions/065-message-side-alignment.md | 28 +++++++++
 docs/identity/brief.md                       |  3 +-
 docs/identity/screens.html                   | 41 +++++--------
 docs/ui.md                                   |  2 +-
 web/app.css                                  | 64 +++++++-------------
 web/js/ui/chat.js                            | 17 +++++-
 web/sw.js                                    |  2 +-
 7 files changed, 84 insertions(+), 73 deletions(-)
 create mode 100644 docs/decisions/065-message-side-alignment.md

diff --git a/docs/decisions/065-message-side-alignment.md b/docs/decisions/065-message-side-alignment.md
new file mode 100644
index 0000000..211da2f
--- /dev/null
+++ b/docs/decisions/065-message-side-alignment.md
@@ -0,0 +1,28 @@
+# ADR-065: сообщения выравниваются по стороне — свои вправо, чужие влево
+
+Пересматривает часть [ADR-024](024-identity-and-ui.md): десктопную сетку ленты «автор 132 px + текст» из `docs/identity/brief.md`, «Компоновка». Уточняет `docs/ui.md`, «Чат».
+
+## Контекст
+
+Тест с реальными пользователями: единый список с колонкой автора — десктоп сеткой `132px 1fr`, мобильный автором над группой — читается медленно. Чтобы понять, кто автор строки, нужно каждый раз смотреть в колонку слева; с чужого сообщения на своё и обратно глаз идёт через всю ширину.
+
+Разделение по стороне, как в обычных мессенджерах, снимает это одним взглядом: своё — у своего края, чужое — у чужого. Айдентика «Скобы» этому не мешает и не помогает — про стороны сообщений там ничего нет, — но прямо запрещает пузыри, скругления и тени (`identity/brief.md`, «Цвет»). Значит выравнивание, а не bubble-чат: то же плоское сообщение, что и сейчас, просто у другого края.
+
+Десктопная сетка `132px 1fr` для этого не годится: колонка автора у неё одна на весь список, слева, общая для всех строк. Разделить строки по сторонам в фиксированной сетке нечем — под это нужен один и тот же поток и на десктопе, и на мобильном, каким мобильный уже пользуется («автор над группой»). Решение — не расширять сетку, а убрать её: десктоп переходит на тот же поток, что мобильный.
+
+## Решение
+
+- Лента — везде (десктоп и мобильный) один поток блоков сверху вниз: автор и время строкой, текст под ними, без сетки.
+- Блок своего сообщения выравнивается по правому краю ленты, чужого — по левому. Свой ник в колонке автора остаётся цветом `mark` (ADR-024) — сторона и цвет вместе, не одно вместо другого.
+- Ширина блока ограничена (`min(640px, 85%)`), иначе выравнивать нечего: абзац во всю ширину ленты выглядит одинаково с любого края. Текст внутри блока остаётся выровнен по левому краю независимо от стороны — многострочное сообщение с рваным правым краем читается быстрее, чем с рваным левым.
+- Разделители дат и «новые» — во всю ширину ленты, не по ширине сообщения: они не принадлежат стороне.
+- Никаких фонов, рамок, скруглений и теней вокруг сообщения — это не бабл, а положение блока.
+- CSS-класс `feed-list` вместо `grid`: сетки в разметке больше нет, имя не должно об этом врать.
+
+## Следствия
+
+- `docs/identity/brief.md`, «Компоновка»: строка про сетку `132px 1fr` заменена на «поток, свои сообщения — у правого края, чужие — у левого, ширина блока ограничена».
+- `docs/ui.md`, «Чат»: абзац про ленту переписан под общий для обеих ширин экрана поток.
+- `docs/identity/screens.html` (эталон 2a/2b) обновлён: десктопный мок 2a больше не показывает сетку, оба мока показывают сообщения по сторонам.
+- Десктопная и мобильная лента визуально сближаются: раньше это были заметно разные раскладки, теперь — одна, с разной шириной блока и отступов. Разница экранов остаётся в сайдбаре, шапке и размере поля ввода (ADR-021, `identity/brief.md`).
+- Комната с тремя и более участниками: у чужих сообщений сторона всех, кроме себя, одна и та же (левая) — различает их по-прежнему только ник и цвет, сторона тут ничего не добавляет и не мешает.
diff --git a/docs/identity/brief.md b/docs/identity/brief.md
index c42d934..7f1fc74 100644
--- a/docs/identity/brief.md
+++ b/docs/identity/brief.md
@@ -39,8 +39,9 @@ font-family: ui-monospace, "SF Mono", Menlo, Consolas, "DejaVu Sans Mono", monos
 
 ## Компоновка
 
-- Десктоп: сайдбар 224 px с правой границей `line`, шапка 64 px, отступы контента 32 px; сообщения — сетка `132px 1fr`, column-gap 20, row-gap 6.
+- Десктоп: сайдбар 224 px с правой границей `line`, шапка 64 px, отступы контента 32 px.
 - Мобильный: шапка 56 px, отступы 20 px, ввод с min-height 44 px.
+- Сообщения — поток на обеих ширинах, автор и время над текстом; свои — у правого края ленты, чужие — у левого, ширина блока не больше `min(640px, 85%)` (ADR-065).
 - Ввод — рамка 1 px ink, без скруглений, `>` цветом mark слева.
 - Активный элемент списка — инверсия: фон ink, текст bone.
 - Разделители — 1 px `line`; разделитель «новые» — 1 px mark.
diff --git a/docs/identity/screens.html b/docs/identity/screens.html
index a903ed0..54ccbda 100644
--- a/docs/identity/screens.html
+++ b/docs/identity/screens.html
@@ -23,13 +23,17 @@
   .item { font-size:13px; padding:6px 8px; color:var(--text2); display:flex; }
   .item.active { background:var(--ink); color:var(--bone); }
   .item .n { margin-left:auto; color:var(--mark); }
-  .divider { display:flex; align-items:center; gap:14px; font-size:11px; color:var(--stone); }
+  .divider { display:flex; align-items:center; align-self:stretch; gap:14px; font-size:11px; color:var(--stone); }
   .divider::before, .divider::after { content:""; flex:1; height:1px; background:var(--line); }
   .divider.new { color:var(--mark); }
   .divider.new::before, .divider.new::after { background:var(--mark); }
-  .author { color:var(--mute); font-size:12px; padding-top:2px; }
+  .author { color:var(--mute); font-size:12px; }
   .author.me { color:var(--mark); }
   .author .t { color:var(--stone); }
+  /* поток сообщений: свои — у правого края, чужие — у левого (ADR-065) */
+  .msg { display:flex; flex-direction:column; gap:4px; max-width:min(640px, 85%); }
+  .msg.me { align-self:flex-end; align-items:flex-end; }
+  .msg p { margin:0; }
   .input { display:flex; align-items:center; gap:12px; border:1px solid var(--ink); padding:14px 16px; font-size:14px; }
   .input .p { color:var(--mark); }
   .input .caret { width:8px; height:17px; background:var(--ink); }
@@ -46,21 +50,17 @@
   .me i { width:6px; height:6px; background:var(--ink); }
   .main { display:flex; flex-direction:column; min-width:0; }
   .head { height:64px; display:flex; align-items:center; gap:14px; padding:0 32px; border-bottom:1px solid var(--line); font-size:15px; }
-  .feed { flex:1; padding:28px 32px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; }
+  .feed { flex:1; padding:28px 32px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; gap:14px; overflow:hidden; font-size:14px; line-height:1.55; }
   .feed .divider { padding:10px 0 22px; }
-  .grid { display:grid; grid-template-columns:132px 1fr; column-gap:20px; row-gap:6px; font-size:14px; line-height:1.55; }
-  .grid .divider { grid-column:1 / -1; padding:16px 0; }
   .compose { padding:0 32px 28px; }
 
   /* 2b — мобильный */
   .mobile { width:390px; height:700px; display:flex; flex-direction:column; }
   .mobile .head { height:56px; padding:0 20px; gap:12px; font-size:14px; }
   .mobile .mark { width:16px; height:16px; stroke-width:8; }
-  .mobile .feed { padding:20px; gap:14px; }
+  .mobile .feed { padding:20px; font-size:14px; line-height:1.5; }
   .mobile .feed .divider { padding:0; font-size:10px; }
-  .msg { display:flex; flex-direction:column; gap:4px; }
   .msg .author { font-size:11px; }
-  .msg p { margin:0; font-size:14px; line-height:1.5; }
   .mobile .compose { padding:0 16px 20px; }
   .mobile .input { padding:13px 14px; min-height:44px; gap:10px; }
   .mobile .input .caret { width:7px; height:16px; }
@@ -92,23 +92,12 @@
         <div class="head">#general</div>
         <div class="feed">
           <div class="divider">вторник, 18 августа</div>
-          <div class="grid">
-            <div class="author">marta <span class="t">11:52</span></div>
-            <div>выкатила статику на bare.xmatic.team, кэш чистится сам</div>
-            <div></div>
-            <div>вес страницы — 14 кб. без шрифтов было бы 9, но mono того стоит</div>
-            <div class="author">lev <span class="t">11:58</span></div>
-            <div>смотрю network: один html, один css, ноль js до первого сообщения. красиво</div>
-            <div class="author me">kir <span class="t">12:03</span></div>
-            <div>это и есть план. если фича требует бандлер — фича не нужна</div>
-            <div></div>
-            <div>доки пишу прямо в readme, отдельного сайта не будет</div>
-            <div class="divider new">новые</div>
-            <div class="author">marta <span class="t">12:41</span></div>
-            <div>кто-то с hn спрашивает, где мобильное приложение</div>
-            <div class="author">lev <span class="t">12:42</span></div>
-            <div>ответил: браузер и есть приложение</div>
-          </div>
+          <div class="msg"><div class="author">marta <span class="t">11:52</span></div><p>выкатила статику на bare.xmatic.team, кэш чистится сам</p><p>вес страницы — 14 кб. без шрифтов было бы 9, но mono того стоит</p></div>
+          <div class="msg"><div class="author">lev <span class="t">11:58</span></div><p>смотрю network: один html, один css, ноль js до первого сообщения. красиво</p></div>
+          <div class="msg me"><div class="author me">kir <span class="t">12:03</span></div><p>это и есть план. если фича требует бандлер — фича не нужна</p><p>доки пишу прямо в readme, отдельного сайта не будет</p></div>
+          <div class="divider new">новые</div>
+          <div class="msg"><div class="author">marta <span class="t">12:41</span></div><p>кто-то с hn спрашивает, где мобильное приложение</p></div>
+          <div class="msg"><div class="author">lev <span class="t">12:42</span></div><p>ответил: браузер и есть приложение</p></div>
         </div>
         <div class="compose">
           <div class="input"><span class="p">&gt;</span><span>сообщение в #general</span><span class="caret"></span><span class="hint">enter — отправить</span></div>
@@ -125,7 +114,7 @@
         <div class="divider">18 авг</div>
         <div class="msg"><div class="author">marta <span class="t">11:52</span></div><p>выкатила статику на bare.xmatic.team, кэш чистится сам</p><p>вес страницы — 14 кб</p></div>
         <div class="msg"><div class="author">lev <span class="t">11:58</span></div><p>один html, один css, ноль js до первого сообщения. красиво</p></div>
-        <div class="msg"><div class="author me">kir <span class="t">12:03</span></div><p>это и есть план. если фича требует бандлер — фича не нужна</p></div>
+        <div class="msg me"><div class="author me">kir <span class="t">12:03</span></div><p>это и есть план. если фича требует бандлер — фича не нужна</p></div>
         <div class="divider new">новые</div>
         <div class="msg"><div class="author">marta <span class="t">12:41</span></div><p>кто-то с hn спрашивает, где мобильное приложение</p></div>
         <div class="msg"><div class="author">lev <span class="t">12:42</span></div><p>ответил: браузер и есть приложение</p></div>
diff --git a/docs/ui.md b/docs/ui.md
index e8f7e15..f0019d2 100644
--- a/docs/ui.md
+++ b/docs/ui.md
@@ -32,7 +32,7 @@
 
 Шапка: имя (`#general` / `@marta`), по нажатию — участники или карточка контакта. Без темы и «N онлайн».
 
-Лента: десктоп — сетка «автор 132 px + текст», подряд идущие сообщения одного автора — без повтора автора; мобильный — автор над группой. Свой ник в колонке автора — цветом `mark`. Разделители дат — линия с датой; «новые» — линия цветом `mark` перед первым непрочитанным, исчезает при следующем открытии чата. Pending — текст цветом `stone`; failed — с пометкой «не отправлено · повторить». Нерасшифрованное — курсивом: «не удалось расшифровать: ключ изменился» / «…: нет ключа комнаты». Время — `ts` в локальной зоне, `ЧЧ:ММ`.
+Лента: поток блоков сверху вниз, одинаковый на десктопе и мобильном; подряд идущие сообщения одного автора — без повтора автора над группой. Свои сообщения выровнены по правому краю ленты, чужие — по левому (ADR-065); свой ник в колонке автора при этом остаётся цветом `mark`. Ширина блока сообщения ограничена — иначе выравнивать нечего, — текст внутри блока выровнен по левому краю независимо от стороны. Разделители дат и «новые» — во всю ширину ленты: линия с датой; «новые» — линия цветом `mark` перед первым непрочитанным, исчезает при следующем открытии чата. Pending — текст цветом `stone`; failed — с пометкой «не отправлено · повторить». Нерасшифрованное — курсивом: «не удалось расшифровать: ключ изменился» / «…: нет ключа комнаты». Время — `ts` в локальной зоне, `ЧЧ:ММ`.
 
 Лента открывается последними 50 сообщениями и стоит в конце. Прокрутка к верхнему краю подгружает следующие 50; то, что человек читает, при этом не двигается. Загруженное остаётся в разметке целиком — виртуализации нет (ADR-053).
 
diff --git a/web/app.css b/web/app.css
index 48ca5d0..d37e0d9 100644
--- a/web/app.css
+++ b/web/app.css
@@ -650,19 +650,27 @@ input[type="password"] {
   overflow-y: auto;
 }
 
-.grid {
+.feed-list {
   margin-top: auto;
   display: flex;
   flex-direction: column;
+  align-items: flex-start;
   font-size: 14px;
-  line-height: 1.5;
+  line-height: 1.55;
 }
 
-/* мобильный: автор над группой сообщений */
+.feed-list > :first-child {
+  margin-top: 0;
+}
+
+/* строка сообщения: автор над текстом, блок целиком к своему краю —
+   свои вправо, чужие влево (ADR-065). Ширина блока ограничена, иначе
+   выравнивать нечего — текст в один абзац занял бы всю ленту. */
 
 .line {
   display: flex;
   flex-direction: column;
+  max-width: min(640px, 85%);
   gap: 4px;
   margin-top: 4px;
 }
@@ -671,8 +679,9 @@ input[type="password"] {
   margin-top: 14px;
 }
 
-.grid > :first-child {
-  margin-top: 0;
+.line--me {
+  align-self: flex-end;
+  align-items: flex-end;
 }
 
 .author {
@@ -684,6 +693,10 @@ input[type="password"] {
   overflow-wrap: anywhere;
 }
 
+.author:empty {
+  display: none;
+}
+
 .author--me {
   color: var(--mark);
 }
@@ -734,11 +747,14 @@ input[type="password"] {
   cursor: pointer;
 }
 
-/* разделители: дата — линией line, «новые» — линией mark */
+/* разделители: дата — линией line, «новые» — линией mark; во всю ширину
+   ленты, а не по ширине сообщения (feed-list выравнивает по краю только
+   .line, ADR-065) */
 
 .divider {
   display: flex;
   align-items: center;
+  align-self: stretch;
   gap: 14px;
   margin: 14px 0;
   color: var(--stone);
@@ -908,39 +924,10 @@ input[type="password"] {
     display: none;
   }
 
-  /* сетка «автор 132 px + текст»: строка сообщения раскрывается
-     в две ячейки сетки, поэтому display: contents */
-
   .feed {
     padding: 28px 32px;
   }
 
-  .grid {
-    display: grid;
-    grid-template-columns: 132px 1fr;
-    column-gap: 20px;
-    row-gap: 6px;
-    line-height: 1.55;
-  }
-
-  .line,
-  .line.is-head {
-    display: contents;
-    margin-top: 0;
-  }
-
-  .author {
-    padding-top: 2px;
-    font-size: 12px;
-  }
-
-  .divider {
-    grid-column: 1 / -1;
-    margin: 0;
-    padding: 16px 0;
-    font-size: 11px;
-  }
-
   .compose {
     padding: 0 32px 28px;
   }
@@ -992,11 +979,4 @@ input[type="password"] {
   .enter {
     display: none;
   }
-
-  /* автор стоит над группой, поэтому пустая ячейка автора не занимает
-     места; на десктопе она держит колонку сетки и остаётся */
-
-  .author:empty {
-    display: none;
-  }
 }
diff --git a/web/js/ui/chat.js b/web/js/ui/chat.js
index 2a2ed56..25c96c1 100644
--- a/web/js/ui/chat.js
+++ b/web/js/ui/chat.js
@@ -79,7 +79,7 @@ export function renderChat(root, ctx, chatId) {
   root.append(head(view));
 
   view.feed = el("div", "feed");
-  view.body = el("div", "grid");
+  view.body = el("div", "feed-list");
   view.body.setAttribute("aria-live", "polite");
   view.feed.append(view.body);
   // Прокрутка к верхнему краю берёт следующую страницу (ADR-053).
@@ -524,12 +524,25 @@ function line(view, record, previous, parent = view.body) {
   }
   // Подряд идущие сообщения одного автора — без повтора автора.
   const first = marks.length > 0 || !previous || previous.from !== record.from;
-  const node = el("div", first ? "line is-head" : "line");
+  const node = el("div", lineClass(record, view.me, first));
   node.append(author(view, record, first), text(view, record));
   parent.append(...marks, node);
   view.nodes.set(record.id, { node, marks });
 }
 
+// lineClass — своя сторона ленты: свои сообщения вправо, чужие влево
+// (ADR-065), классом на самой строке — выравнивает feed-list.
+function lineClass(record, me, first) {
+  const classes = ["line"];
+  if (record.from === me) {
+    classes.push("line--me");
+  }
+  if (first) {
+    classes.push("is-head");
+  }
+  return classes.join(" ");
+}
+
 // redraw обновляет одну строку на месте: автор и группировка от состояния
 // сообщения не зависят.
 function redraw(view, record) {
diff --git a/web/sw.js b/web/sw.js
index 6b98fa8..1f8f0c0 100644
--- a/web/sw.js
+++ b/web/sw.js
@@ -7,7 +7,7 @@
 // Имя кэша содержит версию; версия — константа, она меняется при релизе,
 // и старые кэши уходят в activate.
 
-const VERSION = "v4";
+const VERSION = "v5";
 const CACHE = `bare-${VERSION}`;
 
 // Оболочка — всё, из чего клиент поднимается без сети. Список явный:

From 7bb0418a68a0682c37f2b283175c7e0002856050 Mon Sep 17 00:00:00 2001
From: Yuriy Mayatnikov <mayatnikov@me.com>
Date: Mon, 24 Aug 2026 11:13:51 +0300
Subject: [PATCH 4/4] =?UTF-8?q?ADR-066:=20=D1=81=D0=B5=D1=80=D0=B2=D0=B5?=
 =?UTF-8?q?=D1=80=D0=BD=D0=BE=D0=B3=D0=BE=20=C2=AB=D0=BF=D0=B5=D1=80=D1=86?=
 =?UTF-8?q?=D0=B0=C2=BB=20=D0=B4=D0=BB=D1=8F=20=D0=BA=D0=BB=D1=8E=D1=87?=
 =?UTF-8?q?=D0=B5=D0=B2=D0=BE=D0=B3=D0=BE=20=D0=B1=D0=BB=D0=BE=D0=B1=D0=B0?=
 =?UTF-8?q?=20=D0=BD=D0=B5=D1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Решение перенесено из закрытого PR #1 (ветка отведена до мержа v1,
номера ADR там разошлись с main). Ссылки выправлены на актуальные
ADR-003/006/013 и на формулировку threat-model «Слабый пароль».

Заодно из open-questions.md убран пункт про сторону сообщений:
его закрыл ADR-065, но вычеркнуть забыли.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QR8uS3zGkybzWRW4GEY1oz
---
 docs/decisions/066-no-server-pepper.md | 25 +++++++++++++++++++++++++
 docs/open-questions.md                 |  4 +---
 2 files changed, 26 insertions(+), 3 deletions(-)
 create mode 100644 docs/decisions/066-no-server-pepper.md

diff --git a/docs/decisions/066-no-server-pepper.md b/docs/decisions/066-no-server-pepper.md
new file mode 100644
index 0000000..6ecb21d
--- /dev/null
+++ b/docs/decisions/066-no-server-pepper.md
@@ -0,0 +1,25 @@
+# ADR-066: серверного «перца» для ключевого блоба нет
+
+Закрывает последний открытый вопрос из `docs/open-questions.md`, поставленный при [ADR-006](006-e2ee-webcrypto.md).
+
+## Контекст
+
+Идея: шифровать ключевой блоб ещё раз серверным ключом, который лежит вне базы — например в `/etc/bare/env` рядом с VAPID. Тогда украденный дамп или бэкап сам по себе не даёт материала для оффлайн-перебора паролей. Против оператора это не помогает: у него есть и база, и файл с ключом.
+
+Вопрос висел открытым с самого начала и мешает считать модель угроз закрытой: пока решения нет, непонятно, чего стоит ждать от следующей версии хранения.
+
+## Решение
+
+Перца нет. Блоб хранится так, как описано в [ADR-006](006-e2ee-webcrypto.md) и [ADR-013](013-password-policy-kdf.md): один слой шифрования, ключ выведен из пароля.
+
+Аргументы:
+
+- Рядом с базой появляется второй критичный артефакт. [ADR-003](003-sqlite.md) обещает «бэкап — копия одного файла»; перец это обещание ломает. Потеря файла с перцем — невозможность входа с новых устройств сразу для всех, а восстановления паролей в Bare нет by design. Для маленького самохостного инструмента риск потерять ключ при переезде выше риска, который перец закрывает.
+- Сценарий «утёк бэкап, но не сервер» уже закрыт [ADR-013](013-password-policy-kdf.md): PBKDF2-HMAC-SHA256 от 600 000 итераций и пароль от 12 символов делают перебор дорогим. Словарный пароль перец тоже не спасёт — при компрометации сервера он утекает вместе с базой.
+- Каждый дополнительный слой — код, который нужно аудировать, и оперативная процедура, которую нужно помнить. Простота важнее.
+
+## Следствия
+
+- Стойкость блоба в любом сценарии равна стойкости пароля, как и записано в `docs/threat-model.md`, «Слабый пароль». Новых оговорок в модели угроз не появляется.
+- Развёртывание остаётся «бинарь плюс файл базы»: ничего, что нельзя потерять, кроме самой базы, у оператора нет. `/etc/bare/env` восстанавливается по `docs/deploy.md`, VAPID-пара перевыпускается.
+- Решение обратимо: перец можно добавить позже отдельным ADR — он не меняет формат блоба, только оборачивает его.
diff --git a/docs/open-questions.md b/docs/open-questions.md
index e74f6e3..9c28610 100644
--- a/docs/open-questions.md
+++ b/docs/open-questions.md
@@ -2,9 +2,7 @@
 
 Решения по этим пунктам ещё не приняты. Каждое принятое решение уходит в ADR и вычёркивается отсюда.
 
-- Серверный «перец» для ключевого блоба: дополнительное шифрование блоба серверным ключом, хранящимся вне базы. Плюс: дамп базы сам по себе перестаёт быть материалом для оффлайн-перебора. Минус: не защищает от оператора; потеря серверного ключа — невозможность входа с новых устройств для всех. Решение отложено.
 - Блокировка собеседника и персональные инвайты — если общего инвайт-кода и лимитов (ADR-019, ADR-021) окажется мало.
 - Подписи сообщений вторым ключом — если потребуется защита от сговора участника комнаты с сервером (ADR-016).
-- Выравнивание сообщений по стороне: свои — вправо, чужие — влево, как в обычных мессенджерах. Сейчас лента — общий список с колонкой автора (`docs/ui.md`, «Чат»; `docs/identity/brief.md`, «Компоновка»: сетка `132px 1fr` на десктопе, автор над группой на мобильном) — сторона у сообщения не задана нигде. Пользователям в тесте медленно читать, кто есть кто. Смена — это пересмотр принятого в ADR-024 макета ленты, нужен новый ADR, если решение — делать. Ограничение айдентики: без пузырей, скруглений и теней (`identity/brief.md`) — выравнивание, не bubble-чат.
 
-Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей.
+Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей. ADR-064 — панель над клавиатурой в строке ввода, ADR-065 — сторона сообщений в ленте, ADR-066 — серверный «перец».