/* @boog-ui-start */
:root {
  /* ── Neutral ramp (slate) ─────────────────────── */
  --slate-50:#f6f8fb; --slate-100:#eef1f6; --slate-200:#e4e8ef;
  --slate-300:#cbd3e0; --slate-400:#94a1b8; --slate-450:#8794ac; --slate-500:#64748b;
  --slate-600:#475569; --slate-700:#334155; --slate-800:#1e293b; --slate-900:#0f172a;
  /* ── Brand (indigo) ───────────────────────────── */
  --indigo-50:#eef0ff; --indigo-100:#e0e3ff; --indigo-400:#7b7ef0;
  --indigo-500:#5b5de9; --indigo-600:#4a4cd6; --indigo-700:#3d3fb8;
  /* ── Brand mark (логотип BOOG — .loader-boog/монограмма) ──
     Не семантическая роль: цвета самого знака, не перекрашиваются темой. */
  --brand-logo-blue:#6669ee; --brand-logo-red:#ef6d83; --brand-logo-ink:#5b5de9;
  /* ── Semantic color roles ─────────────────────── */
  --color-bg: var(--slate-50);
  --color-surface:#ffffff;
  --color-surface-2: var(--slate-100);
  --color-border: var(--slate-200);
  --color-text: var(--slate-900);
  --color-muted: var(--slate-500);
  /* Неактивная часть шкалы прогресса (ненаступивший шаг, соединитель). Отдельная роль,
     а не --color-border: волоску-границе хватает 1.15:1, а самостоятельной фигуре нужно ≥3:1.
     --slate-450 даёт 3.06:1 к белому — читается даже на точке 8px. */
  --color-track: var(--slate-450);
  --color-accent: var(--indigo-500);
  --color-accent-hover: var(--indigo-600);
  --color-accent-active: var(--indigo-700);
  --color-accent-weak: var(--indigo-50);
  --color-on-accent:#ffffff;
  --color-on-inverse:#ffffff;
  --color-success:#16a34a; --color-success-weak:#e7f6ec;
  --color-warning:#d97706; --color-warning-weak:#fdf1e3;
  --color-danger:#dc2626;  --color-danger-weak:#fdecec;
  --color-info:#2563eb;    --color-info-weak:#e8f0fe;
  --color-purple:#7c3aed;  --color-purple-weak:#f1ebfe;
  /* ── "Усиленные" тона для текста метки (.chip) на светлой заливке ──
     Тот же оттенок, что и у основного тона, но темнее: измерением в браузере
     (канвас, реальный отрисованный пиксель, не разбор строки цвета) базовые
     --color-success/-warning/-danger/-accent на своих -weak фонах дают контраст
     текста 2.71-4.43 при норме 4.5 для текста 12pt. Эти токены используются
     только там, где текст стоит на -weak фоне (метка); заливка кнопок, точки
     статусов и прочие места с базовым тоном не трогаем - там другая контрастная
     пара (белый текст на насыщенном фоне), там норма уже выполняется. */
  --color-success-strong:#117f3a;
  --color-warning-strong:#a75c05;
  --color-danger-strong:#d52222;
  --color-accent-strong:#595be9;
  --color-purple-strong:#7c3aed;
  /* ── Кластеры компетенций (9 тонов) ────────────
     Компетенция всюду красится цветом своего кластера. Задаются здесь, чтобы
     работать в любой теме; .theme-pastel переопределяет 6 из них своими якорями.
     --cluster-N — насыщенный тон: ТОЛЬКО иконка/точка/текст. Заливка плашки —
     --cluster-N-weak, контур --cluster-N-weak-line: насыщенный тон совпадает с
     языком действий (кнопка/фокус), и данные сливаются с органами управления.
     Отдельное семейство, а не статусные роли: иначе компетенция читается как
     «успех»/«ошибка».
     Имена кластеров (ADR-042) — справочно; источник правды связи «кластер → цвет»
     сервис компетенций. 1–4 когнитивные, 5–9 человеческие.
     @cluster 1 Исследование и понимание
     @cluster 2 Проектирование решения
     @cluster 3 Критическое суждение
     @cluster 4 Организация работы
     @cluster 5 Сотрудничество
     @cluster 6 Влияние
     @cluster 7 Лидерство
     @cluster 8 Саморегуляция
     @cluster 9 Саморазвитие и рефлексия */
  --cluster-1: oklch(0.55 0.15 235); --cluster-2: oklch(0.56 0.16 305);
  --cluster-3: oklch(0.56 0.15 340); --cluster-4: oklch(0.56 0.15 150);
  --cluster-5: oklch(0.55 0.14 195); --cluster-6: oklch(0.55 0.15 270);
  --cluster-7: oklch(0.56 0.15 13);  --cluster-8: oklch(0.64 0.14 105);
  --cluster-9: oklch(0.60 0.15 70);
  --cluster-1-weak: oklch(0.93 0.05 235); --cluster-2-weak: oklch(0.93 0.05 305);
  --cluster-3-weak: oklch(0.93 0.05 340); --cluster-4-weak: oklch(0.93 0.05 150);
  --cluster-5-weak: oklch(0.93 0.05 195); --cluster-6-weak: oklch(0.93 0.05 270);
  --cluster-7-weak: oklch(0.93 0.05 13);  --cluster-8-weak: oklch(0.93 0.05 105);
  --cluster-9-weak: oklch(0.93 0.05 70);
  --cluster-1-weak-line: oklch(0.84 0.09 235); --cluster-2-weak-line: oklch(0.84 0.09 305);
  --cluster-3-weak-line: oklch(0.84 0.09 340); --cluster-4-weak-line: oklch(0.84 0.09 150);
  --cluster-5-weak-line: oklch(0.84 0.09 195); --cluster-6-weak-line: oklch(0.84 0.09 270);
  --cluster-7-weak-line: oklch(0.84 0.09 13);  --cluster-8-weak-line: oklch(0.84 0.09 105);
  --cluster-9-weak-line: oklch(0.84 0.09 70);
  /* ── Spacing (4px base) ───────────────────────── */
  --space-05:2px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  --space-12:48px; --space-16:64px;
  /* ── Radius ───────────────────────────────────── */
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:20px; --radius-pill:999px;
  /* ── Elevation ────────────────────────────────── */
  --elev-1:0 1px 2px rgba(15,23,42,.06);
  --elev-2:0 4px 12px rgba(15,23,42,.08);
  --elev-3:0 12px 28px rgba(15,23,42,.12);
  --elev-4:0 24px 48px rgba(15,23,42,.16);
  /* ── Sizes (control-internal) ─────────────────── */
  --size-thumb:16px; --border-thin:1.5px; --border-thick:2px; --size-icon:18px;
  --size-badge-sm:26px; --size-badge-round:30px;
  /* Минимальный размер цели касания (44px) - общепринятая норма (Apple HIG,
     Material Design) для элементов, по которым попадают пальцем не глядя. */
  --size-touch:44px;
  /* Боковая навигация приложения. 256px = --space-16 * 4 — единственная ширина,
     точно ложащаяся на шкалу отступов. До канона расходились: Слайдер 240px,
     админка биллинга 256px (Tailwind w-64). Документные страницы (оферта и пр.)
     живут отдельной величиной — там навигация по длинному тексту, не приложение. */
  --size-sidenav: calc(var(--space-16) * 4);
  /* Рабочая область приложения — ширина содержимого правого фрейма, рядом с
     боковой навигацией. 1152px = --space-16 * 18: единственная величина в этом
     диапазоне, ложащаяся на шкалу отступов. До канона каждый экран выбирал
     своё — портальные страницы 940px, афиша 1100px, кабинет Организатора
     1160px, Мастерская 1400px, — и одинаковые по смыслу кабинеты выглядели
     разной ширины. Влезает таблица кабинета, не расплываясь на широком экране. */
  --size-content: calc(var(--space-16) * 18);
  --size-icon-wm:150px; --size-qr-box:78px; --size-icon-qr:50px;
  /* ── Poster (постер-афиша мероприятия) ────────── */
  --poster-cover-min-h:140px;
  --poster-cover-test: linear-gradient(135deg, oklch(0.56 0.16 305) 0%, oklch(0.46 0.15 300) 100%);
  --poster-cover-learn: linear-gradient(135deg, oklch(0.55 0.15 235) 0%, oklch(0.44 0.14 232) 100%);
  --poster-scrim-chip: oklch(1 0 0 / .9);
  --poster-scrim-stage: oklch(0 0 0 / .28);
  --poster-sub-color: oklch(1 0 0 / .92);
  --poster-title-shadow: 0 1px 8px oklch(0 0 0 / .25);
  --poster-sub-shadow: 0 1px 6px oklch(0 0 0 / .25);
  --poster-wm-offset-x: -14px; --poster-wm-offset-y: -28px;
  /* ── Typography ───────────────────────────────── */
  --font-display: 'Akrobat', ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-body: 'Roboto', ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --text-xs:12px; --text-sm:13px; --text-md:14px; --text-lg:16px; --text-xl:20px; --text-2xl:28px;
  --leading-tight:1.2; --leading-normal:1.5;
  /* ── State layers & focus ─────────────────────── */
  --state-hover: rgba(15,23,42,.06);
  --state-active: rgba(15,23,42,.12);
  --focus-ring: 0 0 0 3px rgba(91,93,233,.35);
  /* ── Motion ───────────────────────────────────── */
  --motion-fast:120ms; --motion-base:200ms; --ease-standard: cubic-bezier(.2,0,0,1);
}
/* @boog-ui-end */

