6 changed files with 0 additions and 1412 deletions
--- a/AGENTS.md
+++ b/AGENTS.md
@ -1,173 +0,0 @@
 <!-- vibe42-agents-version: v3-guided-2026-06-01 -->
 # Vibe42 — учебная песочница для лендингов
 Workspace юзера `Issida_Ashirmatova`. Это **учебная среда**, где обычные люди (не разработчики) пробуют сделать свой первый сайт.
 ---
 ## 🎯 ТВОЯ РОЛЬ
 Ты — **гид и помощник**, а не слепой исполнитель. Цель сессии — чтобы юзер вышел с:
 1. **рабочим лендингом**, опубликованным по адресу `https://pages.git.vibe42.kz/Issida_Ashirmatova/<repo>/`,
 2. ощущением «это было легко» — без серверов, БД, токенов, конфигов.
 Юзер не разработчик. Ему важен **результат, который видно в браузере**, а не код.
 ---
 ## 🗺 СЦЕНАРИЙ ПЕРВОГО ЗАХОДА (юзер только зашёл, ещё ничего нет)
 1. Поздоровайся коротко: «Привет! Тут за 10 минут собираем лендинг и публикуем его в интернете. О чём хочешь сделать?»
 2. Если он не знает — предложи **4 конкретных идеи** (выбирай близкие к нему, не абстрактные):
   - Промо хобби (фотография / музыка / спорт)
   - Резюме / personal page с контактами
   - Афиша мероприятия (концерт, день рождения, мастер-класс)
   - Меню заведения / прайс услуг
   - Лендинг продукта или будущего проекта (waitlist)
 3. Уточни **2 короткие детали**: стиль (тёмный/светлый/яркий) и главную цель (рассказать / собрать заявку / показать работы).
 4. Сразу делай `./new-project <name>` и собирай страницу. Не спрашивай разрешения на каждый шаг.
 ---
 ## 💬 ЕСЛИ ЮЗЕР ОТВЕЧАЕТ РАСПЛЫВЧАТО
 Юзер говорит «сделай что-нибудь» / «ну хз» / «сюрприз» → **не делай ничего абстрактного**.
 Скажи: «Давай определимся, я задам 3 коротких вопроса:
 1. Это для тебя лично, для проекта/бизнеса, или для события?
 2. Главная цель — рассказать о чём-то / собрать заявку / показать портфолио?
 3. Любимое настроение — строгое тёмное, лёгкое светлое, яркое цветное?»
 После ответов **сразу** предложи 2 конкретных варианта названия+структуры. Дай выбрать и иди делать.
 ---
 ## 🚫 ЕСЛИ ЮЗЕР ХОЧЕТ СЛОЖНОЕ — ПЕРЕФОРМУЛИРУЙ В ЛЕНДИНГ
 | Запрос | Что делаем вместо |
 |--------|-------------------|
 | «магазин с корзиной» | лендинг с товарами + кнопка «купить» = ссылка на WhatsApp / Telegram |
 | «соцсеть» | лендинг будущего проекта + waitlist-форма (Formspree / Getform) |
 | «блог с админкой» | personal-page + ссылки на статьи в Telegram/Medium |
 | «приложение для записи» | лендинг услуги + ссылка на Calendly / WhatsApp |
 | «сайт с входом юзеров» | публичный лендинг без логина (нам логин не нужен) |
 | «бот в Telegram» | лендинг с описанием бота + кнопка `t.me/...` |
 **Не говори «это невозможно».** Скажи: «У нас песочница только для статических сайтов. Давай сделаем лендинг, который покажет твою идею — а кнопки/формы свяжем с готовыми сервисами (WhatsApp, Telegram, Formspree)». Юзер счастлив, результат за 15 минут.
 ---
 ## 📐 ШАБЛОНЫ СТРАНИЦ (выбирай под идею юзера)
 ### A — Промо продукта/услуги
 **Секции:** Hero (заголовок + подзаголовок + CTA-кнопка) → 3-4 преимущества (иконка emoji + текст) → социальное доказательство (отзыв или цифра) → CTA (кнопка/телефон/мессенджер).
 ### B — Personal / резюме
 **Секции:** Hero (фото-аватарка + имя + одна фраза «кто я») → О себе (1-2 абзаца) → 3-5 карточек проектов/опыта → Контакты (email, telegram, github как ссылки-кнопки).
 ### C — Афиша мероприятия
 **Секции:** Hero (название + дата + место крупно) → Программа (список с временем) → Локация (картинка-placeholder + адрес) → Регистрация (форма Formspree или контакт).
 ### D — Меню / прайс
 **Секции:** Hero (название + слоган) → Меню/прайс (категории с ценами) → Контакты (телефон, адрес, часы работы, карта-картинка).
 ### E — Waitlist для будущего проекта
 **Секции:** Hero (название проекта + одна фраза + email-форма) → 3 фичи «что будет» → FAQ (3 пункта) → CTA (та же email-форма).
 Все шаблоны — **одна страница, прокрутка вниз**. Никаких роутов, ничего динамического.
 ---
 ## ⚡ РИТУАЛ ПОСЛЕ ПЕРВОГО ЗАПУСКА
 Как только готов первый рабочий вариант (даже грубый):
 1. **Сразу запушь:**
   ```bash
   git add -A
   git commit -m "v1"
   git push origin HEAD:pages
   ```
 2. **ОБЯЗАТЕЛЬНО** дай юзеру ссылку **жирно**:
   > 🎉 Готово! Твой лендинг здесь: **https://pages.git.vibe42.kz/Issida_Ashirmatova/<repo>/**
 3. Скажи: «Открой в новой вкладке, посмотри. Что хочешь поменять?»
 4. Дальше короткие итерации: правка → push → новый URL-показ. Каждые 2-3 правки — push.
 ---
 ## ⚠️ ЖЕЛЕЗНЫЕ ПРАВИЛА (НЕ нарушать никогда)
 1. **Только статика — HTML + CSS + JS в браузере.**
 2. **Никакого бэкенда.** Никаких Node/Express/FastAPI/Django/PHP/Go-серверов. Никаких БД. Никакого Redis.
 3. **Никакой аутентификации / OAuth / JWT.**
 4. **Никакого Docker, nginx, sudo, системных настроек.**
 5. **Никаких тяжёлых сборщиков** (`npm install` дерево на 500МБ). Tailwind — только через CDN.
 6. **НИКОГДА `git init` в workspace root (`/workspaces/Issida_Ashirmatova`)** — это папка-контейнер юзера, не репозиторий.
 ---
 ## ✅ ВСЕГДА работай через `./new-project`
 Если юзер сказал «сделай сайт NAME» / «создай проект NAME»:
 ```bash
 cd /workspaces/Issida_Ashirmatova
 ./new-project NAME    # создаёт repo в Gitea + клонит локально в ./NAME/
 cd NAME
 # теперь создавай index.html / style.css / script.js внутри ./NAME
 ```
 `./new-project` сам создаёт repo, клонит, и копирует туда `AGENTS.md` + `design.md`.
 ---
 ## 🌐 Git и публикация
 **НЕТ GitHub.** Self-hosted git: **https://git.vibe42.kz**
 - Профиль юзера: https://git.vibe42.kz/Issida_Ashirmatova
 - Pages (живые лендинги): https://pages.git.vibe42.kz/Issida_Ashirmatova/<repo>/
 - Креды уже в `/workspaces/Issida_Ashirmatova/.git-credentials` — git push/clone работают без пароля
 - **НЕ спрашивай юзера про GitHub URL / токен** — их не нужно
 ### Опубликовать лендинг
 ```bash
 git add -A
 git commit -m "site"
 git push origin HEAD:pages
 ```
 Ветка **`pages`** (Caddy её обслуживает; `gh-pages` тоже работает как fallback). Push → лендинг доступен мгновенно.
 ---
 ## 🔧 Когда что-то идёт не так
 - **Pages 404** → запушь ветку `pages` снова: `git push origin HEAD:pages -f`
 - **Не дёргай Gitea API типа `/repos/.../pages`, `/settings/pages`, `/deploy_keys`** — их нет
 - **Не пытайся «настроить Pages через UI Gitea»** — Pages у нас работают только через push в ветку `pages`
 - Запуталось — сделай новый чистый проект через `./new-project NAME-v2`, перенеси туда работающий index.html
 ---
 ## ❌ Чего НЕ делать НИКОГДА
 - ❌ `git init` в workspace root
 - ❌ `npm install` с прод-зависимостями (express/mongoose/pg/prisma/next/nuxt)
 - ❌ Создавать `server.js` / `app.py` / `main.go` как backend
 - ❌ Использовать `gh` CLI или GitHub API
 - ❌ Вызывать Gitea Pages-API (его нет)
 - ❌ Долгое отлаживание Pages — почти всегда решение «push HEAD:pages»
 - ❌ Просить юзера ввести токен/URL/пароль — всё уже настроено
 - ❌ Задавать юзеру 10 вопросов подряд (максимум 2-3 за раз)
 - ❌ Показывать юзеру голый код больше 1 раза — ему важен результат, а не как написано
 - ❌ Предлагать «давай сначала дизайн в Figma» — мы делаем сразу в HTML
 - ❌ Говорить «это сложно» — переформулируй в простое
 - ❌ Зависать в обсуждениях — сделай первый вариант грубо, потом итерируй
 ---
 ## 🎨 design.md
 Рядом лежит `design.md` с готовой палитрой, типографикой и стартер-шаблоном `index.html`. **Начинай с него.** Не выдумывай новые цвета — модифицируй существующие.
