add brandbook

brandbook/README.md

@@ -1,12 +1,12 @@
 # Вечерний детектив — брендбук
 
-Единый рабочий брендбук из трёх блоков: «Логотип», «Шрифты», «Цвета». Блок логотипа занимает две страницы, шрифты и цвета — по одной. Страницы белые; в основном документе оставлены только примеры и краткие правила. Технические сведения и источники сохранены в этом описании. В страницах оставлены логотипы, шрифты и палитра. Образцы диплома, бланков и фактур временно убраны из документа; исходные материалы сохранены в комплекте. Используется обновлённый логотип — детектив в шляпе с золотой круглой рамкой и прозрачным внешним фоном. Основная палитра: чёрный #111111, белый #FFFFFF и золотой #FCBF02. Бронза исключена, серый используется только как служебный цвет интерфейса; типографика закреплена за тремя гарнитурами с кириллицей и SIL OFL 1.1: Oswald 600 для логотипа и заголовков, Podkova 600 для других фирменных надписей, Noto Sans 400/700 для основного текста и выделений. Пробковая доска развивает оформление афиш и обложек. Сайт и приложения не изменены.
+Единый рабочий брендбук из четырёх блоков: «Логотип», «Шрифты», «Цвета», «Тон общения». Документ открывает отдельная обложка. Блок логотипа занимает две страницы, шрифты, цвета и тон общения — по одной. Страницы белые; в основном документе оставлены только примеры и краткие правила. Технические сведения и источники сохранены в этом описании. На страницах представлены логотипы, шрифты, палитра и краткие правила общения с примерами. Образцы диплома, бланков и фактур временно убраны из документа; исходные материалы сохранены в комплекте. Используется обновлённый логотип — детектив в шляпе с золотой круглой рамкой и прозрачным внешним фоном. Основная палитра: чёрный #111111, белый #FFFFFF и золотой #FCBF02. Бронза исключена, серый используется только как служебный цвет интерфейса; типографика закреплена за тремя гарнитурами с кириллицей и SIL OFL 1.1: Oswald 600 для логотипа и заголовков, Podkova 600 для других фирменных надписей, Noto Sans 400/700 для основного текста и выделений. Пробковая доска развивает оформление афиш и обложек. Сайт и приложения не изменены.
 
 Все изменения вносятся в этот комплект. PDF и `brandbook.zip` перезаписываются; старые версии и отдельные концепции не сохраняются.
 
 ## Комплект
 
-- `brandbook.pdf` — 4 страницы A4 для просмотра и передачи.
+- `brandbook.pdf` — 6 страниц A4 для просмотра и передачи.
 - `index.html`, `brandbook.css` — редактируемый исходник без сборки и сетевых ресурсов.
 - `assets/logos/logo.png` — обновлённая на основе исходной эмблемы растровая версия, 1254 × 1254 px, RGBA. Внешний фон прозрачный, белые области внутри знака сохранены. Изображение обновлено с помощью imagegen.
 - `assets/fonts/Podkova.ttf` — фирменный вариативный шрифт, насыщенности 400–800; `Podkova-OFL.txt` — его лицензия SIL OFL 1.1. Исходный файл Google Fonts скопирован без изменения байтов, с простым локальным именем.
