dsh-desktop-kit 1.0.0 → 2.0.0

package/skills/web-research/SKILL.md

@@ -1,40 +1,47 @@
 ---
 name: web-research
-description: "Живой поиск в интернете в реальном времени: находить актуальные факты, новости, цены, версии, законы и документацию, проверять по источникам и цитировать ссылки."
-whenToUse: "Когда нужны свежие/внешние данные: новости, «что сейчас», цены, версии ПО, изменения законов, документация, конкуренты, проверка факта; а также по просьбе «поищи в интернете»."
+description: "Живой поиск в интернете: актуальные факты, новости, цены, версии, законы и документация — 2+ источника, дата «актуально на» и ссылки."
+whenToUse: "Нужны свежие или внешние данные: новости, «что сейчас», цены, версии ПО, законы, документация, конкуренты; просьба «поищи в интернете»."
 user-invocable: true
 ---
 
 # Живой веб-поиск (реальное время)
 
-## Когда обязательно
-- Вопрос про **сейчас/сегодня/последние** изменения, новости, курсы, цены, релизы, версии, тарифы.
-- Проверка факта, цитаты, даты, имени, закона, медицинской/юридической нормы.
-- Актуальная документация библиотеки/сервиса перед кодом (версии API, breaking changes).
-- Конкуренты/рынок для SEO и контента; свежие исследования для статьи.
-
-## Процесс
-1. **Сформулируй 2–4 запроса** (рус/англ; синонимы; официальные термины). Для версий — `site:`/официальный домен.
-2. `web_search` → выбери 2–3 **независимых** источника, начни с официальных (docs, .gov, производитель, крупные СМИ).
-3. `web_fetch` — открой ключевые страницы целиком, если нужен контекст/детали; не полагайся только на сниппеты.
-4. **Сверь** минимум два источника; расхождения — покажи оба и объясни.
-5. Зафиксируй **дату поиска** и дату публикации источника. Свежесть: по умолчанию — не старше 12 месяцев (если не историческая справка).
-6. В ответе — **ссылки markdown** и пометка «актуально на YYYY-MM-DD». Не выдумывай URL/цифры.
-
-## Правила достоверности
-- Отличай **факт** от мнения/маркетинга; для медицины/юридических норм — только официальные источники (Минздрав, Росздравнадзор, законы) и осторожные формулировки.
-- Если источник платный/закрыт — так и скажи; не выдавай пересказ за первоисточник.
-- Если поиск не дал результата — честно сообщи и предложи уточнить запрос; не заполняй пробел догадкой.
-- Не используй устаревшие данные без предупреждения; при смене версии/цены — укажи оба значения и даты.
-
-## Формат ответа
-1. Короткий вывод (1–3 предложения).
-2. Детали с датами/версиями.
-3. «Источники:» — список ссылок (title + URL), дата публикации, если известна.
-4. «Актуально на: YYYY-MM-DD».
-
-## Связка с другими скиллами
-- `content-writing` — факты и цитаты только после `web-research`, со ссылками в черновике.
-- `seo` — свежая семантика/конкуренты/тренды и проверка выдачи.
-- `php-laravel`, `javascript-typescript`, `bitrix-aspro` — сверять версии и API с официальной документацией.
-- `requirements-and-planning` — рыночные/правовые вводные подтверждать источниками.
+> ≈1 450 токенов. Только `web_search` + `web_fetch`: память — не источник свежих фактов; рецепты и формат — §2.
+
+## 0 Когда применять
+- Вопрос про **сейчас/сегодня/последние**: новости, курсы, цены, релизы, версии, тарифы.
+- Проверка факта, цитаты, даты, имени, закона, медицинской или правовой нормы.
+- Документация перед кодом: версии API, breaking changes.
+- Конкуренты и рынок для SEO, свежие исследования для статьи.
+- Прямая просьба «поищи в интернете»; при важной свежести обязателен, даже если ответ «кажется известным».
+
+## 1 Главное
+
+**Только живой поиск.** `web_search` + `web_fetch`; сниппетов мало для деталей и цифр; никаких URL, цифр и дат «по памяти».
+
+**Запросы.** 2–4 формулировки: рус/англ, синонимы, официальные термины; для версий и цен — `site:` официального домена.
+
+**Источники.** 2–3 независимых, сначала официальные: документация, госсайты, производитель, крупные СМИ. Факт подтверждают **2+ источника**; расхождения — показать оба и объяснить.
+
+**Даты.** Фиксировать дату поиска и публикации источника; по умолчанию данные не старше 12 месяцев (кроме исторических справок); в ответе — **«актуально на YYYY-MM-DD»**.
+
+**Ссылки.** Markdown-ссылки (название + URL). URL и цифры не выдумывать: нет ссылки — нет утверждения.
+
+**Достоверность.** Факт отличать от мнения и маркетинга; медицина и право — только официальные источники и осторожные формулировки; платный источник — сказать прямо, не выдавать пересказ за первоисточник; результата нет — честно сообщить и уточнить запрос; устаревшее — предупредить, при смене версии/цены — оба значения с датами.
+
+**Формат.** Вывод (1–3 предложения) → детали с датами и версиями → «Источники:» (название, URL, дата) → «Актуально на: YYYY-MM-DD».
+
+**Связки.** `content-writing` и `seo` — факты только после проверки; версии API — перед кодом; вводные для `requirements-and-planning` — со ссылками.
+
+## 2 Куда грузить дальше
+| Когда нужно | Файл | ≈токенов |
+|---|---|---|
+| Запросы, источники, версии и цены | references/query-recipes.md | ≈1 450 |
+| Ответ со ссылками, расхождения, медицина/право | references/answer-and-citations.md | ≈1 500 |
+
+## 3 Гейт перед сдачей
+- [ ] Поиск вживую; ≥ 2 независимых источника.
+- [ ] Дата поиска и публикаций зафиксированы; «актуально на YYYY-MM-DD» в ответе.
+- [ ] Каждое утверждение со ссылкой; URL и цифры не выдуманы.
+- [ ] Расхождения, устаревшее и платные источники раскрыты.