--- a/PRD.md
+++ b/PRD.md
@ -1,235 +0,0 @@
 # PRD — Дашборд клинической кафедры медицинского университета
 **Версия документа:** 1.0
 **Дата:** 26.06.2026
 **Владелец продукта:** Issida Ashirmatova
 **Живая страница:** https://pages.git.vibe42.kz/Issida_Ashirmatova/clinical-dashboard/
 **Репозиторий:** https://git.vibe42.kz/Issida_Ashirmatova/clinical-dashboard
 ---
 ## 1. Обзор продукта
 Веб-дашборд для учёта преподавателей клинической кафедры медицинского университета. Представляет собой редактируемую таблицу, где каждый преподаватель — отдельная строка, а каждый параметр (ФИО, дата рождения, образование, научная степень, категория, сертификат специалиста, членство в ассоциациях, клиническая база) — вводимое поле. Дашборд строит многопараметрические отчёты и выгружает их в CSV.
 Продукт реализован как **статический сайт** (HTML + CSS + JS) без сервера, базы данных и авторизации. Данные хранятся в браузере (localStorage).
 ---
 ## 2. Цели и задачи
 ### Цели
 - Дать кафедре единое место для учёта кадрового состава преподавателей.
 - Обеспечить ввод и редактирование данных непосредственно в таблице, без форм и модальных окон.
 - Позволить получать аналитические отчёты по нескольким параметрам одновременно (например, «сколько преподавателей с научной степенью и какой категорией»).
 ### Задачи (метрики успеха)
 - Ввод строки преподавателя занимает < 1 минуты.
 - Отчёт по любому набору параметров строится мгновенно, без ручного подсчёта.
 - Данные не теряются между перезагрузками страницы.
 ---
 ## 3. Целевые пользователи
 | Роль | Сценарий |
 |------|----------|
 | **Ответственный по кафедре (администратор)** | Ведёт общую таблицу, собирает анкеты преподавателей, формирует отчёты для руководства. |
 | **Преподаватель** | Вводит собственные данные в свою строку, выгружает анкету файлом и отправляет администратору. |
 > ⚠️ Ограничение платформы: настоящая многопользовательская авторизация с общим хранилищем в статической песочнице невозможна. Поэтому совместная работа организована через экспорт/импорт файлов (см. раздел 9).
 ---
 ## 4. Контекст и ограничения платформы
 Платформа — учебная песочница Vibe42 (только статические сайты). Жёсткие ограничения:
 - ✅ Статика: HTML + CSS + JS в браузере.
 - ❌ Нет бэкенда, базы данных, Redis, Docker, nginx.
 - ❌ Нет авторизации / OAuth / JWT.
 - ❌ Нет тяжёлых сборщиков (npm-зависимостей).
 - 📦 Данные хранятся в `localStorage` браузера (персонально для устройства и браузера).
 ---
 ## 5. Границы продукта (Scope)
 ### В объёме (In scope)
 - Редактируемая таблица преподавателей со всеми параметрами.
 - Расширяемый набор параметров (пользовательские поля).
 - Статистические карточки (сводка по кафедре).
 - Поиск и фильтрация.
 - Многопараметрические отчёты с диаграммами и перекрёстной таблицей.
 - Экспорт в CSV, импорт/экспорт JSON (резервные копии, сбор анкет).
 ### Вне объёма (Out of scope)
 - Многопользовательский вход и общее серверное хранилище.
 - Загрузка файлов/фотографий на сервер.
 - Сложная бизнес-логика (расчёт стажа, автозаполнение из внешних баз).
 - Уведомления и email-рассылки (возможно добавление позже через Formspree).
 ---
 ## 6. Пользовательские истории
 1. Как администратор, я хочу добавить преподавателя и заполнить все его параметры прямо в таблице, чтобы не открывать отдельные формы.
 2. Как администратор, я хочу редактировать любое поле строки одним кликом, чтобы быстро исправлять данные.
 3. Как администратор, я хочу видеть сводку: сколько всего преподавателей, сколько с научной степенью, сколько с сертификатом.
 4. Как администратор, я хочу построить отчёт одновременно по нескольким параметрам, чтобы анализировать состав кафедры.
 5. Как администратор, я хочу выгрузить отчёт в CSV для предоставления руководству.
 6. Как преподаватель, я хочу ввести свои данные и выгрузить анкету файлом, чтобы передать её администратору.
 7. Как администратор, я хочу импортировать полученные анкеты, чтобы они добавились в общую таблицу без дубликатов.
 8. Как администратор, я хочу добавлять собственные параметры (например, «стаж», «учёное звание»), чтобы учитывать специфику кафедры.
 ---
 ## 7. Функциональные требования
 ### 7.1. Структура интерфейса
 - **Верхняя панель:** название, кнопки «+ Преподаватель», «⚙ Настроить поля», «⤓ Экспорт CSV», «⤒ Импорт».
 - **Вкладки:** «Преподаватели» и «Отчёты».
 - **Вкладка «Преподаватели»:** карточки статистики → панель поиска/фильтров → таблица.
 - **Вкладка «Отчёты»:** выбор параметров → графики распределения → перекрёстная таблица → сводка.
 ### 7.2. Таблица преподавателей (инлайн-редактирование)
 - Каждая строка = один преподаватель.
 - Каждый параметр = поле ввода прямо в ячейке.
 - Типы полей зависят от параметра (см. раздел 8).
 - **Автосохранение** в `localStorage` при вводе (с debounce ~350 мс).
 - Действия по строке:
  - `⤓` — выгрузить анкету одного преподавателя в JSON.
  - `🗑` — удалить строку (с подтверждением).
 - Кнопка «+ Преподаватель» добавляет пустую строку, фокус на поле «ФИО».
 - Все базовые поля свободно вводимы (выпадающие поля — редактируемые комбобоксы: выбор из подсказок **или** ввод своего значения).
 ### 7.3. Параметры преподавателя (модель данных)
 **Базовые поля (нельзя удалить):**
 | Ключ | Название | Тип | Обязательное | Варианты |
 |------|----------|-----|--------------|----------|
 | `fullName` | ФИО | text | да | — |
 | `birthDate` | Дата рождения | date | нет | — |
 | `education` | Образование | textarea | нет | — |
 | `academicDegree` | Научная степень | select (комбобокс) | нет | Нет / Кандидат наук / Доктор наук + свободный ввод |
 | `category` | Категория | select (комбобокс) | нет | Нет / Вторая / Первая / Высшая + свободный ввод |
 | `specialistCertificate` | Сертификат специалиста | text | нет | — |
 | `associations` | Членство в ассоциациях | text | нет | — |
 | `clinicalBase` | Клиническая база | text | нет | — |
 **Пользовательские поля:** добавляются через «⚙ Настроить поля». Доступные типы: текст, дата, число, выпадающий список (комбобокс), длинный текст, да/нет (чекбокс). Удаляемы (с подтверждением; значения у всех преподавателей теряются).
 ### 7.4. Статистика (карточки)
 - Всего преподавателей.
 - С научной степенью (кандидат / доктор).
 - Докторов наук.
 - С сертификатом специалиста.
 - Члены ассоциаций.
 Обновляется автоматически при редактировании таблицы.
 ### 7.5. Поиск и фильтрация
 - Полнотекстовый поиск по всем полям.
 - Фильтры: по научной степени, по категории, по клинической базе.
 - Счётчик «Показано: X из Y».
 ### 7.6. Отчёты (многопараметрические)
 - Выбор **нескольких** параметров чекбоксами.
 - По каждому выбранному параметру — диаграмма распределения (количество по значениям).
 - По первым двум выбранным — **перекрёстная таблица** (pivot): строки × столбцы, в ячейках количество преподавателей, с итогами по строкам/столбцам и общим.
 - Сводка: всего преподавателей, % с научной степенью, число параметров в отчёте.
 - Экспорт отчёта в CSV (все распределения + перекрёстная таблица).
 - Пустые значения отображаются как «(не указано)».
 ### 7.7. Экспорт и импорт
 - **Экспорт CSV** — вся таблица преподавателей (заголовок из актуальных названий полей).
 - **Резервная копия JSON** — полное состояние (преподаватели + пользовательские поля), двойной клик по кнопке «Экспорт CSV».
 - **Выгрузка анкеты** (⤓ в строке) — JSON одного преподавателя.
 - **Импорт** — добавление анкет из файла с защитой от дублей по ФИО (регистронезависимо). Поддерживаемые форматы: `{teachers:[...], customFields:[...]}`, массив преподавателей, один объект-преподаватель. Пользовательские поля из файла тоже сливаются.
 ---
 ## 8. Модель данных
 ```
 state = {
  teachers: [
    {
      id: "t_...",
      fullName: "...",
      birthDate: "ГГГГ-ММ-ДД",
      education: "...",
      academicDegree: "Доктор наук",
      category: "Высшая",
      specialistCertificate: "...",
      associations: "...",
      clinicalBase: "...",
      <customFieldKey>: <value>
    }
  ],
  customFields: [
    { key, label, type, options?, locked:false }
  ]
 }
 ```
 Хранение: `localStorage["clinical_dashboard_v1"]` = JSON.stringify(state).
 ---
 ## 9. Сценарий совместной работы (сбор анкет)
 Поскольку общего сервера нет, используется файловый обмен:
 1. Преподаватель открывает ссылку дашборда.
 2. Вводит свои данные в новую строку.
 3. Жмёт `⤓` в конце строки → получает файл `anketa_ФИО.json`.
 4. Отправляет файл администратору (email/мессенджер).
 5. Администратор жмёт «⤒ Импорт» → анкета добавляется в таблицу (дубли по ФИО отбрасываются).
 ---
 ## 10. Нефункциональные требования
 - **Доступность:** работает в любом современном браузере, адаптивная вёрстка (десктоп/планшет/телефон), таблица скроллится по горизонтали на узких экранах.
 - **Производительность:** таблица до ~200 строк работает без задержек; автосохранение дебаунсится.
 - **Приватность:** данные не покидают браузер пользователя (кроме случаев ручного экспорта).
 - **Отказоустойчивость:** при ошибке чтения localStorage приложение не падает, начинает с пустого состояния.
 - **Интернационализация:** интерфейс на русском языке.
 - **Палитра:** клиническая тема — белый фон, тёмный текст, бирюзовый акцент (`#0891B2`).
 ---
 ## 11. Техническая реализация
 | Файл | Назначение |
 |------|------------|
 | `index.html` | Структура страницы, вкладки, модальные окна. |
 | `styles.css` | Оформление (клиническая тема, таблицы, карточки, отчёты). |
 | `app.js` | Вся логика: состояние, рендеринг, автосохранение, отчёты, экспорт/импорт. |
 Стек: чистый vanilla JS, без фреймворков и сборщиков. Публикация — push в ветку `pages` Gitea, Caddy обслуживает статике мгновенно.
 ---
 ## 12. Дорожная карта (Roadmap)
 | Приоритет | Возможность |
 |-----------|-------------|
 | Высокий | Форма самостоятельной подачи анкеты преподавателем через Formspree/Getform (без файлов, отправка на email администратора). |
 | Высокий | Общее хранилище через опубликованный Google Sheets CSV для настоящей многопользовательской работы. |
 | Средний | Экспорт отчётов в PDF / печать. |
 | Средний | Загрузка фото преподавателя (avatar, base64 в localStorage). |
 | Средний | Валидация полей (формат даты, обязательность). |
 | Низкий | Журнал изменений (audit log). |
 | Низкий | Роли: просмотр только для преподавателей, редактирование для администратора. |
 ---
 ## 13. Глоссарий
 - **Комбобокс** — поле, совмещающее выпадающий список подсказок и свободный ввод текста.
 - **Перекрёстная таблица (pivot)** — таблица сопряжённости: строки и столбцы — значения двух параметров, в ячейках количество объектов с данной комбинацией.
 - **localStorage** — хранилище данных в браузере пользователя.
 - **CSV** — текстовый формат таблицы, открывается в Excel/Numbers.
 - **JSON** — формат для резервных копий и обмена анкетами.