@@ -36,11 +36,11 @@ pdfinfo brandbook.pdf
 pdftotext -layout brandbook.pdf -
 ```
 
-При отсутствии соседнего проекта используйте ручную печать в браузере. Просмотр не требует Electron. Экспортёр проверяет загрузку шрифтов и изображений, отсутствие сетевых запросов, 4 HTML-страницы и отсутствие выхода содержимого за поля и границы примеров. После изменений нужен визуальный просмотр PDF.
+При отсутствии соседнего проекта используйте ручную печать в браузере. Просмотр не требует Electron. Экспортёр проверяет загрузку шрифтов и изображений, отсутствие сетевых запросов, 6 HTML-страниц и отсутствие выхода содержимого за поля и границы примеров. После изменений нужен визуальный просмотр PDF.
 
 ## Проверки и ограничения
 
-Проверены три блока и 4 страницы A4, локальные ресурсы и прозрачность PNG эмблемы. Новая основная палитра закреплена в брендбуке; её перенос в `src/assets/base.css` пока не выполнен; текст правил очной игры — с актуальным `GAME_RULES_OFFLINE.md`. Шрифты встроены в PDF.
+Проверены четыре блока и 6 страниц A4, локальные ресурсы и прозрачность PNG эмблемы. Новая основная палитра закреплена в брендбуке; её перенос в `src/assets/base.css` пока не выполнен; текст правил очной игры — с актуальным `GAME_RULES_OFFLINE.md`. Шрифты встроены в PDF.
 
 Oswald, Podkova и Noto Sans разрешено использовать, встраивать и распространять по SIL OFL 1.1. При распространении шрифтов сохраняйте соответствующие лицензии и сведения авторства. При передаче файла шрифта сохраняйте `Podkova-OFL.txt` с copyright. Источник: https://github.com/google/fonts/tree/main/ofl/podkova ; файл: https://raw.githubusercontent.com/google/fonts/main/ofl/podkova/Podkova%5Bwght%5D.ttf . Файл `assets/fonts/LICENSE.txt` относится к Noto. Отдельные файлы a_OldTyper и его NOTICE удалены из комплекта.
 

brandbook/brandbook.css

@@ -50,3 +50,9 @@ th{font-size:10px;letter-spacing:1px;text-transform:uppercase}
 @page{size:A4;margin:0}
 @media print{body{background:transparent}.page{margin:0}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
 @media screen and (max-width:820px){body{overflow-x:auto}.page{margin:0 0 16px}}
+
+.cover{text-align:center}
+.cover-logo{display:block;width:480px;height:570px;object-fit:contain;margin:48px auto 24px}
+.cover h1{font-size:64px;margin-bottom:14px}
+.cover-caption{font-size:13px;letter-spacing:2px}
+.cover .folio{text-align:left}

brandbook/export.cjs

@@ -32,8 +32,8 @@ app.whenReady().then(async () => {
     return { blocks: pages.map(page => page.id), pages: pages.length, overflow, familiesLoaded: ['Podkova', 'Oswald', 'Noto'].every(family => [...document.fonts].some(face => face.family === family && face.status === 'loaded')), fonts: ['14px Noto', '700 14px Noto', '600 48px Oswald', '600 32px Podkova'].every(font => document.fonts.check(font)),
       images: [...document.images].length, unloaded: [...document.images].filter(image => !image.naturalWidth).length };
   })()`);
-  assert.equal(result.pages, 4, 'Expected four pages across three brandbook blocks');
-  assert.deepEqual(result.blocks, ['logo', 'logo-mono', 'fonts', 'colors']);
+  assert.equal(result.pages, 6, 'Expected cover and five content pages');
+  assert.deepEqual(result.blocks, ['cover', 'logo', 'logo-mono', 'fonts', 'colors', 'voice']);
   assert.deepEqual(result.overflow, [], 'Content reaches the page footer');
   assert.equal(result.fonts, true, 'Local fonts must load');
   assert.equal(result.familiesLoaded, true, 'All three bundled font families must load');

brandbook/index.html

@@ -2,13 +2,20 @@
 <html lang="ru">
 <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Вечерний детектив — Брендбук</title><link rel="stylesheet" href="brandbook.css"></head>
 <body><main>
+<section class="page cover" id="cover" aria-labelledby="cover-title">
+<div class="eyebrow"><span>Вечерний детектив</span><span>Фирменный стиль</span></div>
+<img class="cover-logo" src="assets/logos/vertical-color-light-transparent.png" alt="Вечерний детектив">
+<h1 id="cover-title">Брендбук</h1>
+<p class="cover-caption">Логотип · Шрифты · Цвета · Тон общения</p>
+<footer class="folio"><span>ВЕЧЕРНИЙ ДЕТЕКТИВ</span><span>01 / 06</span></footer>
+</section>
 <section class="page" id="logo" aria-labelledby="logo-title">
 <div class="eyebrow"><span>Вечерний детектив / Брендбук</span><span>01 / Логотип</span></div>