package/skills/web-research/references/answer-and-citations.md

@@ -0,0 +1,60 @@
+# Ответ, ссылки и спорные случаи
+
+> Часть навыка web-research. ≈1 500 токенов. Читать, когда: собираешь ответ с цитатами, источники расходятся, данные устарели или тема медицинская/юридическая.
+
+## 1. Каркас ответа
+```
+1. Вывод — 1–3 предложения.
+2. Детали — даты, версии, цифры, условия.
+3. Источники — название + URL + дата публикации.
+4. Актуально на: YYYY-MM-DD.
+```
+
+- Дату брать из системного времени и дат источников, не придумывать.
+- Ссылки — markdown, кликабельные: `[Название](https://…)`.
+- Источник на английском — цитировать оригинал и пересказать суть по-русски.
+
+## 2. Как цитировать
+- На каждое фактическое утверждение — ссылка на страницу, где это сказано.
+- Ссылка ведёт на конкретную страницу или раздел, а не на главную.
+- Дата публикации — если есть; если нет, писать «дата не указана».
+- Не смешивать своё мнение с цитатой: «По данным X…», «Рекомендую…».
+
+## 3. Источники расходятся
+- Показать оба значения и оба источника, объяснить вероятную причину: разные даты, методики, регионы.
+- Выбрать более свежий и официальный как основной, но не скрывать второй.
+- Если вопрос критичный — сказать, что нужно уточнение у владельца данных.
+
+## 4. Данные устарели
+- Предупредить: «данные за <год>, актуальнее не найдено».
+- При смене версии или цены — «было → стало» с датами.
+- Историческую справку помечать как историческую и не требовать от неё свежести.
+
+## 5. Платные и закрытые источники
+- Сказать прямо: «полный текст платный или по подписке», дать видимую часть.
+- Не выдавать пересказ за первоисточник.
+- Не обходить paywall и не искать пиратские копии.
+
+## 6. Медицина и право
+- Только официальные источники и осторожные формулировки: «по клиническим рекомендациям…», «согласно ст. …».
+- Не ставить диагнозы и не заменять консультацию врача или юриста; для решений направлять к специалисту.
+- Указывать редакцию закона и дату вступления в силу.
+- Не переносить зарубежные нормы на РФ без оговорки.
+
+## 7. Если ничего не найдено
+- Честно: «надёжных источников не найдено».
+- Коротко: что пробовал — запросы, домены.
+- Что уточнить у пользователя: город, год, версия, организация.
+- Не заполнять пробел догадкой и не выдумывать ссылку.
+
+## 8. Примеры
+- Плохо: «Новая версия вышла недавно» — без номера, ссылки и даты.
+- Хорошо: «Версия X.Y — [release notes](https://…), опубликовано <дата>; актуально на <дата>».
+- Плохо: «Врачи советуют…» — без источника.
+- Хорошо: «Согласно клиническим рекомендациям ([ссылка], <год>)…».
+
+## 9. Связка с другими навыками
+- `content-writing` — факты и цитаты только после `web-research`, ссылки — в черновике.
+- `seo` — свежая семантика, конкуренты, тренды и проверка выдачи.
+- Стековые скиллы (PHP/Laravel, JS/TS, Bitrix и т. п.) — версии и API сверять с официальной документацией.
+- `requirements-and-planning` — рыночные и правовые вводные подтверждать источниками.

package/skills/web-research/references/query-recipes.md

@@ -0,0 +1,44 @@
+# Рецепты запросов и иерархия источников
+
+> Часть навыка web-research. ≈1 450 токенов. Читать, когда: поиск даёт мусор, нужен первоисточник, версия/цена/закон или сравнение нескольких источников.
+
+## 1. Как формулировать запросы
+- 2–4 варианта на один вопрос: русский и английский, синонимы, официальные термины («Правительство Москвы», а не «мэрия»).
+- Короткие запросы лучше длинных: 3–6 значимых слов; убрать «подскажите», «срочно», «пожалуйста».
+- Уточнять контекст: город, организация, год, редакция, версия продукта.
+- Для кода и документации: `site:` официального домена, имя функции или текст ошибки в кавычках.
+- Для законов: номер, дата, «действующая редакция», официальный портал правовой информации.
+- Для цен и тарифов: название продукта + «тарифы» + год и `site:` вендора.
+- Точные фразы — в кавычках; исключения — минусом; операторами не злоупотреблять.
+
+## 2. Иерархия источников
+1. **Первоисточник:** официальная документация, закон, приказ, пресс-релиз вендора, статистика ведомства.
+2. **Профильные авторитетные:** отраслевые издания, крупные СМИ, рецензируемые журналы.
+3. **Агрегаторы, обзоры, форумы** — подсказка, где искать, но не доказательство.
+
+- Медицина: Минздрав, Росздравнадзор, клинические рекомендации, ВОЗ; не сайты-обзоры о здоровье.
+- Право: текст закона и официальные разъяснения; статьи юристов — вторичны.
+- Софт: CHANGELOG, документация, страницы релизов; блоги-пересказы — вторичны.
+
+## 3. Как найти первоисточник
+- Начать с официального домена, затем смотреть, кто ссылается на оригинал, а не на пересказ.
+- В статье искать ссылку на документ или исследование и открывать её.
+- Проверить, что страница та самая: версия, дата, нужный раздел, а не редирект на главную.
+- Для цифр искать таблицу или методику расчёта, а не только число в тексте.
+
+## 4. Версии, цены, законы
+- Версия: CHANGELOG, release notes, тег в репозитории; фиксировать номер и дату.
+- Цена/тариф: официальная страница тарифов; указывать дату, валюту и условия (регион, НДС).
+- Закон: действующая редакция и дата вступления в силу; проверить, не отменён ли.
+- Изменение: показывать «было → стало» с датами, а не только текущее значение.
+
+## 5. Если результатов нет
+- Переформулировать: убрать жаргон, сменить язык, добавить год или организацию.
+- Проверить официальный сайт напрямую и поиск по нему.
+- После 2–3 попыток честно сказать, что надёжных данных нет; не подменять догадкой.
+
+## 6. Чего не делать
+- Не цитировать сниппет как источник, не открыв страницу.
+- Не брать цифры из SEO-статей без первоисточника.
+- Не выдавать старую версию за текущую; не игнорировать дату публикации.
+- Не выдумывать URL «по шаблону» и не собирать домены на глаз.

package/skills/wow-design/SKILL.md

@@ -1,168 +1,89 @@
 ---
 name: wow-design
-description: "Дизайн-директор уровня топового web-UI дизайнера: арт-направление, токены, композиция, типографика, петля скриншот-критики. Использовать перед ЛЮБОЙ вёрсткой/дизайном интерфейса."
-whenToUse: "Любая задача, где создаётся или меняется внешний вид интерфейса: новая страница, лендинг, дашборд, форма, компоненты, темы, адаптив, дизайн-апгрейд, «сделай красиво». Загружать ДО первой строки HTML/CSS."
+description: "Дизайн-директор: арт-направление, токены AURORA, композиция, типографика, петля скриншот-критики. Загружать до вёрстки."
+whenToUse: "Любой новый или изменяемый UI: страница, лендинг, дашборд, форма, компоненты, темы, адаптив, «сделай красиво»."
 user-invocable: true
 ---
 
 # WOW-DESIGN — дизайн-директор
 
-> Ты — старший web-UI дизайнер с 40-летним опытом и безупречным вкусом.
-> Твой результат должен выглядеть дорого и уместно **с первого раза**, а не после десяти правок.
-> Красота здесь — не украшение, а ясность, иерархия и доверие. ВАУ без потери удобства.
-
-## 0. КОНТРАКТ (нарушать нельзя)
-
-1. **Не начинай вёрстку без арт-направления.** Сначала 5–10 минут на «Design Brief» (шаблон: `references/design-brief-template.md`):
-   аудитория, задача экрана, 3 слова настроения, 1–2 референса, 1 анти-референс, палитра/пресет, шрифт, signature-деталь.
-2. **Никогда не изобретай палитру и типографику с нуля**, если нет сильного бренд-контекста. Бери дизайн-кит:
-   `assets/kit/` — токены, компоненты, 5 пресетов, локальные шрифты. Адаптируй только акцент/шрифт под бренд.
-3. **Только токены, никаких магических чисел.** Цвета/отступы/радиусы/тени/типографика — из `assets/kit/assets/css/tokens.css`
-   (или скопируй переменные в проект). Один акцент + нейтрали + редкая тёплая деталь.
-4. **Петля визуальной проверки обязательна.** Собрал → скриншоты 1440/768/390, light/dark → смотри глазами (`read_image`)
-   → критика по рубрике (`references/critique-rubric.md`) → правки → снова скриншоты. **Минимум 2 итерации.**
-5. **Гейт качества:** средний балл ≥ 4.4/5, ни один критерий < 4; axe без critical/serious; на 390px нет горизонтального
-   скролла; тёмная тема проверена; first impression = «премиально», а не «шаблон».
-6. **Отчёт с доказательствами:** скриншоты + краткое обоснование решений (почему такой пресет, шрифт, композиция) +
-   что проверено. Без скриншотов работа не считается сданной.
-
-## 1. ПРОЦЕСС (7 шагов)
-
-### Шаг 1. Арт-направление (до кода)
-Выбери **один** пресет и адаптируй под задачу:
-
-| Пресет | Когда | Настроение | Display | Акцент |
-|---|---|---|---|---|
-| `aurora` | клиника, культура, премиум-сервис | тихая роскошь, тепло, доверие | Lora (serif) | изумруд `#0E6E5E` + медь |
-| `graphite` | продукт, SaaS, админки, дашборды | точность, плотность, технологичность | Unbounded | мята `#6EE7C8` / `#0E7C66` |
-| `editorial` | медиа, истории, бренд-лендинги | журнал, характер, крупная типографика | Lora | вермильон `#C8442A` |
-| `warm` | сервис для людей, образование, забота | человечность, мягкость, крем | Lora | терракота `#B85C38` |
-| `swiss` | корпоративный строгий, отчёты, B2B | дисциплина, сетка, контраст | Golos 700 | красный `#E0301E` |
-
-Заполни формулу: **3 прилагательных + 1 референс (что крадём) + 1 анти-референс (чего избегаем) + signature-деталь.**
-Signature-деталь — одна запоминающаяся вещь: крупные редакционные цифры, волосяные линии с «засечками», монограммы,
-печать/эмблема, номерные секции, тонкая бумажная текстура, необычный ритм сетки. Ровно одна, не пять.
-
-Справочники: `references/principles.md` (76 правил ремесла с числами), `references/presets.md` (пресеты подробно),
-`references/inspiration.md` (32 референса: что украсть/что нет), `references/critique-rubric.md` (рубрика 12×5),
-`references/anti-patterns.md` (42 антипаттерна), `references/stack-recipes.md` (React/Laravel/Bitrix), `references/visual-qa.md`.
-
-### Шаг 2. Токены
-Скопируй/подключи `assets/kit/assets/css/tokens.css`, `base.css`, `fonts.css`. Если проект уже имеет свою тему —
-**не ломай её**: замапий свои компоненты на существующие CSS-переменные, добавь недостающие токены, не перекрашивай всё.
-Проверь контраст: текст ≥ 4.5:1, крупный ≥ 3:1, фокус видимый.
-
-### Шаг 3. Композиция (до деталей)
-- 12-колоночная сетка, контейнер 1200–1360px, gutter `clamp(20px, 4.5vw, 56px)`.
-- Hero: **асимметрия** 7/5 или 8/4. Kicker (капс 11–12px + линия) → display-H1 (`clamp(3rem, 7vw, 6rem)`) → lead (≤52ch) →
-  2 CTA (primary + secondary) → proof-строка (3–4 цифры/факта) → визуальный якорь (типографика/SVG/диаграмма, не сток-фото).
-- Ритм секций: чередуй фон (`bg` / `surface` / `bg-alt`), отступы `clamp(64px, 8vw, 128px)`, волосяные разделители.
-- Карточки — только когда элементов действительно несколько и они равнозначны. Не «стена из трёх одинаковых карточек с иконками».
-- Плотные данные (таблицы, дашборды): строгая сетка, tabular-nums, правые числа, sticky header, hairline-строки.
-
-### Шаг 4. Сборка
-- Семантика: `header/nav/main/section/article/footer`, один `h1`, порядок заголовков, `lang="ru"`.
-- Компоненты — из `assets/kit/assets/css/components.css` или собери на тех же токенах. Каждый интерактивный элемент:
-  default / hover / focus-visible / active / disabled / loading; формы — error + help + disabled.
-- Иконки — inline SVG, stroke 1.5–1.6, 20/24px, один набор. Никаких эмодзи в UI. У иконок-кнопок — `aria-label`.
-- Контент — живой, конкретный, на языке пользователя. Никаких «Lorem ipsum», «Инновационные решения», «Мы предлагаем».
-
-### Шаг 5. Визуальная петля (главное!)
-```
-node <skill>/assets/scripts/capture.mjs <file> --name <page> --out <outdir>
-node <skill>/assets/scripts/audit.mjs  <file> --out <outdir>
-```
-Смотри PNG через `read_image`, оценивай по `references/critique-rubric.md`, выписывай 5–10 конкретных правок
-(не «сделать красивее», а «H1 72→88px, уменьшить радиус карточек до 14, убрать тень у статичных карточек, добавить
-воздуха вокруг сетки направлений»). Правишь → переснимаешь. Повторяй, пока гейт не пройден. **Не сдавай первый вариант.**
-
-### Шаг 6. Доступность и адаптив
-- 390px: нет горизонтального скролла; таблицы в `.table-wrap`; тач-цели ≥ 40–44px; ничего не обрезано.
-- Клавиатура: Tab-порядок, focus-visible, Escape закрывает модалки, aria-атрибуты.
-- `prefers-reduced-motion` — отключить reveal/hover-анимации.
-- Тёмная тема — отдельная палитра (не инверсия): фон глубже, акцент светлее, тени сильнее, контраст AA.
-
-### Шаг 7. Сдача
-Скриншоты (desktop 1440 light/dark, mobile 390, ключевые состояния) + 3–5 строк rationale + как интегрировать
-(какие файлы/токены/классы переиспользовать). Приложи пути к PNG в отчёте.
-
-## 2. РЫЧАГИ «ВАУ» (используй 3–5, не все сразу)
-
-1. **Типографический контраст:** огромный serif-display + мелкий капс-лейбл с трекингом + спокойный body. 80% впечатления.
-2. **Редакционная сетка:** асимметрия, номерные секции (01/02/03), волосяные линии, поля-воздух.
-3. **Одна смелая деталь:** гигантская цифра/буква, эмблема, вертикальный текст, необычный разделитель — но одна.
-4. **Материальность:** тёплая бумага, лёгкое зерно (2–3%), hairline-бордеры, слоистые тени, без «пластика».
-5. **Точные данные:** SVG-графики, sparklines, таблицы с tabular-nums, моно-цифры — выглядят дорого.
-6. **Микродетали:** offset у подчёркиваний, selection-цвет, аккуратный скроллбар, фокус-кольцо, иконки 1.5px.
-7. **Движение с достоинством:** reveal 700ms `cubic-bezier(.16,1,.3,1)`, stagger 60ms, hover 180ms; без bounce/parallax-цирка.
-8. **Копирайт:** глаголы, конкретика, числа, польза. Заголовок должен продавать результат, а не описывать отдел.
-
-## 3. АНТИПАТТЕРНЫ (мгновенно убивают «дорого»)
-
-Фиолетово-синие градиенты · 3 одинаковые карточки с иконками · glassmorphism на каждом блоке · эмодзи вместо иконок ·
-радиусы 24–32px у всего · дефолтный Bootstrap/Shadcn-вид без характера · центрированный hero с «блобами» ·
-gradient-text на заголовках · серый текст с контрастом < 4.5 · несогласованные отступы (13/17/22px) · тени «как в 2010» ·
-стоковые улыбающиеся люди · перегруз бейджами/иконками · анимации ради анимаций · «Lorem ipsum» · 16px-везде ·
-карточки с одинаковой иконкой-облачком · карусели, которые никто не листает · модалка на модалке.
-
-Полный список с заменами: `references/anti-patterns.md`.
-
-## 4. СТЕКИ (не изобретай заново)
-
-- **React + Tailwind/Vite:** токены — CSS-переменные в `:root`; Tailwind `@theme` маппится на них; компоненты — в одном
-  `components/ui`, состояния через `data-state`; скриншоты через `npm run dev` + capture. Подробнее: `references/stack-recipes.md`.
-- **Laravel Blade:** `resources/views/layouts/app.blade.php` + partials (`components/button.blade.php` и т.п.);
-  токены — `resources/css/tokens.css`; не ломай существующие классы; проверяй `npm run build`.
-- **Bitrix/Aspro:** правки — в `local/templates/<template>/` и `custom.css`/`init.php`, не в ядре и не в маркетплейс-шаблоне;
-  стили скоупить под контейнер страницы; после правок чистить кэш CSS (`/bitrix/cache/css/...`); проверять на живой странице.
-
-Подробные рецепты и подводные камни: `references/stack-recipes.md`.
-
-## 5. ЧТО ЛЕЖИТ В КИТЕ
-
-```
-assets/kit/
-  showcase.html        — витрина системы: палитры, типографика, компоненты, состояния, пресеты
-  pages/hospital.html  — эталон: премиальный лендинг клиники (aurora)
-  pages/dashboard.html — эталон: продуктовый дашборд (graphite, light/dark)
-  assets/css/          — tokens.css, base.css, fonts.css, components.css
-  assets/js/kit.js     — тема/пресет, reveal, tabs, modal
-  assets/fonts/        — Golos Text, Lora, Unbounded (OFL, локально)
-assets/scripts/
-  capture.mjs          — скриншоты (desktop/tablet/mobile, light/dark, full page)
-  audit.mjs            — axe-core + overflow/tap-target/шрифты/консоль
-```
-Как использовать: открой `showcase.html` для эталона; скопируй `tokens.css`/`base.css`/`fonts.css`/`components.css`
-и нужные паттерны страниц в проект; если проекта нет — начни с эталонной страницы, замени контент и бренд-акцент.
-
-## 6. ПРОВЕРКА ПЕРЕД СДАЧЕЙ (чек-лист)
-
-- [ ] Арт-направление зафиксировано (пресет, 3 слова, референс, signature-деталь).
-- [ ] Первый экран читается за 5 секунд: понятно, что это, для кого и что делать.
-- [ ] Иерархия: 1 главный акцент на экран; взгляд идёт по нужному маршруту.
-- [ ] Типографика: display/body/лейблы различимы, строка 60–72ch, числа табличные.
-- [ ] Воздух: секции дышат, сетка выровнена, ничего не «прилипло».
-- [ ] Состояния всех интерактивных элементов; формы с ошибками и подсказками.
-- [ ] Мобильный 390px, планшет 768px, десктоп 1440px — проверены скриншотами.
-- [ ] Тёмная тема — отдельная палитра, контраст AA.
-- [ ] axe: critical/serious = 0; keyboard/focus проверены.
-- [ ] Нет ни одного пункта из антипаттернов.
-- [ ] Скриншоты приложены, рубрика ≥ 4.4/5 и ни один критерий < 4.
-
-## 7. ЕСЛИ ЗАДАЧА — «ПРОСТО ПОПРАВИТЬ» СУЩЕСТВУЮЩИЙ UI
-
-Не переписывай всё. Сначала загрузи `design-critique`, сними скриншоты «до», оцени по рубрике, исправь
-**P0-проблемы** (иерархия, контраст, поломки адаптива, состояния), затем P1-полировку. Покажи «до/после».
-Сохраняй существующие классы/структуру, если проект чужой; правки — минимальные и локальные.
-
-## 8. ОТЧЁТ (шаблон)
-
-```
-## Дизайн: <страница/компонент>
-Арт-направление: <пресет>, <3 слова>, signature: <деталь>
-Что сделано: <3–6 пунктов>
-Скриншоты: <пути>
-Рубрика: <средний балл>, слабые места: <...>
-Проверено: 1440/768/390, light/dark, axe (critical=0), keyboard
-Риски/что дальше: <...>
-```
+> Дорого и уместно с первого раза. Красота = ясность, иерархия, доверие; ВАУ без потери удобства.
+
+## Контракт
+1. **Арт-бриф до кода** (5–10 мин): аудитория, задача, 3 слова, 1–2 референса, анти-референс, пресет,
+   signature-деталь. Шаблон — `references/design-brief-template.md`.
+2. **Кит AURORA**, не палитра с нуля: 5 пресетов, локальные Golos Text / Lora / Unbounded,
+   `assets/kit/assets/css/tokens.css`, `base.css`, `fonts.css`, `components.css`; бренд — только
+   `--accent*` и шрифт;
+   без CDN и внешних картинок.
+3. **Только токены**, без 13/17/22px.
+4. **Петля:** capture → `read_image` → рубрика → 5–10 правок с числами → capture;
+   **≥2 итерации, первый вариант не сдаётся**.
+5. **Гейт:** рубрика ≥4.4/5 и все ≥4; axe 0 critical/serious; 390 без overflow; light/dark; клавиатура.
+6. **Отчёт:** скриншоты + rationale.
+
+## Бриф и пресет
+`aurora` клиника/премиум — Lora, изумруд+медь · `graphite` SaaS/дашборд — Unbounded, мята ·
+`editorial` медиа — Lora, вермильон · `warm` забота — Lora, терракота · `swiss` B2B — Golos 700, красный.
+Signature — ровно одна: цифры, номерные секции, монограмма, вертикальный лейбл, необычный
+разделитель, зерно.
+Палитры и do/don't — `references/quick-presets.md`.
+
+## Процесс
+1. Бриф.
+2. Токены; в чужой теме замапь переменные и добавь недостающие, не перекрашивай всё;
+   контраст 4.5:1 (крупный 3:1), фокус видим.
+3. Сетка 12, контейнер 1200–1360; hero 7/5–8/4: kicker (капс 11–12px) → H1 `clamp(3rem,7vw,6rem)` →
+   lead ≤52ch → 2 CTA → 3–4 факта → типографический якорь (типографика/SVG, не сток-фото);
+   секции `clamp(64px,8vw,128px)`, hairline; карточки — только для равнозначных; данные —
+   tabular-nums, правые числа.
+4. Семантика, один `h1`, `lang="ru"`; 7 состояний, формы с error + help; иконки SVG 1.5–1.6,
+   у кнопок-иконок `aria-label`; без эмодзи и Lorem.
+5. `node ~/.dsh/skills/wow-design/assets/scripts/capture.mjs <file> --name <page> --out <dir>`;
+   `.../audit.mjs <file> --out <dir>`; правки до гейта.
+6. 390: `.table-wrap`, тапы 40–44; Tab/Escape/focus, focus trap в модалках, alt; reduced-motion;
+   dark — отдельная палитра, AA.
+7. Сдача: 1440/768/390 light/dark + rationale.
+
+Числа ремесла (шкала, строка, тени, радиусы, motion, состояния) — `references/principles.md`.
+
+## Рычаги и антипаттерны
+3–5 из 8: типоконтраст, редакционная сетка, одна смелая деталь, материальность, точные данные,
+микродетали, движение, копирайт-результат; детали — `references/wow-levers.md`.
+Запрещено: фиолетовые градиенты, 3 одинаковые карточки, glassmorphism, эмодзи, радиусы 24–32,
+Bootstrap/Shadcn-дефолт, центрированный hero с блобами, gradient-text, контраст <4.5, стоковые фото,
+карусели. Полные 42 — `references/anti-patterns.md`.
+
+## Стеки
+React+Tailwind: CSS-переменные, `@theme`, `data-state`. Laravel: `tokens.css`, не ломать `old()`.
+Bitrix: только `local/`, чистка кэша. Рецепты — `references/stack-recipes.md`.
+
+## Нужно → файл → ≈токенов
+| Нужно | Файл | ≈токенов |
+|---|---|---|
+| Бриф | `design-brief-template.md` | 0.9k |
+| Пресеты | `quick-presets.md` / `presets.md` | 1.6k / 2.7k |
+| 76 правил | `principles.md` | 11.5k |
+| Рубрика | `critique-rubric.md` | 7.4k |
+| Антипаттерны | `anti-patterns.md` | 9k |
+| Референсы | `inspiration.md` | 7.9k |
+| Стеки | `stack-recipes.md` | 2.3k |
+| Visual QA | `visual-qa.md` | 1.7k |
+| Рычаги | `wow-levers.md` | 1k |
+| Отчёт | `report-template.md` | 0.4k |
+
+Кит — `assets/kit/` (`showcase.html`, `pages/hospital.html`, `pages/dashboard.html`); нет проекта —
+начни с эталонной страницы.
+
+## Гейт
+- [ ] Бриф и signature.
+- [ ] 5 секунд: что это и куда нажать; один акцент.
+- [ ] Типографика 60–72ch, tabular-nums; состояния, формы, empty/loading.
+- [ ] Скриншоты 1440/768/390, light/dark.
+- [ ] 390: overflow 0, тапы 40–44, ничего не обрезано.
+- [ ] Dark — отдельная палитра, AA.
+- [ ] Axe 0 critical/serious; клавиатура.
+- [ ] Рубрика ≥4.4, все ≥4; антипаттернов нет.
+
+Правка чужого UI — сначала `design-critique`, «до», P0→P1, минимальные правки, «до/после».
+Отчёт — `references/report-template.md`.

package/skills/wow-design/references/anti-patterns.md

@@ -1,5 +1,8 @@
 # 03 · Антипаттерны «ИИ-дизайна» — 42 штуки
 
+> Часть навыка wow-design. ≈9k токенов. Читать, когда: проверяешь интерфейс на «AI-slop» или ищешь
+> замену запрещённому приёму.
+
 > Это не «невкусные приёмы», а маркеры, по которым интерфейс за 2 секунды опознаётся как
 > сгенерированный. Задача документа — не просто запретить, а **чем заменить** (с конкретными
 > значениями/токенами AURORA). Формат: как выглядит → почему плохо → чем заменить.

package/skills/wow-design/references/critique-rubric.md

@@ -1,5 +1,8 @@
 # 04 · Рубрика критики UI — 12 критериев × 5 уровней
 
+> Часть навыка wow-design. ≈7.4k токенов. Читать, когда: оцениваешь UI по 12 критериям и нужны
+> дескрипторы уровней, веса, подсчёт и шаблон отчёта.
+
 > Инструмент для петли «скриншот → критика → правки → скриншот». Оцениваем **глазами по скриншоту**,
 > а не по коду. Шкала 1–5, веса, порог **4.4/5**, ни один критерий **не ниже 4**. Ниже 4.4 — не сдано.
 >

package/skills/wow-design/references/design-brief-template.md

@@ -1,5 +1,7 @@
 # Шаблон Design Brief (заполняется до кода)
 
+> Часть навыка wow-design. ≈0.9k токенов. Читать, когда: заполняешь арт-брифинг до кода.
+
 > 5–10 минут. Без него не начинай вёрстку. Заполнять можно прямо в ответе пользователю или в файле проекта
 > `docs/design-brief.md`.
 

package/skills/wow-design/references/inspiration.md

@@ -1,5 +1,8 @@
 # 02 · Референсы — 32 сайта с разбором
 
+> Часть навыка wow-design. ≈7.9k токенов. Читать, когда: выбираешь референс под задачу и приём
+> для арт-брифа.
+
 > Как пользоваться: крадём **приём, пропорции, паттерн, тон** — не внешний вид целиком.
 > Каждая карточка: что именно украсть → какая фишка → что НЕ копировать. Тег `→ пресет`
 > показывает, в какой палитре AURORA приём раскроется лучше всего.

package/skills/wow-design/references/presets.md

@@ -1,5 +1,8 @@
 # Пресеты AURORA — как выбрать и как настроить
 
+> Часть навыка wow-design. ≈2.7k токенов. Читать, когда: выбираешь пресет и настраиваешь
+> палитру/композицию под бренд.
+
 > Все пресеты уже реализованы в `assets/kit/assets/css/tokens.css`: переключаются атрибутом
 > `<html data-preset="...">`, тема — `<html data-theme="light|dark">`.
 > Не создавай новый визуальный язык без причины — выбери пресет и адаптируй акцент/шрифт под бренд.

package/skills/wow-design/references/principles.md

@@ -1,5 +1,8 @@
 # 01 · Принципы ремесла — 76 правил
 
+> Часть навыка wow-design. ≈11.5k токенов. Читать, когда: нужны точные числа ремесла — сетка,
+> типографика, цвет, тени, motion, состояния, адаптив, доступность.
+
 > Рабочий документ для системы WOW-дизайна (DSH). Читать перед вёрсткой и во время критики.
 > Каждое правило — **что делать → как → типичная ошибка**. Все значения совместимы с токенами
 > AURORA (`assets/kit/assets/css/tokens.css`): отступы `--sp-*`, типографика `--text-*`,

package/skills/wow-design/references/quick-presets.md

@@ -0,0 +1,50 @@
+# Пресеты AURORA — выбор за 60 секунд
+
+> Часть навыка wow-design. ≈1.6k токенов. Читать, когда: выбираешь пресет под задачу или нужны
+> палитры light/dark, шрифты, формы и do/don't без чтения полного `presets.md`.
+
+## Как выбрать
+1. Кто пользователь и что важнее: доверие / скорость / плотность / эмоция / статус?
+2. Это бренд-история (лендинг, клиника, культура) или рабочий инструмент (дашборд, кабинет)?
+3. Есть бренд-цвета? Акцент берём из бренда, остальное — из ближайшего пресета.
+4. Нужна тёмная тема по умолчанию (продукт, DevOps)? → `graphite`.
+
+## Пять пресетов
+
+| Пресет | Когда | Настроение | Light | Dark | Display / body |
+|---|---|---|---|---|---|
+| `aurora` | клиника, wellness, премиум, культура | тихая роскошь, тепло, доверие | бумага `#F4F1EA`, изумруд `#0E6E5E`, медь `#B36A43`, линии `#DCD6CA` | фон `#0B0F0F`, поверхность `#121718`, мята `#5AD2B7`, медь `#E09A70` | Lora 500 / Golos Text |
+| `graphite` | SaaS, дашборд, админка, Service Desk | точность, плотность, контроль | фон `#F4F6F5`, акцент `#0E7C66`, чернила `#0F1414` | фон `#080B0B`, поверхность `#0F1414`, мята `#6EE7C8`, линии `#1F2926` | Unbounded (1–2 места) / Golos Text |
+| `editorial` | медиа, истории, бренд-лендинг | журнал, характер, смелость | бумага `#F8F5EF`, вермильон `#C8442A`, чернила `#171310` | фон `#121110`, поверхность `#1A1613`, коралл `#F06A4D` | Lora крупно / Golos Text |
+| `warm` | забота, образование, соцпроекты | человечность, мягкость, крем | крем `#FBF5EC`, терракота `#B85C38`, шалфей `#6C7A5B` | фон `#14100D`, поверхность `#1D1712`, акцент `#E8835C` | Lora / Golos Text |
+| `swiss` | B2B, банки, госуслуги, отчёты | дисциплина, сетка, контраст | белый `#FFFFFF`, чёрный `#0E0E0E`, красный `#E0301E` | фон `#0D0D0D`, поверхность `#151515`, акцент `#FF5B47` | Golos Text 700 / Golos Text |
+
+## Формы и signature
+- **aurora:** радиусы карточек 14px, контролов 10px; крупные редакционные цифры, печать/эмблема,
+  монограммы вместо фото, капс-надзаголовки с линией, бумажная текстура.
+- **graphite:** радиусы 4–11px, границы вместо теней; KPI с дельтой и sparkline, sticky-таблица,
+  командная строка ⌘K, статус-точки, сайдбар 240–260px, топбар 64px.
+- **editorial:** радиусы 2–5px, жирные волосяные линии; гигантские заголовки, номерные рубрики,
+  drop cap, цитаты на всю ширину, асимметричные блоки.
+- **warm:** радиусы 12–24px осознанно; мягкие плашки, рукописные подчёркивания SVG, эмпатичные
+  цитаты, «шаги» с крупными номерами.
+- **swiss:** радиусы 1–4px, жёсткая сетка; толстые линии-разделители, номера секций, таблицы,
+  красный только на действиях и статусах.
+
+## Do / Don't
+- **aurora:** воздух, спокойный тон, один изумрудный акцент; медь только в деталях. Нельзя: яркие
+  градиенты, неон, стоковые врачи, «медицинский синий» по умолчанию.
+- **graphite:** данные прежде декора, состояния всего, читаемые таблицы. Нельзя: огромные радиусы,
+  карточки ради карточек, тени поверх данных, пестрота статусов.
+- **editorial:** контраст масштабов, строгая сетка, крупные отступы. Нельзя: мелкие заголовки,
+  SaaS-карточки, пастель, всё центрировать.
+- **warm:** дружелюбный copy, округлость, тёплый фон. Нельзя: корпоративный холод, острые углы,
+  кислотные цвета, перегруз данными.
+- **swiss:** сетка, монохром + один красный, крупные поля, читаемые таблицы. Нельзя: декор, тени,
+  мягкие радиусы, пастель, игривые иллюстрации.
+
+## Адаптация под бренд
+Меняй только переменные акцента, остальное — из пресета:
+`--accent`, `--accent-hover`, `--accent-press`, `--accent-soft`, `--accent-ink`, `--accent-contrast`.
+Контраст `--accent` ↔ `--accent-contrast` ≥ 4.5:1; `--accent-soft` — фон бейджей/подсветок,
+текст на нём — `--accent-ink`; акцент — только действия/статусы/линии, не большие заливки.