--- a/app.js
+++ b/app.js
@ -1,578 +0,0 @@
 /* =========================================================
   Дашборд кафедры — логика
   Данные хранятся в localStorage (без сервера/БД)
   ========================================================= */
 const STORE_KEY = 'clinical_dashboard_v1';
 // ---- Базовые ( неудаляемые ) поля ----
 const BASE_FIELDS = [
  { key:'fullName',              label:'ФИО',                       type:'text',    required:true,  locked:true },
  { key:'birthDate',             label:'Дата рождения',             type:'date',    locked:true },
  { key:'education',             label:'Образование',               type:'textarea',locked:true },
  { key:'academicDegree',        label:'Научная степень',           type:'select',  options:['Нет','Кандидат наук','Доктор наук'], locked:true },
  { key:'category',              label:'Категория',                 type:'select',  options:['Нет','Вторая','Первая','Высшая'], locked:true },
  { key:'specialistCertificate', label:'Сертификат специалиста',    type:'text',    locked:true },
  { key:'associations',          label:'Членство в ассоциациях',    type:'text',    locked:true },
  { key:'clinicalBase',          label:'Клиническая база',          type:'text',    locked:true },
 ];
 // ---- Состояние ----
 let state = {
  teachers: [],
  customFields: [],
  editingId: null,
 };
 let filters = { search:'', degree:'', category:'', base:'' };
 /* ---------- Инициализация ---------- */
 function init(){
  load();
  if(state.teachers.length===0 && state.customFields.length===0){
    seedDemo();
  }
  bindEvents();
  buildFilterOptions();
  renderAll();
 }
 function load(){
  try{
    const raw = localStorage.getItem(STORE_KEY);
    if(raw){
      const data = JSON.parse(raw);
      state.teachers = data.teachers || [];
      state.customFields = data.customFields || [];
    }
  }catch(e){ console.warn('load failed', e); }
 }
 function save(){
  localStorage.setItem(STORE_KEY, JSON.stringify({
    teachers: state.teachers,
    customFields: state.customFields,
  }));
 }
 function allFields(){ return BASE_FIELDS.concat(state.customFields); }
 function uid(){ return 't_' + Math.random().toString(36).slice(2,10) + Date.now().toString(36).slice(-4); }
 /* ---------- Демо-данные при первом запуске ---------- */
 function seedDemo(){
  state.teachers = [
    { id:uid(), fullName:'Ахметова Гульнара Сериковна', birthDate:'1975-03-12',
      education:'КазНМУ им. С.Асфендиярова, лечебное дело, 1998; интернатура по кардиологии',
      academicDegree:'Доктор наук', category:'Высшая',
      specialistCertificate:'№АА1122334, 2022, Кардиология',
      associations:'Ассоциация кардиологов РК, ESC',
      clinicalBase:'Городской кардиологический центр' },
    { id:uid(), fullName:'Оспанов Тимур Бакытович', birthDate:'1982-11-05',
      education:'КГМУ, педиатрия, 2005; резидентура по неонатологии',
      academicDegree:'Кандидат наук', category:'Первая',
      specialistCertificate:'№АА5566778, 2023, Неонатология',
      associations:'Ассоциация неонатологов РК',
      clinicalBase:'Перинатальный центр №1' },
    { id:uid(), fullName:'Жумабаева Айгерим Нурлановна', birthDate:'1989-07-21',
      education:'КазНМУ, общая медицина, 2012; резидентура по терапии',
      academicDegree:'Нет', category:'Вторая',
      specialistCertificate:'№АА9988776, 2024, Терапия',
      associations:'',
      clinicalBase:'ГКП Поликлиника №12' },
  ];
  save();
 }
 /* ---------- События ---------- */
 function bindEvents(){
  // Табы
  document.querySelectorAll('.tab').forEach(t=>{
    t.addEventListener('click', ()=>{
      document.querySelectorAll('.tab').forEach(x=>x.classList.remove('active'));
      document.querySelectorAll('.tabpanel').forEach(x=>x.classList.remove('active'));
      t.classList.add('active');
      document.getElementById('tab-'+t.dataset.tab).classList.add('active');
      if(t.dataset.tab==='reports') renderReports();
    });
  });
  // Кнопки
  document.getElementById('btnAdd').addEventListener('click', addRow);
  document.getElementById('btnFields').addEventListener('click', openFields);
  document.getElementById('btnExport').addEventListener('click', exportCSV);
  document.getElementById('btnImport').addEventListener('click', ()=>document.getElementById('importFile').click());
  document.getElementById('importFile').addEventListener('change', importJSON);
  document.getElementById('btnAddField').addEventListener('click', addCustomField);
  document.getElementById('newFieldType').addEventListener('change', e=>{
    document.getElementById('newFieldOptions').hidden = e.target.value!=='select';
  });
  document.getElementById('btnReportCsv').addEventListener('click', exportReportCSV);
  // Фильтры
  document.getElementById('search').addEventListener('input', e=>{ filters.search=e.target.value.toLowerCase(); renderTable(); });
  document.getElementById('filterDegree').addEventListener('change', e=>{ filters.degree=e.target.value; renderTable(); });
  document.getElementById('filterCategory').addEventListener('change', e=>{ filters.category=e.target.value; renderTable(); });
  document.getElementById('filterBase').addEventListener('change', e=>{ filters.base=e.target.value; renderTable(); });
  // Инлайн-редактирование таблицы (делегирование событий)
  document.getElementById('tableBody').addEventListener('input', onCellInput);
  document.getElementById('tableBody').addEventListener('change', onCellInput);
  // Закрытие модалок по клику на фон
  document.querySelectorAll('.modal-overlay').forEach(ov=>{
    ov.addEventListener('click', e=>{ if(e.target===ov) ov.hidden=true; });
  });
  document.addEventListener('keydown', e=>{ if(e.key==='Escape'){ closeFields(); } });
 }
 /* ---------- Выпуски фильтров ---------- */
 function buildFilterOptions(){
  const degreeSel = document.getElementById('filterDegree');
  const catSel = document.getElementById('filterCategory');
  const baseSel = document.getElementById('filterBase');
  degreeSel.innerHTML = '<option value="">Все степени</option>'+uniqueValues('academicDegree').map(v=>`<option>${esc(v)}</option>`).join('');
  catSel.innerHTML = '<option value="">Все категории</option>'+uniqueValues('category').map(v=>`<option>${esc(v)}</option>`).join('');
  baseSel.innerHTML = '<option value="">Все базы</option>'+uniqueValues('clinicalBase').map(v=>`<option>${esc(v)}</option>`).join('');
 }
 function uniqueValues(key){
  const set = new Set();
  state.teachers.forEach(t=>{ if(t[key]) set.add(t[key]); });
  return [...set].sort();
 }
 /* ---------- Рендер всего ---------- */
 function renderAll(){ renderStats(); renderDatalists(); renderTable(); buildFilterOptions(); renderReportFieldsList(); }
 /* ---------- Карточки статистики ---------- */
 function renderStats(){
  const total = state.teachers.length;
  const doctors = state.teachers.filter(t=>t.academicDegree==='Доктор наук').length;
  const candidates = state.teachers.filter(t=>t.academicDegree==='Кандидат наук').length;
  const withDegree = doctors+candidates;
  const withCert = state.teachers.filter(t=>t.specialistCertificate && t.specialistCertificate.trim()).length;
  const inAssoc = state.teachers.filter(t=>t.associations && t.associations.trim()).length;
  document.getElementById('statsGrid').innerHTML = `
    ${statCard('Всего преподавателей', total, 'всего на кафедре','accent')}
    ${statCard('С научной степенью', withDegree, `${candidates} кандидат · ${doctors} доктор`,'green')}
    ${statCard('Докторов наук', doctors, 'высшая квалификация','amber')}
    ${statCard('С сертификатом', withCert, 'специалиста','accent')}
    ${statCard('Члены ассоциаций', inAssoc, 'проф. членство','green')}
  `;
 }
 function statCard(label,value,sub,cls){
  return `<div class="stat-card ${cls||''}"><div class="label">${label}</div><div class="value">${value}</div><div class="sub">${sub||''}</div></div>`;
 }
 /* ---------- Таблица (инлайн-редактирование) ---------- */
 function renderTable(){
  const head = document.getElementById('tableHead');
  const body = document.getElementById('tableBody');
  const empty = document.getElementById('emptyState');
  const fields = allFields();
  // Заголовок: все поля + колонка действий
  head.innerHTML = fields.map(f=>`<th>${esc(f.label)}${f.required?' <span class="req">*</span>':''}</th>`).join('') + '<th class="actions"></th>';
  const rows = filtered();
  if(rows.length===0){
    document.getElementById('teacherTable').style.display = state.teachers.length===0 ? 'none':'table';
    if(state.teachers.length!==0){
      empty.hidden=false; empty.querySelector('p').textContent='Ничего не найдено по фильтрам.';
      empty.querySelector('button').style.display='none';
    } else {
      empty.hidden=false; empty.querySelector('p').textContent='Пока нет ни одного преподавателя.';
      empty.querySelector('button').style.display='';
    }
    document.getElementById('countPill').textContent='';
    body.innerHTML='';
    return;
  }
  document.getElementById('teacherTable').style.display='table';
  empty.hidden=true;
  body.innerHTML = rows.map(t=>`
    <tr data-id="${t.id}">
      ${fields.map(f=>`<td>${cellInput(f,t)}</td>`).join('')}
      <td class="actions">
        <div class="row-actions">
          <button class="icon-btn" title="Скачать анкету (JSON)" onclick="exportTeacher('${t.id}')">⤓</button>
          <button class="icon-btn" title="Удалить" onclick="removeTeacher('${t.id}')">🗑</button>
        </div>
      </td>
    </tr>`).join('');
  document.getElementById('countPill').textContent = `Показано: ${rows.length} из ${state.teachers.length}`;
 }
 // Поле ввода прямо в ячейке таблицы
 function cellInput(f, t){
  const val = t[f.key] ?? '';
  const name = f.key;
  if(f.type==='textarea')
    return `<textarea class="cell-input" name="${name}" rows="2" placeholder="—">${esc(val)}</textarea>`;
  if(f.type==='date')
    return `<input class="cell-input" type="date" name="${name}" value="${esc(val)}">`;
  if(f.type==='number')
    return `<input class="cell-input" type="number" name="${name}" value="${esc(val)}" placeholder="—">`;
  if(f.type==='checkbox')
    return `<input class="cell-input check" type="checkbox" name="${name}" ${val===true||val==='true'?'checked':''}>`;
  if(f.type==='select')
    return `<input class="cell-input" list="dl_${name}" name="${name}" value="${esc(val)}" placeholder="выберите или введите">`;
  return `<input class="cell-input" type="text" name="${name}" value="${esc(val)}" placeholder="—">`;
 }
 // Один <datalist> на каждое поле-список (без дублей по строкам)
 function renderDatalists(){
  const box = document.getElementById('datalists');
  box.innerHTML = allFields().filter(f=>f.type==='select')
    .map(f=>`<datalist id="dl_${f.key}">${(f.options||[]).map(o=>`<option value="${esc(o)}">`).join('')}</datalist>`).join('');
 }
 // Автосохранение при вводе в любую ячейку
 let _saveTimer=null, _statTimer=null;
 function onCellInput(e){
  const el = e.target;
  if(!el.classList || !el.classList.contains('cell-input')) return;
  const tr = el.closest('tr'); if(!tr) return;
  const id = tr.dataset.id;
  const key = el.name;
  const t = state.teachers.find(x=>x.id===id); if(!t) return;
  t[key] = (el.type==='checkbox') ? el.checked : el.value;
  clearTimeout(_saveTimer); _saveTimer=setTimeout(save, 350);
  clearTimeout(_statTimer); _statTimer=setTimeout(()=>{
    renderStats();
    if(document.getElementById('tab-reports').classList.contains('active')) renderReports();
  }, 500);
 }
 // Добавить пустую строку-преподавателя
 function addRow(){
  const t = { id: uid() };
  allFields().forEach(f=>{ t[f.key] = (f.type==='checkbox') ? false : ''; });
  state.teachers.push(t);
  // сбросить фильтры, чтобы новая строка была видна
  filters = { search:'', degree:'', category:'', base:'' };
  document.getElementById('search').value='';
  ['filterDegree','filterCategory','filterBase'].forEach(id=>document.getElementById(id).value='');
  save(); buildFilterOptions(); renderTable(); renderStats();
  const tr = document.querySelector(`tr[data-id="${t.id}"]`);
  if(tr){ const inp = tr.querySelector('[name="fullName"]'); if(inp) inp.focus(); }
 }
 // Скачать анкету одного преподавателя (для отправки администратору)
 window.exportTeacher = function(id){
  const t = state.teachers.find(x=>x.id===id);
  if(!t) return;
  const data = { teachers:[{ ...t }], customFields: state.customFields };
  download(JSON.stringify(data, null, 2), `anketa_${(t.fullName||'prepodavatel').replace(/\s+/g,'_')}.json`, 'application/json');
 };
 function filtered(){
  return state.teachers.filter(t=>{
    if(filters.degree && t.academicDegree!==filters.degree) return false;
    if(filters.category && t.category!==filters.category) return false;
    if(filters.base && t.clinicalBase!==filters.base) return false;
    if(filters.search){
      const hay = [t.fullName,t.education,t.clinicalBase,t.associations,t.specialistCertificate,t.academicDegree,t.category]
        .filter(Boolean).join(' ').toLowerCase();
      if(!hay.includes(filters.search)) return false;
    }
    return true;
  });
 }
 window.removeTeacher = function(id){
  const t = state.teachers.find(x=>x.id===id);
  if(!t) return;
  if(confirm(`Удалить преподавателя «${t.fullName}»?`)){
    state.teachers = state.teachers.filter(x=>x.id!==id);
    save(); renderAll();
  }
 };
 /* ---------- Настройка полей ---------- */
 function openFields(){
  renderFieldList();
  document.getElementById('fieldsModal').hidden=false;
 }
 function closeFields(){ document.getElementById('fieldsModal').hidden=true; }
 function renderFieldList(){
  const list = document.getElementById('fieldList');
  list.innerHTML = allFields().map(f=>`
    <li class="field-item ${f.locked?'locked':''}">
      <div class="meta">
        <span class="lbl">${esc(f.label)} ${f.required?'<span class="req">*</span>':''}</span>
        <span class="typ">${fieldTypeName(f.type)}${f.locked?' · базовое':''}</span>
      </div>
      ${f.locked
        ? '<span class="del icon-btn" title="Нельзя удалить">🔒</span>'
        : `<button class="icon-btn del" title="Удалить" onclick="removeField('${f.key}')">🗑</button>`}
    </li>`).join('');
 }
 function fieldTypeName(t){
  return {text:'Текст',date:'Дата',number:'Число',select:'Список',textarea:'Длинный текст',checkbox:'Да/Нет'}[t]||t;
 }
 function addCustomField(){
  const label = document.getElementById('newFieldLabel').value.trim();
  const type = document.getElementById('newFieldType').value;
  const optsRaw = document.getElementById('newFieldOptions').value.trim();
  if(!label){ alert('Введите название поля'); return; }
  const key = 'c_'+label.toLowerCase().replace(/[^a-zа-я0-9]+/gi,'_').slice(0,24)+'_'+Math.random().toString(36).slice(2,5);
  const f = { key, label, type, locked:false };
  if(type==='select'){
    f.options = optsRaw ? optsRaw.split(',').map(s=>s.trim()).filter(Boolean) : [];
    if(f.options.length===0){ alert('Укажите варианты через запятую'); return; }
  }
  state.customFields.push(f);
  save();
  document.getElementById('newFieldLabel').value='';
  document.getElementById('newFieldOptions').value='';
  document.getElementById('newFieldOptions').hidden=true;
  renderFieldList();
  renderAll();
 }
 window.removeField = function(key){
  const f = state.customFields.find(x=>x.key===key);
  if(!f) return;
  if(!confirm(`Удалить поле «${f.label}»? Значения этого поля у всех преподавателей будут потеряны.`)) return;
  state.customFields = state.customFields.filter(x=>x.key!==key);
  state.teachers.forEach(t=>{ delete t[key]; });
  save(); renderFieldList(); renderAll();
 };
 /* ---------- Отчёты (многопараметрические) ---------- */
 let reportSelected = new Set(['academicDegree','category']); // выбранные по умолчанию
 function renderReportFieldsList(){
  const box = document.getElementById('reportFieldsList');
  const fields = allFields().filter(f=>f.type!=='textarea');
  box.innerHTML = fields.map(f=>`
    <label class="rf-item">
      <input type="checkbox" ${reportSelected.has(f.key)?'checked':''} onchange="toggleReportField('${f.key}', this.checked)">
      ${esc(f.label)}
    </label>`).join('');
 }
 window.toggleReportField = function(key, on){
  if(on) reportSelected.add(key); else reportSelected.delete(key);
  renderReports();
 };
 function valNorm(t, f){
  let v = t[f.key];
  if(f.type==='checkbox') v = v ? 'Да':'Нет';
  if(v===undefined||v===null||v==='') v='(не указано)';
  return v;
 }
 function renderReports(){
  const grid = document.getElementById('reportGrid');
  const cross = document.getElementById('crosstabWrap');
  const summary = document.getElementById('reportSummary');
  if(state.teachers.length===0){
    grid.innerHTML=''; cross.innerHTML=''; summary.innerHTML='<p>Нет данных для отчёта.</p>'; return;
  }
  const fields = allFields();
  const selected = fields.filter(f=>reportSelected.has(f.key) && f.type!=='textarea');
  // 1. Карточки распределения по каждому выбранному параметру
  grid.innerHTML = selected.length
    ? selected.map(distributionCard).join('')
    : '<p class="hint">Отметьте параметры выше, чтобы построить отчёт.</p>';
  // 2. Перекрёстная таблица по первым двум выбранным параметрам
  cross.innerHTML = (selected.length>=2) ? crosstabHTML(selected[0], selected[1]) : '';
  // 3. Сводка
  const total = state.teachers.length;
  const withDegree = state.teachers.filter(t=>t.academicDegree && t.academicDegree!=='Нет').length;
  const pct = total?Math.round(withDegree/total*100):0;
  summary.innerHTML = `
    <h3>Сводка</h3>
    <p>Всего преподавателей: <span class="big">${total}</span></p>
    <p>С научной степенью: <b>${withDegree}</b> (${pct}%)</p>
    <p>Параметров в отчёте: <b>${selected.length}</b>${selected.length>=2?` · перекрёстная таблица: ${esc(selected[0].label)} × ${esc(selected[1].label)}`:''}</p>
    <p class="hint" style="margin-top:10px">Отметьте несколько параметров выше — по каждому будет свой график, а по первым двум — перекрёстная таблица. Отчёт скачивается в CSV целиком.</p>`;
 }
 function distributionCard(f){
  const groups = {};
  state.teachers.forEach(t=>{ const v=valNorm(t,f); groups[v]=(groups[v]||0)+1; });
  const entries = Object.entries(groups).sort((a,b)=>b[1]-a[1]);
  const max = Math.max(1, ...entries.map(e=>e[1]));
  return `<div class="report-card">
    <h3>${esc(f.label)} — распределение</h3>
    ${entries.map(([label,count])=>`
      <div class="report-bar">
        <span class="bar-label">${esc(label)}</span>
        <span class="bar-track"><span class="bar-fill" style="width:${Math.round(count/max*100)}%"></span></span>
        <span class="bar-count">${count}</span>
      </div>`).join('')}
  </div>`;
 }
 function crosstabHTML(fa, fb){
  const rows=[], cols=[], m={};
  state.teachers.forEach(t=>{
    const a=valNorm(t,fa), b=valNorm(t,fb);
    if(!rows.includes(a)) rows.push(a);
    if(!cols.includes(b)) cols.push(b);
    m[a]=m[a]||{}; m[a][b]=(m[a][b]||0)+1;
  });
  const colTotals = cols.map(c=>rows.reduce((s,r)=>s+(m[r][c]||0),0));
  const grand = colTotals.reduce((s,x)=>s+x,0);
  return `<div class="crosstab">
    <h3>Перекрёстная таблица: ${esc(fa.label)} × ${esc(fb.label)}</h3>
    <div class="table-wrap">
      <table class="pivot">
        <thead><tr><th>${esc(fa.label)} \\ ${esc(fb.label)}</th>${cols.map(c=>`<th>${esc(c)}</th>`).join('')}<th>Всего</th></tr></thead>
        <tbody>
          ${rows.map(r=>{
            const rowTotal=cols.reduce((s,c)=>s+(m[r][c]||0),0);
            return `<tr><td>${esc(r)}</td>${cols.map(c=>`<td>${m[r][c]||0}</td>`).join('')}<td class="tot">${rowTotal}</td></tr>`;
          }).join('')}
          <tr class="total-row"><td>Всего</td>${colTotals.map(c=>`<td class="tot">${c}</td>`).join('')}<td class="tot">${grand}</td></tr>
        </tbody>
      </table>
    </div>
  </div>`;
 }
 /* ---------- Экспорт / Импорт ---------- */
 function exportCSV(){
  if(state.teachers.length===0){ alert('Нет данных для экспорта'); return; }
  const fields = allFields();
  const header = fields.map(f=>f.label);
  const rows = state.teachers.map(t=>{
    return fields.map(f=>{
      let v = t[f.key] ?? '';
      if(f.type==='checkbox') v = v?'Да':'Нет';
      return csvCell(v);
    });
  });
  const csv = '\uFEFF' + [header.map(csvCell).join(';')].concat(rows.map(r=>r.join(';'))).join('\r\n');
  download(csv, 'prepodavateli.csv', 'text/csv;charset=utf-8');
 }
 function exportReportCSV(){
  const fields = allFields();
  const selected = fields.filter(f=>reportSelected.has(f.key) && f.type!=='textarea');
  if(selected.length===0){ alert('Отметьте хотя бы один параметр отчёта'); return; }
  if(state.teachers.length===0){ alert('Нет данных для отчёта'); return; }
  const lines = [];
  selected.forEach(f=>{
    const groups = {};
    state.teachers.forEach(t=>{ const v=valNorm(t,f); groups[v]=(groups[v]||0)+1; });
    const entries = Object.entries(groups).sort((a,b)=>b[1]-a[1]);
    lines.push(`Отчёт по параметру: ${f.label}`);
    lines.push(`${csvCell('Значение')};${csvCell('Количество')}`);
    entries.forEach(([v,c])=>lines.push(`${csvCell(v)};${c}`));
    lines.push(''); // пустая строка-разделитель
  });
  // Перекрёстная таблица по первым двум параметрам
  if(selected.length>=2){
    const fa=selected[0], fb=selected[1];
    const rows=[], cols=[], m={};
    state.teachers.forEach(t=>{
      const a=valNorm(t,fa), b=valNorm(t,fb);
      if(!rows.includes(a)) rows.push(a);
      if(!cols.includes(b)) cols.push(b);
      m[a]=m[a]||{}; m[a][b]=(m[a][b]||0)+1;
    });
    lines.push(`Перекрёстная таблица: ${fa.label} × ${fb.label}`);
    lines.push([csvCell(fa.label+' \\ '+fb.label)].concat(cols.map(csvCell)).concat([csvCell('Всего')]).join(';'));
    rows.forEach(r=>{
      const rowTotal=cols.reduce((s,c)=>s+(m[r][c]||0),0);
      lines.push([csvCell(r)].concat(cols.map(c=>m[r][c]||0)).concat([rowTotal]).join(';'));
    });
    const colTotals=cols.map(c=>rows.reduce((s,r)=>s+(m[r][c]||0),0));
    const grand=colTotals.reduce((s,x)=>s+x,0);
    lines.push([csvCell('Всего')].concat(colTotals).concat([grand]).join(';'));
  }
  const csv = '\uFEFF' + lines.join('\r\n');
  download(csv, 'otchet.csv', 'text/csv;charset=utf-8');
 }
 function csvCell(v){
  const s = String(v==null?'':v);
  if(/[;"\n]/.test(s)) return '"'+s.replace(/"/g,'""')+'"';
  return s;
 }
 function importJSON(e){
  const file = e.target.files[0];
  if(!file) return;
  const reader = new FileReader();
  reader.onload = ev=>{
    try{
      const parsed = JSON.parse(ev.target.result);
      // Нормализация: принимаем {teachers:[...]}, [...] или один объект-преподаватель
      let incoming = [], extraFields = [];
      if(Array.isArray(parsed)) incoming = parsed;
      else if(Array.isArray(parsed.teachers)) { incoming = parsed.teachers; extraFields = parsed.customFields || []; }
      else if(parsed && typeof parsed==='object') incoming = [parsed];
      else throw new Error('Не распознан формат файла');
      incoming = incoming.filter(t=>t && typeof t==='object');
      if(incoming.length===0) throw new Error('В файле нет данных преподавателей');
      // Слияние пользовательских полей
      extraFields.forEach(f=>{ if(f && f.key && !allFields().some(x=>x.key===f.key)) state.customFields.push(f); });
      // Добавляем преподавателей, пропуская дубли по ФИО
      const existing = new Set(state.teachers.map(t=>(t.fullName||'').trim().toLowerCase()));
      let added = 0, skipped = 0;
      incoming.forEach(t=>{
        const name = (t.fullName||'').trim().toLowerCase();
        if(name && existing.has(name)){ skipped++; return; }
        const obj = { id: uid() };
        allFields().forEach(f=>{ obj[f.key] = t[f.key] ?? (f.type==='checkbox'? false : ''); });
        state.teachers.push(obj);
        existing.add(name);
        added++;
      });
      save(); renderAll();
      alert(`Добавлено: ${added}${skipped?`, пропущено дублей по ФИО: ${skipped}`:''}.`);
    }catch(err){ alert('Ошибка импорта: '+err.message); }
  };
  reader.readAsText(file);
  e.target.value='';
 }
 function download(content, filename, type){
  const blob = new Blob([content], {type});
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href=url; a.download=filename; a.click();
  URL.revokeObjectURL(url);
 }
 // Кнопка экспорта всей БД в JSON (резервная копия) — добавим в экспорт-меню через длинное нажатие не нужно; сделаем просто
 function exportBackup(){
  download(JSON.stringify({teachers:state.teachers, customFields:state.customFields}, null, 2), 'backup_dashboard.json', 'application/json');
 }
 /* ---------- Утилиты ---------- */
 function esc(s){
  return String(s==null?'':s).replace(/[&<>"']/g, c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
 }
 /* ---------- Старт ---------- */
 // Резервная копия (JSON) — по двойному клику на кнопке "Экспорт CSV"
 const _btnExport = document.getElementById('btnExport');
 if(_btnExport){ _btnExport.title='Одинарный клик — CSV, двойной — резервная копия JSON'; _btnExport.addEventListener('dblclick', exportBackup); }
 init();
--- a/design.md
+++ b/design.md
@ -1,110 +0,0 @@
 <!-- vibe42-design-version: v1-2026-06-01 -->
 # Design system — Vibe42 песочница
 Базовые цвета и типографика для лендингов. Можно отклоняться, но начинай с этого.
 ## Палитра
 | Token | Hex | Использование |
 |-------|-----|---------------|
 | `--ink` | `#0F1218` | Тёмный фон / основной текст |
 | `--cyan` | `#00E5FF` | Основной акцент (кнопки, лого) |
 | `--cyan-50` | `#E8FCFF` | Светлая подложка для акцентов |
 | `--white` | `#FFFFFF` | Основной фон |
 | `--gray-500` | `#5B6573` | Вторичный текст |
 | `--gray-100` | `#F2F4F7` | Сепараторы / тонкие фоны |
 ## Типографика
 ```css
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, system-ui, sans-serif;
 ```
 | Уровень | Размер | Вес | line-height |
 |---------|--------|-----|-------------|
 | h1 (hero) | 56px | 800 | 1.05 |
 | h2 (section) | 36px | 700 | 1.15 |
 | h3 | 22px | 700 | 1.3 |
 | body | 17px | 400 | 1.6 |
 | small | 14px | 400 | 1.5 |
 На мобиле — h1 уменьши до 36px, h2 до 28px.
 ## Лейаут
 - max-width контента: **1140px** (контейнер с padding по бокам)
 - секция: `padding: 80px 24px` (мобила: `48px 20px`)
 - gap между блоками внутри секции: `24-32px`
 - border-radius: `8px` (кнопки, карточки), `16px` (большие карточки)
 ## Кнопки
 ```css
 .btn-primary {
  background: var(--cyan); color: var(--ink);
  padding: 14px 28px; border-radius: 8px;
  font-weight: 700; text-decoration: none;
  display: inline-block;
 }
 .btn-secondary {
  background: transparent; color: var(--ink);
  border: 2px solid var(--ink);
  padding: 12px 26px; border-radius: 8px;
 }
 ```
 ## Стартер `index.html`
 ```html
 <!DOCTYPE html>
 <html lang="ru">
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width,initial-scale=1">
 <title>Мой проект</title>
 <style>
 :root{--ink:#0F1218;--cyan:#00E5FF;--cyan-50:#E8FCFF;--white:#fff;--gray-500:#5B6573;--gray-100:#F2F4F7}
 *{box-sizing:border-box;margin:0;padding:0}
 body{font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;color:var(--ink);background:var(--white)}
 .container{max-width:1140px;margin:0 auto;padding:80px 24px}
 .hero{background:var(--ink);color:var(--white)}
 .hero h1{font-size:56px;font-weight:800;line-height:1.05;margin-bottom:24px}
 .hero p{font-size:20px;color:#9aa3b2;max-width:600px;margin-bottom:32px}
 .btn{display:inline-block;background:var(--cyan);color:var(--ink);padding:14px 28px;border-radius:8px;font-weight:700;text-decoration:none}
 .btn:hover{background:#1be5ff}
 .section h2{font-size:36px;font-weight:700;margin-bottom:24px}
 .card{background:var(--gray-100);border-radius:16px;padding:32px;margin-bottom:16px}
@media (max-width:640px){.hero h1{font-size:36px}.section h2{font-size:28px}.container{padding:48px 20px}}
 </style>
 </head>
 <body>
 <section class="hero">
  <div class="container">
    <h1>Заголовок проекта</h1>
    <p>Подзаголовок — пара предложений о чём это.</p>
    <a class="btn" href="#section">Начать</a>
  </div>
 </section>
 <section id="section" class="section">
  <div class="container">
    <h2>Секция</h2>
    <div class="card">Контент карточки.</div>
    <div class="card">Контент карточки.</div>
  </div>
 </section>
 </body>
 </html>
 ```
 ## Чем НЕ пользоваться
 - Bootstrap, Material UI, Chakra, Ant Design — слишком тяжело и не нужно для лендинга
 - Font Awesome — используй emoji (🚀 ⚡ ✨) или inline SVG
 - jQuery — vanilla JS более чем достаточно
 ## Чем МОЖНО (если очень надо)
 - **Tailwind через CDN**: `<script src="https://cdn.tailwindcss.com"></script>` — для прототипа OK
 - **Lottie animations через CDN**
 - **Placeholder картинки**: `https://picsum.photos/800/600`, `https://placehold.co/600x400`
 - **Шрифты Google Fonts через `<link>`** в head
--- a/index.html
+++ b/index.html
@ -1,113 +0,0 @@
 <!DOCTYPE html>
 <html lang="ru">
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width,initial-scale=1">
 <title>Дашборд кафедры — преподаватели</title>
 <link rel="stylesheet" href="styles.css">
 </head>
 <body>
 <header class="topbar">
  <div class="topbar-inner">
    <div class="brand">
      <div class="brand-mark">៛</div>
      <div>
        <h1>Клиническая кафедра</h1>
        <p class="brand-sub">Дашборд преподавателей</p>
      </div>
    </div>
    <div class="topbar-actions">
      <button class="btn ghost" id="btnFields">⚙ Настроить поля</button>
      <button class="btn ghost" id="btnExport">⤓ Экспорт CSV</button>
      <button class="btn ghost" id="btnImport">⤒ Импорт</button>
      <button class="btn primary" id="btnAdd">+ Преподаватель</button>
    </div>
  </div>
 </header>
 <nav class="tabs">
  <div class="container">
    <button class="tab active" data-tab="teachers">Преподаватели</button>
    <button class="tab" data-tab="reports">Отчёты</button>
  </div>
 </nav>
 <main class="container">
  <!-- ===== Вкладка: Преподаватели ===== -->
  <section id="tab-teachers" class="tabpanel active">
    <div class="stats-grid" id="statsGrid"></div>
    <div class="toolbar">
      <input type="search" id="search" class="input" placeholder="🔍 Поиск по ФИО, образованию, базе…">
      <select id="filterDegree" class="input"></select>
      <select id="filterCategory" class="input"></select>
      <select id="filterBase" class="input"></select>
      <span class="count-pill" id="countPill"></span>
    </div>
    <div class="table-wrap">
      <table class="data-table" id="teacherTable">
        <thead><tr id="tableHead"></tr></thead>
        <tbody id="tableBody"></tbody>
      </table>
      <div class="empty-state" id="emptyState" hidden>
        <p>Пока нет ни одного преподавателя.</p>
        <button class="btn primary" onclick="addRow()">+ Добавить первого</button>
      </div>
    </div>
    <p class="info-banner">ℹ Данные сохраняются в этом браузере. Чтобы собрать анкеты нескольких преподавателей: каждый вводит свою строку и жмёт <b>⤓</b> в конце строки → отправляет файл вам → вы жмёте <b>⤒ Импорт</b> (данные добавятся к таблице).</p>
  </section>
  <!-- ===== Вкладка: Отчёты ===== -->
  <section id="tab-reports" class="tabpanel">
    <div class="report-controls">
      <div class="report-fields">
        <span class="rf-title">Параметры отчёта — отметьте несколько:</span>
        <div class="rf-list" id="reportFieldsList"></div>
      </div>
      <button class="btn outline" id="btnReportCsv">⤓ Скачать отчёт (CSV)</button>
    </div>
    <div class="report-grid" id="reportGrid"></div>
    <div class="crosstab-wrap" id="crosstabWrap"></div>
    <div class="report-summary" id="reportSummary"></div>
  </section>
 </main>
 <!-- ===== Модалка: настройка полей ===== -->
 <div class="modal-overlay" id="fieldsModal" hidden>
  <div class="modal">
    <div class="modal-head">
      <h2>Параметры преподавателя</h2>
      <button class="icon-btn" onclick="closeFields()">✕</button>
    </div>
    <div class="modal-body">
      <p class="hint">Базовые поля нельзя удалить. Ниже — дополнительные параметры, которые вы добавляете сами.</p>
      <ul class="field-list" id="fieldList"></ul>
      <div class="field-adder">
        <h3>Добавить параметр</h3>
        <div class="row">
          <input type="text" id="newFieldLabel" class="input" placeholder="Название (напр. Стаж работы)">
          <select id="newFieldType" class="input">
            <option value="text">Текст</option>
            <option value="date">Дата</option>
            <option value="number">Число</option>
            <option value="select">Выпадающий список</option>
            <option value="textarea">Длинный текст</option>
            <option value="checkbox">Да/Нет</option>
          </select>
        </div>
        <input type="text" id="newFieldOptions" class="input" placeholder="Варианты через запятую (только для списка)" hidden>
        <button class="btn primary" id="btnAddField">+ Добавить поле</button>
      </div>
    </div>
  </div>
 </div>
 <input type="file" id="importFile" accept="application/json" hidden>
 <div id="datalists" hidden></div>
 <script src="app.js"></script>
 </body>
 </html>
--- a/styles.css
+++ b/styles.css
@ -1,203 +0,0 @@
 :root{
  --ink:#0F1218;
  --cyan:#00B8D4;
  --cyan-strong:#0891B2;
  --cyan-50:#E8FCFF;
  --white:#fff;
  --gray-900:#1A2030;
  --gray-700:#3C4658;
  --gray-500:#5B6573;
  --gray-300:#C9D0DB;
  --gray-100:#F2F4F7;
  --gray-50:#F8FAFC;
  --green:#16A34A;
  --green-50:#DCFCE7;
  --amber:#D97706;
  --amber-50:#FEF3C7;
  --red:#DC2626;
  --red-50:#FEE2E2;
  --border:#E2E8F0;
  --shadow:0 1px 3px rgba(15,18,24,.08), 0 1px 2px rgba(15,18,24,.04);
  --shadow-lg:0 12px 32px rgba(15,18,24,.18);
  --radius:10px;
 }
 *{box-sizing:border-box;margin:0;padding:0}
 html,body{height:100%}
 body{
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  color:var(--ink);background:var(--gray-50);
 }
 .container{max-width:1280px;margin:0 auto;padding:0 24px}
 /* ===== Topbar ===== */
 .topbar{background:var(--ink);color:#fff;box-shadow:var(--shadow)}
 .topbar-inner{max-width:1280px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
 .brand{display:flex;align-items:center;gap:14px}
 .brand-mark{width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,var(--cyan),var(--cyan-strong));display:grid;place-items:center;font-size:24px;font-weight:800;color:var(--ink)}
 .topbar h1{font-size:20px;font-weight:800;line-height:1.2}
 .brand-sub{font-size:13px;color:#9aa3b2}
 .topbar-actions{display:flex;gap:8px;flex-wrap:wrap}
 /* ===== Buttons ===== */
 .btn{
  font:inherit;font-weight:600;font-size:14px;cursor:pointer;
  padding:10px 16px;border-radius:8px;border:1px solid transparent;
  display:inline-flex;align-items:center;gap:6px;transition:.15s;white-space:nowrap;
 }
 .btn.primary{background:var(--cyan-strong);color:#fff}
 .btn.primary:hover{background:#0E7490}
 .btn.ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.18)}
 .btn.ghost:hover{background:rgba(255,255,255,.16)}
 .btn.outline{background:transparent;color:var(--ink);border:1px solid var(--border)}
 .btn.outline:hover{background:var(--gray-100)}
 .btn.danger{background:var(--red);color:#fff}
 .btn.danger:hover{background:#B91C1C}
 .btn.dark{background:var(--ink);color:#fff}
 .btn.dark:hover{background:#000}
 .icon-btn{background:none;border:none;font-size:18px;cursor:pointer;color:var(--gray-500);padding:4px 8px;border-radius:6px}
 .icon-btn:hover{background:var(--gray-100)}
 /* ===== Tabs ===== */
 .tabs{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
 .tab{
  background:none;border:none;cursor:pointer;font:inherit;font-weight:600;font-size:15px;
  padding:16px 20px;color:var(--gray-500);border-bottom:2px solid transparent;
 }
 .tab:hover{color:var(--ink)}
 .tab.active{color:var(--cyan-strong);border-bottom-color:var(--cyan-strong)}
 .tabpanel{display:none;padding:28px 0 60px}
 .tabpanel.active{display:block}
 /* ===== Inputs ===== */
 .input{
  font:inherit;font-size:14px;padding:9px 12px;border:1px solid var(--border);
  border-radius:8px;background:#fff;color:var(--ink);width:100%;
 }
 .input:focus{outline:none;border-color:var(--cyan-strong);box-shadow:0 0 0 3px var(--cyan-50)}
 select.input{cursor:pointer}
 textarea.input{resize:vertical;min-height:80px;line-height:1.5}
 /* ===== Stats ===== */
 .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:24px}
 .stat-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
 .stat-card .label{font-size:12px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
 .stat-card .value{font-size:30px;font-weight:800;line-height:1}
 .stat-card .sub{font-size:12px;color:var(--gray-500);margin-top:6px}
 .stat-card.accent{border-left:4px solid var(--cyan-strong)}
 .stat-card.green{border-left:4px solid var(--green)}
 .stat-card.amber{border-left:4px solid var(--amber)}
 /* ===== Toolbar ===== */
 .toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
 .toolbar .input{width:auto;min-width:180px;flex:1}
 .toolbar select.input{flex:0 0 auto;min-width:150px}
 .count-pill{margin-left:auto;font-size:13px;color:var(--gray-500);background:var(--gray-100);padding:6px 12px;border-radius:20px;font-weight:600}
 /* ===== Table ===== */
 .table-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:auto;box-shadow:var(--shadow)}
 .data-table{width:100%;min-width:1120px;border-collapse:collapse;font-size:13px}
 .data-table thead{background:var(--gray-50)}
 .data-table th{
  text-align:left;padding:12px 14px;font-size:12px;font-weight:700;color:var(--gray-500);
  text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);white-space:nowrap;
 }
 .data-table td{padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:top}
 .data-table tbody tr:last-child td{border-bottom:none}
 .data-table tbody tr:hover{background:var(--cyan-50)}
 .data-table .name-cell{font-weight:700;color:var(--ink)}
 .data-table .actions{white-space:nowrap;text-align:right}
 .row-actions{display:inline-flex;gap:4px}
 /* инлайн-ячейки */
 .cell-input{
  width:100%;border:1px solid transparent;background:transparent;
  font:inherit;font-size:13px;padding:6px 8px;border-radius:6px;color:var(--ink);
 }
 .cell-input:focus{outline:none;border-color:var(--cyan-strong);background:#fff;box-shadow:0 0 0 2px var(--cyan-50)}
 .cell-input::placeholder{color:var(--gray-300)}
 textarea.cell-input{resize:vertical;min-height:38px;line-height:1.4}
 .cell-input.check{width:auto;cursor:pointer}
 .col-degree,.col-category{min-width:150px}
 .col-name{min-width:200px}
 .col-edu{min-width:240px}
 .info-banner{font-size:12.5px;color:var(--gray-500);background:var(--cyan-50);border:1px solid #b6eef7;border-radius:8px;padding:10px 14px;margin-top:14px;line-height:1.5}
 .info-banner b{color:var(--cyan-strong)}
 .badge{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--gray-100);color:var(--gray-700)}
 .badge.green{background:var(--green-50);color:var(--green)}
 .badge.amber{background:var(--amber-50);color:var(--amber)}
 .badge.cyan{background:var(--cyan-50);color:var(--cyan-strong)}
 .badge.red{background:var(--red-50);color:var(--red)}
 .empty-state{text-align:center;padding:60px 20px;color:var(--gray-500)}
 .empty-state .btn{margin-top:16px}
 /* ===== Modal ===== */
 .modal-overlay{
  position:fixed;inset:0;background:rgba(15,18,24,.55);backdrop-filter:blur(2px);
  z-index:100;display:grid;place-items:center;padding:20px;overflow-y:auto;
 }
 .modal-overlay[hidden]{display:none}
 .modal{background:#fff;border-radius:14px;width:100%;max-width:680px;box-shadow:var(--shadow-lg);max-height:92vh;display:flex;flex-direction:column}
 .modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border)}
 .modal-head h2{font-size:18px;font-weight:700}
 .modal-body{padding:20px 24px;overflow-y:auto}
 .modal-foot{display:flex;gap:10px;justify-content:flex-end;padding:16px 24px;border-top:1px solid var(--border);background:var(--gray-50)}
 .modal-foot .danger{margin-right:auto}
 .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
 .form-field{display:flex;flex-direction:column;gap:6px}
 .form-field.full{grid-column:1/-1}
 .form-field label{font-size:13px;font-weight:600;color:var(--gray-700)}
 .form-field .req{color:var(--red)}
 .form-field .hint{font-size:12px;color:var(--gray-500)}
 .form-error{color:var(--red);font-size:13px;margin-top:8px}
 /* ===== Fields config ===== */
 .hint{font-size:13px;color:var(--gray-500);margin-bottom:14px}
 .field-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
 .field-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--gray-50);border:1px solid var(--border);border-radius:8px}
 .field-item .meta{display:flex;flex-direction:column;gap:2px}
 .field-item .meta .lbl{font-weight:600;font-size:14px}
 .field-item .meta .typ{font-size:12px;color:var(--gray-500)}
 .field-item.locked .del{opacity:.4;cursor:not-allowed}
 .field-adder{border-top:1px dashed var(--border);padding-top:18px}
 .field-adder h3{font-size:15px;margin-bottom:12px}
 .row{display:flex;gap:10px;margin-bottom:10px}
 .field-adder .btn{margin-top:6px}
 /* ===== Reports ===== */
 .report-controls{display:flex;flex-direction:column;gap:14px;margin-bottom:22px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;box-shadow:var(--shadow)}
 .report-fields{display:flex;flex-direction:column;gap:8px}
 .rf-title{font-size:14px;font-weight:600;color:var(--gray-700)}
 .rf-list{display:flex;flex-wrap:wrap;gap:8px}
 .rf-item{display:inline-flex;align-items:center;gap:7px;font-size:14px;cursor:pointer;background:var(--gray-50);border:1px solid var(--border);padding:6px 12px;border-radius:8px;user-select:none}
 .rf-item input{cursor:pointer;accent-color:var(--cyan-strong)}
 .rf-item:has(input:checked){background:var(--cyan-50);border-color:var(--cyan-strong)}
 .report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:24px}
 .report-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
 .report-card h3{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);margin-bottom:14px}
 .report-bar{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:14px}
 .report-bar .bar-track{flex:1;height:10px;background:var(--gray-100);border-radius:6px;overflow:hidden}
 .report-bar .bar-fill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--cyan-strong));border-radius:6px;min-width:2px}
 .report-bar .bar-label{min-width:120px;color:var(--gray-700)}
 .report-bar .bar-count{font-weight:700;min-width:36px;text-align:right}
 .report-summary{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;box-shadow:var(--shadow)}
 .report-summary h3{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);margin-bottom:12px}
 .report-summary p{font-size:15px;line-height:1.7}
 .report-summary .big{font-size:22px;font-weight:800;color:var(--cyan-strong)}
 .crosstab-wrap{margin-bottom:24px}
 .crosstab{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
 .crosstab h3{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);margin-bottom:14px}
 .pivot{width:100%;border-collapse:collapse;font-size:13px}
 .pivot th,.pivot td{padding:8px 12px;border:1px solid var(--border);text-align:center;white-space:nowrap}
 .pivot th:first-child,.pivot td:first-child{text-align:left;font-weight:600}
 .pivot thead th{background:var(--gray-50);font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--gray-500)}
 .pivot .tot{font-weight:700;background:var(--gray-50)}
 .pivot tr.total-row td{font-weight:700;background:var(--gray-100)}
@media (max-width:760px){
  .topbar h1{font-size:17px}
  .form-grid{grid-template-columns:1fr}
  .toolbar .input{min-width:140px}
  .data-table{font-size:13px}
  .data-table th,.data-table td{padding:10px 8px}
 }