-<h1 id="logo-title">Логотип и название</h1>
+<h2 id="logo-title">Логотип и название</h2>
 <p class="lead">Три композиции: знак, название справа и название снизу.</p>
 <div class="logo-grid"><figure class="logo-card mark"><a href="assets/logos/mark-color-light-background.png"><img src="assets/logos/mark-color-light-transparent.png" alt="Знак отдельно, светлый фон"></a><figcaption>Знак отдельно · светлый фон</figcaption></figure><figure class="logo-card mark"><a href="assets/logos/mark-color-dark-background.png"><img src="assets/logos/mark-color-dark-transparent.png" alt="Знак отдельно, тёмный фон"></a><figcaption>Знак отдельно · тёмный фон</figcaption></figure><figure class="logo-card horizontal"><a href="assets/logos/horizontal-color-light-background.png"><img src="assets/logos/horizontal-color-light-transparent.png" alt="Название справа, светлый фон"></a><figcaption>Название справа · светлый фон</figcaption></figure><figure class="logo-card horizontal"><a href="assets/logos/horizontal-color-dark-background.png"><img src="assets/logos/horizontal-color-dark-transparent.png" alt="Название справа, тёмный фон"></a><figcaption>Название справа · тёмный фон</figcaption></figure><figure class="logo-card vertical"><a href="assets/logos/vertical-color-light-background.png"><img src="assets/logos/vertical-color-light-transparent.png" alt="Название снизу, светлый фон"></a><figcaption>Название снизу · светлый фон</figcaption></figure><figure class="logo-card vertical"><a href="assets/logos/vertical-color-dark-background.png"><img src="assets/logos/vertical-color-dark-transparent.png" alt="Название снизу, тёмный фон"></a><figcaption>Название снизу · тёмный фон</figcaption></figure></div><div class="grid2 rule"><div><h3>Светлый фон</h3><p class="small">Чёрное название, золотые акценты.</p></div><div><h3>Тёмный фон</h3><p class="small">Белое название, золотые акценты.</p></div></div>
 <p class="source-note">Используйте готовые композиции из комплекта.</p>
-<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА</span><span>01 / 04</span></footer></section>
+<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА · ТОН ОБЩЕНИЯ</span><span>02 / 06</span></footer></section>
 <section class="page" id="logo-mono" aria-labelledby="logo-mono-title">
 <div class="eyebrow"><span>Вечерний детектив / Брендбук</span><span>01 / Логотип · продолжение</span></div>
 <h2 id="logo-mono-title">Монохром и размещение</h2>
@@ -16,7 +23,7 @@
 <div class="logo-grid"><figure class="logo-card mark"><a href="assets/logos/mark-black-background.png"><img src="assets/logos/mark-black-transparent.png" alt="Знак отдельно, светлый фон"></a><figcaption>Знак отдельно · светлый фон</figcaption></figure><figure class="logo-card mark"><a href="assets/logos/mark-white-background.png"><img src="assets/logos/mark-white-transparent.png" alt="Знак отдельно, тёмный фон"></a><figcaption>Знак отдельно · тёмный фон</figcaption></figure><figure class="logo-card horizontal"><a href="assets/logos/horizontal-black-background.png"><img src="assets/logos/horizontal-black-transparent.png" alt="Название справа, светлый фон"></a><figcaption>Название справа · светлый фон</figcaption></figure><figure class="logo-card horizontal"><a href="assets/logos/horizontal-white-background.png"><img src="assets/logos/horizontal-white-transparent.png" alt="Название справа, тёмный фон"></a><figcaption>Название справа · тёмный фон</figcaption></figure><figure class="logo-card vertical"><a href="assets/logos/vertical-black-background.png"><img src="assets/logos/vertical-black-transparent.png" alt="Название снизу, светлый фон"></a><figcaption>Название снизу · светлый фон</figcaption></figure><figure class="logo-card vertical"><a href="assets/logos/vertical-white-background.png"><img src="assets/logos/vertical-white-transparent.png" alt="Название снизу, тёмный фон"></a><figcaption>Название снизу · тёмный фон</figcaption></figure></div><div class="grid2 rule"><div><h3>Свободное поле</h3><p class="small">Не меньше ¼ диаметра знака. В готовых файлах поле уже включено.</p></div><div><h3>Размер и контраст</h3><p class="small">Знак — от 48 px. С названием — от 240 px по ширине. Фон спокойный, без пёстрого рисунка.</p></div></div>
 <p class="source-note">Не менять пропорции, цвета и расположение элементов. Не добавлять тени.</p>
 <p class="small"><a href="assets/logos/catalog.html">Все варианты логотипа →</a></p>
