i18n(uk): add resources/, scripts/, docs/, prompts/ translations

- Translate resources/ (README, QUICK-START, DESIGN-SYSTEM)
- Translate scripts/README.md (EPUB builder docs)
- Copy docs/ and prompts/ as-is (internal planning + functional prompts)
- Copy claude_concepts_guide.md (base for in-place translation)

Ref: luongnv89/claude-howto#63

uk/resources/README.md

@@ -0,0 +1,154 @@
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="logos/claude-howto-logo-dark.svg">
+  <img alt="Claude How To" src="logos/claude-howto-logo.svg">
+</picture>
+
+# Claude How To — Брендові ресурси
+
+Повна колекція логотипів, іконок та фавіконів для проєкту Claude How To. Усі ресурси використовують дизайн V3.0: компас з символом кодової дужки (`>`), що представляє направлену навігацію кодом — з палітрою Чорний/Білий/Сірий та акцентом Яскраво-зелений (#22C55E).
+
+## Структура каталогів
+
+```
+resources/
+├── logos/
+│   ├── claude-howto-logo.svg       # Основний логотип - Light mode (520×120px)
+│   └── claude-howto-logo-dark.svg  # Основний логотип - Dark mode (520×120px)
+├── icons/
+│   ├── claude-howto-icon.svg       # Іконка додатку - Light mode (256×256px)
+│   └── claude-howto-icon-dark.svg  # Іконка додатку - Dark mode (256×256px)
+└── favicons/
+    ├── favicon-16.svg              # Фавікон - 16×16px
+    ├── favicon-32.svg              # Фавікон - 32×32px (основний)
+    ├── favicon-64.svg              # Фавікон - 64×64px
+    ├── favicon-128.svg             # Фавікон - 128×128px
+    └── favicon-256.svg             # Фавікон - 256×256px
+```
+
+Додаткові ресурси в `assets/logo/`:
+```
+assets/logo/
+├── logo-full.svg       # Знак + текст (горизонтально)
+├── logo-mark.svg       # Тільки символ компасу (120×120px)
+├── logo-wordmark.svg   # Тільки текст
+├── logo-icon.svg       # Іконка додатку (512×512, округлена)
+├── favicon.svg         # 16×16 оптимізований
+├── logo-white.svg      # Біла версія для темних фонів
+└── logo-black.svg      # Чорна монохромна версія
+```
+
+## Огляд ресурсів
+
+### Концепція дизайну (V3.0)
+
+**Компас з кодовою дужкою** — навігація зустрічає код:
+- **Кільце компасу** = Навігація, пошук шляху
+- **Північна стрілка (зелена)** = Напрямок, прогрес на навчальному шляху
+- **Південна стрілка (чорна)** = Основа, міцний фундамент
+- **Дужка `>`** = Промпт терміналу, код, контекст CLI
+- **Позначки** = Точність, структуроване навчання
+
+### Логотипи
+
+**Файли**:
+- `logos/claude-howto-logo.svg` (Light mode)
+- `logos/claude-howto-logo-dark.svg` (Dark mode)
+
+**Специфікації**:
+- **Розмір**: 520×120 px
+- **Призначення**: Основний логотип заголовку/брендингу з текстом
+- **Використання**: Заголовки сайтів, бейджі README, маркетингові матеріали, друковані матеріали
+- **Формат**: SVG (повністю масштабований)
+- **Режими**: Light (білий фон) та Dark (фон #0A0A0A)
+
+### Іконки
+
+**Файли**:
+- `icons/claude-howto-icon.svg` (Light mode)
+- `icons/claude-howto-icon-dark.svg` (Dark mode)
+
+**Специфікації**:
+- **Розмір**: 256×256 px
+- **Призначення**: Іконка додатку, аватари, мініатюри
+- **Формат**: SVG (повністю масштабований)
+
+### Фавікони
+
+Оптимізовані версії різних розмірів для веб-використання:
+
+| Файл | Розмір | DPI | Використання |
+|------|--------|-----|-------------|
+| `favicon-16.svg` | 16×16 px | 1x | Вкладки браузера (старі браузери) |
+| `favicon-32.svg` | 32×32 px | 1x | Стандартний фавікон |
+| `favicon-64.svg` | 64×64 px | 1x-2x | Дисплеї High-DPI |
+| `favicon-128.svg` | 128×128 px | 2x | Apple touch icon, закладки |
+| `favicon-256.svg` | 256×256 px | 4x | Сучасні браузери, іконки PWA |
+
+## Інтеграція HTML
+
+### Базове налаштування фавіконів
+
+```html
+<!-- Browser favicon -->
+<link rel="icon" type="image/svg+xml" href="/resources/favicons/favicon-32.svg">
+<link rel="icon" type="image/svg+xml" href="/resources/favicons/favicon-16.svg" sizes="16x16">
+
+<!-- Apple touch icon (mobile home screen) -->
+<link rel="apple-touch-icon" href="/resources/favicons/favicon-128.svg">
+
+<!-- PWA & modern browsers -->
+<link rel="icon" type="image/svg+xml" href="/resources/favicons/favicon-256.svg" sizes="256x256">
+```
+
+## Палітра кольорів
+
+### Основні кольори
+- **Чорний**: `#000000` (Основний текст, обведення, південна стрілка)
+- **Білий**: `#FFFFFF` (Світлі фони)
+- **Сірий**: `#6B7280` (Вторинний текст, малі позначки)
+
+### Акцентний колір
+- **Яскраво-зелений**: `#22C55E` (Північна стрілка, центральна точка, акцентні лінії — тільки для виділень, ніколи як фон)
+
+### Dark mode
+- **Фон**: `#0A0A0A` (Майже чорний)
+
+### CSS-змінні
+```css
+--color-primary: #000000;
+--color-secondary: #6B7280;
+--color-accent: #22C55E;
+--color-bg-light: #FFFFFF;
+--color-bg-dark: #0A0A0A;
+```
+
+## Настанови з дизайну
+
+### Використання логотипу
+- Використовуйте на білому або темному (#0A0A0A) фоні
+- Масштабуйте пропорційно
+- Залишайте вільний простір навколо (мінімум: висота логотипу / 2)
+- Використовуйте надані light/dark варіанти для відповідних фонів
+
+### Доступність
+- Високі коефіцієнти контрасту (WCAG AA — мінімум 4.5:1)
+- Чисті геометричні форми, розпізнавані при будь-якому розмірі
+- Масштабований векторний формат
+- Без тексту в іконках (текст додається окремо)
+- Без залежності від червоно-зеленого розрізнення кольорів
+
+## Атрибуція
+
+Ці ресурси є частиною проєкту Claude How To.
+
+**Ліцензія**: MIT (див. файл LICENSE проєкту)
+
+## Історія версій
+
+- **v3.0** (Лютий 2026): Дизайн компас-дужка з палітрою Чорний/Білий/Сірий + Зелений акцент
+- **v2.0** (Січень 2026): Дизайн 12-променевого зоряного спалаху в стилі Claude з смарагдовою палітрою
+- **v1.0** (Січень 2026): Оригінальний дизайн іконки прогресії на основі шестикутника
+
+---
+**Останнє оновлення**: Лютий 2026
+**Поточна версія**: 3.0 (Компас-дужка)