/* ══════════════ Проектный слой Слайдера (канон не трогает) ══════════════
   Всё ниже — вне зоны канона: доменные токены продукта и директивы, которых
   в общем ките нет и быть не должно (ADR-048 §2.1). */
:root {
  /* Поверхности Слайдера (продуктовые слои сверх примитивов) — портал читает этот
     перечень, чтобы учитывать их токены в датчике «сирот». Канон директивы не имеет. */
  /* @surfaces cabinet-card,cabinet-list,season-hub,canvas-kit,chrome,create-board,editor-legacy-bridge,evaluation,feature-promo,new-slide,settings,share,slides */
  /* ── Плавающие поверхности редактора (диалоги/панели) ── */
  --size-dialog-md:448px;      /* компактный диалог-форма (напр. Сессия оценки) */
  --size-card-md:224px;        /* карточка над объектом холста */
  --size-panel-md:320px;       /* боковая панель итогов/списка */
  --size-editor-topbar:56px;   /* высота верхней панели редактора (для оффсетов) */
  /* ── Бренд-логотип BOOG — размеры для инлайн-монограммы переключателя приложений.
     Цвета (--brand-logo-blue/red/ink) уже канонизированы в ките, выше маркера. ── */
  --brand-logo-size:34px; --brand-logo-pad:6px; --brand-logo-font:10px;
  --brand-logo-ring:1.5px; --brand-logo-blur:1.1px;
}
