01 · Палитра

Цвета бренда Ленин-центра

Источник: docs/brand.md · переменные в src/styles/tokens.css

02 · Лагеря

Цветовое кодирование сторон

--camp-red, --camp-white, --camp-rev-dem, --camp-green, --camp-national, --camp-intervention

03 · Типографика

Фирменные шрифты Ленин-центра

04 · Иерархия

Заголовки и kicker'ы

05 · Цифры-мотив

Крупные годы и буквица-номер

Цифры-год — Nolde Regular, 220px+, цвет --brass; на page-headers — opacity 0.10 как фон-водяной-знак.

06 · Графический мотив

Наклонные параллелограммы

07 · Шапки разделов

Page-header с буквицей-номером

Буквица — ::before content: attr(data-num), opacity: 0.10. Косая черта — ::after, skewX(--brand-skew).

08 · Кнопки

Тач-кнопки (min 48px touch hit)

Радиус 30px (pill); шрифт — --font-mono, tracking 0.22em, uppercase. Hover отсутствует (tach-киоск); фидбек только :active.

09 · Документы

Архивные плашки (Direction C)

Газеты разделены по orthography: до 10.X.1918 — старая (ять, ѣ, і, ъ); после декрета Совнаркома — новая, со стилистикой советской печати.

Реконструкции по оригиналам: «Биржевыя Вѣдомости», 1904 и «Правда» №115, 29.V.1919 (Wikimedia Commons / РИА Новости). Газеты того времени были чёрно-белые: красный цвет оригинал не использовал — это уже наша бренд-стилизация для случаев, когда нужен агитпроп-эффект. Шапка «Правды» — heavy condensed sans-serif, формально вне Ленин-палитры; для исторической точности оставлен системный Impact-стек.

10 · Карточки разделов

Party-card / State-card

Цветная полоска сверху по camp. Бумага --paper-white, заголовок Nolde Regular, дата 20 Kopeek caps.

11 · Фильтр по лагерю

Camp-filter pill

12 · Модалка

Раскрытие документа / карточки

Backdrop: rgba(15,22,28,.88) + backdrop-filter: blur(6px). Sheet — --paper-white. Кнопка-закрытия — --signal-red с обводкой --brass.

13 · Тач-метрики

Минимальные размеры и углы

14 · Логотип

LENIN CENTRE

Sans-serif в широком трекинге, тонкая золотая линия-разделитель. Применяется на тёмных фонах. Источник — обложка гайдбука 10.04.2026.

Файл-плейсхолдер: public/decor/lenin-centre-logo.svg (TODO).

15 · Обложки разделов

Гигантская цифра-номер раздела

PDF-страницы «1. Элементы стиля» и «2. Носители стиля». Огромная латунная цифра занимает левую часть, sans-serif-подзаголовок — справа внизу. Тонкие диагональные линии-латунь идут параллельно бренд-углу.

16 · Композиция параллелограммов

Свободные параллелограммы как декор

PDF-страница 4 «Основные графические элементы». В отличие от фоновых полос — это самостоятельные плашки разного размера и цвета, разбросанные по композиции; одиночные тонкие латунные линии под бренд-углом.

17 · Большая композиция

Год + город под наклоном + слэш-метки + callout

PDF-страница 8 «Типографика». Главный композиционный приём гайдбука: всё крутится вокруг крупной цифры-года в углу под углом ≈75°, латунный заголовок Nolde на красной полосе, слэш-метки слева, биографическая красная плашка по центру.

18 · Контурные римские цифры

XIX — XX (граница эпох)

PDF-страница 10 «Графика в экспозиции». Гигантские римские цифры даны только обводкой латунью на двухчастном фоне (iron-grey слева, signal-red справа), курсивный заголовок-даты сверху по центру. Ключевой мотив для разграничения эпох.

19 · Лента дат

Цепь годов под общим углом

PDF-страница 11 «Графика в экспозиции». Несколько событий выстроены в горизонтальную ленту — каждое в своей цветной плашке-параллелограмме, год белым Nolde Regular, подпись вертикально по диагонали. Подходит для таймлинии разделов или этапов биографии.

20 · Карты

Live <map-unit>

Многослойный SVG из map_v6 (HSV-классификация + potrace). Поддерживает pan/zoom, переключение слоёв, fade/wipe-анимации. Используется в state-card и в Direction A/B.

Источник: src/components/map-unit.js. Контент в public/content/maps/<id>/ (background.jpg, layers, sequence.json).

21 · Лаборатория типографики

Подбор кегля, начертания и фона

Сэмпл-текст можно редактировать (кликом). Слайдер меняет кегль, кнопки — жирность и курсив, кружки — фон из бренд-палитры.

Доступные начертания соответствуют файлам в public/fonts/{nolde,kopeek,cent}/. Nolde — только Regular 400, курсив запрещён (даже синтезированный браузером).

22 · R&D · live-DOM на 3D

HTML-in-Canvas — газеты, афиши, документы как тактильные объекты

Технология: живой DOM с CSS/JS захватывается в текстуру и натягивается на 3D-меш Three.js. Через нативное Chromium API ctx.drawElement() (флаг chrome://flags/#canvas-draw-element) обновляется покадрово; в продакшене сейчас html2canvas-fallback с захватом раз в 1.5 сек. Базируется на R&D-брифе XR LAB · 23.04.2026 (cloth / scroll / wall / book / orbit / game).

Сцены лениво инициализируются при попадании в viewport. Текстура 1024×1024, anisotropy 8, захват каждые 1.5 секунды (компромисс CPU vs свежесть). Источник прячется на position: absolute; left: -99999px — остаётся в layout, но не виден.