/* stepforge_site/assets/css/mk-tokens.css
 *
 * Визуальная айдентика "Foundry" — токены платформы-маркетплейса
 * (design/MARKETPLACE_SPEC.md §8.1). Это ПЕРВАЯ реальная реализация §8:
 * до этой задачи файл существовал только на бумаге — разметка
 * (_chrome.php/home.php/login.php/_cards.php) уже ссылалась на .mk-btn-foundry/
 * .mk-hero/.mk-app-card--tile и на токены --mk-*, но CSS под них никогда не был
 * написан, а marketplace.css/forum.css всё ещё держались на игровых токенах
 * --sf-* (бирюза, толстые обводки, тени-«поп», Baloo 2). Этот файл закрывает
 * разрыв.
 *
 * Подключать в _chrome.php ПОСЛЕ sf-tokens.css (переопределяем часть --sf-*)
 * и ДО marketplace.css/forum.css (они потребляют переменные).
 *
 * Зачем «мост» --sf-* → --mk-* внизу файла: marketplace.css/forum.css написаны
 * на ~200 ссылок var(--sf-*). §8.6 предполагает механическую замену
 * var(--sf-*)→var(--mk-*) в этих файлах отдельным проходом, но это правка
 * шаредного файла, задевающая ~20 других страниц кабинета/форума вне текущей
 * задачи (каталог). Вместо рискованного построчного переписывания мы делаем
 * источником истины именно --mk-* (весь новый код каталога — на них), а
 * --sf-* превращаем в тонкий слой-совместимости, указывающий НА --mk-*: так
 * legacy-CSS мгновенно перекрашивается в Foundry (уходит бирюза/Baloo 2/толстые
 * рамки) без правки самих файлов. Полная механическая замена --sf-*→--mk-* в
 * marketplace.css/forum.css остаётся как отдельный последующий шаг.
 */

:root {
  /* ── Foundry: цвета (контраст посчитан по WCAG, см. §8.1) ── */
  --mk-bg:          #F6F7FA; /* фон страницы — прохладный, едва-голубой нейтрал */
  --mk-surface:     #FFFFFF; /* карточки, шапка, поля форм */
  --mk-surface-2:   #EDEFF3; /* подвал, вторичные полосы, тинты полей */
  --mk-ink:         #171B23; /* основной текст/заголовки — 16.1:1 на --mk-bg */
  --mk-ink-soft:    #565E6D; /* вторичный текст, подписи — 6.1:1 на --mk-bg */
  --mk-ink-faint:   #98A0AF; /* disabled/плейсхолдеры — только UI/крупный текст */
  --mk-border:      #E1E4EA; /* волосяная линия 1px — карточки, поля, разделители */
  --mk-accent:      #E8531F; /* сигнальный оранжевый — ссылки, иконки, активный таб */
  --mk-accent-deep: #C13F13; /* заливка кнопок (белый текст), hover/pressed — 5.3:1 */
  --mk-accent-soft: #FDEAE0; /* тинт-фон — бейджи, подсветка строк */
  --mk-danger:      #D64545; /* деструктивные действия, ошибки */
  --mk-success:     #15784C; /* бейдж "Опубликовано" (белый текст) — 5.5:1 */
  --mk-warning:     #8A5A12; /* текст бейджа "На модерации" на тинте */
  --mk-warning-soft:#FBEAD1; /* амбровый тинт под бейдж "На модерации" */

  /* ── Foundry: радиусы (третий регистр — не «всё-таблетки» игры и не
       флэт-острые углы steps_app) ── */
  --mk-radius-sm:   8px;   /* поля ввода, мелкие теги */
  --mk-radius-md:   12px;  /* дефолт — кнопки, карточки, панели */
  --mk-radius-lg:   20px;  /* герой-панели, иконка приложения, баннер */
  --mk-radius-pill: 999px; /* узко: аватар-кружки, точки статуса, фильтр-чипы */

  /* ── Foundry: тени/подъём (мягкая слоистая глубина, §8.1) ── */
  --mk-shadow-sm: 0 1px 2px rgba(23,27,35,.06);
  --mk-shadow-md: 0 2px 6px rgba(23,27,35,.06), 0 8px 20px rgba(23,27,35,.08);
  --mk-shadow-lg: 0 16px 40px rgba(23,27,35,.16);

  --mk-border-width: 1px;

  /* ── Foundry: отступы (та же числовая ритмика, что --sf-space-*, плюс
       один крупный шаг --mk-space-8 под щедрые герой-секции) ── */
  --mk-space-1: 4px;
  --mk-space-2: 8px;
  --mk-space-3: 12px;
  --mk-space-4: 16px;
  --mk-space-5: 24px;
  --mk-space-6: 32px;
  --mk-space-7: 48px;
  --mk-space-8: 64px;

  /* ── Foundry: типографика — только Inter, без второго дисплейного шрифта.
       Baloo 2 (@font-face в sf-fonts.css) больше нигде не референсится на
       страницах маркетплейса, поэтому браузер его не скачивает — минус один
       шрифт-файл на загрузку (owner: «не тяжёлый, оптимизированный»). ── */
  --mk-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* ────────────────────────────────────────────────────────────────────
   * Мост совместимости: --sf-* → Foundry --mk-*. Только те токены, что
   * реально используются в marketplace.css/forum.css. Не трогаем игровые
   * --sf-tier-*/--sf-rar-* (на страницах маркетплейса не встречаются).
   * ──────────────────────────────────────────────────────────────────── */
  --sf-bg:            var(--mk-bg);
  --sf-bg-2:          var(--mk-surface-2);
  --sf-surface:       var(--mk-surface);
  --sf-surface-soft:  var(--mk-accent-soft);
  --sf-ink:           var(--mk-ink);
  --sf-ink-soft:      var(--mk-ink-soft);
  --sf-line:          var(--mk-border);

  --sf-primary:       var(--mk-accent);
  --sf-primary-deep:  var(--mk-accent-deep);
  --sf-accent-green:  var(--mk-success);
  --sf-accent-amber:  var(--mk-warning-soft);
  --sf-danger:        var(--mk-danger);

  --sf-radius-flat:   0px;
  --sf-radius-xs:     6px;
  --sf-radius-sm:     var(--mk-radius-sm);
  --sf-radius-md:     var(--mk-radius-md);
  --sf-radius-lg:     var(--mk-radius-lg);
  --sf-radius-pill:   var(--mk-radius-pill);

  --sf-border-width:  var(--mk-border-width);
  --sf-border:        var(--mk-border-width) solid var(--mk-border);
  --sf-shadow-card:   var(--mk-shadow-md);
  --sf-shadow-pop:    var(--mk-shadow-lg);
  --sf-shadow-flat:   var(--mk-shadow-sm);

  --sf-font-display:  var(--mk-font);
  --sf-font-body:     var(--mk-font);

  --sf-space-1: var(--mk-space-1);
  --sf-space-2: var(--mk-space-2);
  --sf-space-3: var(--mk-space-3);
  --sf-space-4: var(--mk-space-4);
  --sf-space-5: var(--mk-space-5);
  --sf-space-6: var(--mk-space-6);
  --sf-space-7: var(--mk-space-7);
}