-<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА</span><span>02 / 04</span></footer></section>
+<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА · ТОН ОБЩЕНИЯ</span><span>03 / 06</span></footer></section>
 <section class="page" id="fonts" aria-labelledby="fonts-title">
 <div class="eyebrow"><span>Вечерний детектив / Брендбук</span><span>02 / Шрифты</span></div>
 <h2 id="fonts-title">Шрифты</h2>
@@ -35,7 +42,7 @@
 </tbody></table>
 <p class="source-note">Шрифты включены в комплект. Лицензии SIL OFL 1.1: <a href="assets/fonts/Oswald-OFL.txt">Oswald</a>, <a href="assets/fonts/Podkova-OFL.txt">Podkova</a>, <a href="assets/fonts/LICENSE.txt">Noto Sans</a>. Передавайте шрифты вместе с лицензиями.</p>
 
-<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА</span><span>03 / 04</span></footer>
+<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА · ТОН ОБЩЕНИЯ</span><span>04 / 06</span></footer>
 </section>
 <section class="page" id="colors" aria-labelledby="colors-title">
 <div class="eyebrow"><span>Вечерний детектив / Брендбук</span><span>03 / Цвета</span></div>
@@ -49,6 +56,27 @@
 </div>
 <div class="grid2 rule"><div><h3>Служебные цвета</h3><p class="small">Серый — для элементов интерфейса. Цвета статусов сопровождаются текстом.</p></div><div><h3>Контраст</h3><p class="small">Белый на чёрном; чёрный на белом и золотом. Не набирать мелкий текст золотым на белом.</p></div></div>
 <p class="small">Для печати — цветопроба. <a href="README.md">Источники и лицензии →</a></p>
-<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА</span><span>04 / 04</span></footer>
+<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА · ТОН ОБЩЕНИЯ</span><span>05 / 06</span></footer>
+</section>
+<section class="page" id="voice" aria-labelledby="voice-title">
+<div class="eyebrow"><span>Вечерний детектив / Брендбук</span><span>04 / Тон общения</span></div>
+<h2 id="voice-title">Тон общения</h2>
+<p class="lead">Приглашаем в расследование: дружелюбно, с интригой и уважением к игроку.</p>
+<div class="grid2 rule">
+<div><h3>На равных</h3><p>Обращаемся на «вы», со строчной буквы. Поддерживаем команду, не оцениваем способности игроков.</p></div>
+<div><h3>Интрига без спойлеров</h3><p>Даём завязку и повод строить версии. Не раскрываем решения и ключевые улики.</p></div>
+<div><h3>Ясно и по делу</h3><p>Короткие фразы и конкретные действия. Время, место, цена и правила — без загадок.</p></div>
+<div><h3>Детективный характер</h3><p>«Дело», «улика», «версия», «расследование» — к месту. Без пафоса, давления и избытка восклицаний.</p></div>
+</div>
+<table><thead><tr><th>Ситуация</th><th>Как говорим</th></tr></thead><tbody>
+<tr><td>Анонс</td><td>У каждого свидетеля своя версия. Соберите команду и выясните, что произошло.</td></tr>
+<tr><td>Призыв</td><td>Выберите игру и зарегистрируйте команду.</td></tr>
+<tr><td>Подсказка</td><td>Сравните время в показаниях. Все ли детали сходятся?</td></tr>
+<tr><td>Ошибка</td><td>Не удалось отправить ответ. Попробуйте ещё раз.</td></tr>
+<tr><td>Финал</td><td>Дело закрыто. Спасибо за ваши версии и командную работу!</td></tr>
+</tbody></table>
+<div class="grid2 rule"><div><h3>Избегаем</h3><p>«Только гений раскроет это дело!»<br>«Вы опять ошиблись».<br>«Срочно! Последний шанс!!!»</p></div><div><h3>Вместо этого</h3><p>«Внимание к деталям поможет найти ответ».<br>«Попробуйте проверить другую версию».<br>Указываем реальный срок регистрации.</p></div></div>
+<p class="source-note">В анонсах создаём атмосферу. В правилах, оплате и поддержке прежде всего помогаем разобраться.</p>
+<footer class="folio"><span>ЛОГОТИП · ШРИФТЫ · ЦВЕТА · ТОН ОБЩЕНИЯ</span><span>06 / 06</span></footer>
 </section>
 </main></body></html>