/* ============================================================
   eco-max-ln.css — ЛЕНТА финал (агент LN, ночной марафон 08.09)
   Зона: #view-feed + подписи клип-карточек (.vd-clip-card__bottom —
   глитч, отмеченный VI: зашитый в видео вотермарк «Клип N · VD QA»
   пробивает сквозь тонкий шейд и сталкивается с DOM-подписью).
   Правки ТОЛЬКО презентационные, своим слоем поверх соседей
   (VC/VD/VI не тронуты). Канон: light #f6f8fc/#ffffff/#0f172a/
   #516180/#1a56db; dark #0b1220/#111c2e/#edf3ff/#6b96ff; Onest.
   Идемпотентные DOM-вставки eco-max-ln.js помечены [data-ln-max].
   Подключение: messenger.html, ?v=20260908-m3.
   --- Волна B (W012, 2026-09-09): канон-литералы #view-feed
   переведены на глобальные токены (fallback = var(--border),
   var(--accent) вместо мёртвых литералов). Блок #view-clips —
   «ночной канон» by design (экран всегда тёмный, НЕ зависит от
   темы): литералы rgba(4,9,20,*)/#edf3ff сохранены осознанно. ---
   ============================================================ */

/* ---------- 1. КЛИПЫ: глитч подписи — читаемая плашка автора/подписи ----------
   Проблема: у QA-клипов в самом видео зашит крупный белый вотермарк в нижней
   трети кадра; шейд VD (.vd-clip-card__shade) в этой зоне полупрозрачный,
   из-за чего вотермарк визуально сливается с name/cap (двойной текст).
   Решение LN: локально усилить нижний градиент шейда + подложка-плашка
   с blur под .vd-clip-card__bottom + text-shadow на тексте.
   Ночной канон: значения фиксированы под тёмный носитель (видео). */

#view-clips .vd-clip-card__shade {
  background:
    linear-gradient(
      to top,
      rgba(4, 9, 20, 0.94) 0%,
      rgba(4, 9, 20, 0.78) 16%,
      rgba(4, 9, 20, 0.45) 30%,
      rgba(4, 9, 20, 0.12) 48%,
      rgba(4, 9, 20, 0.05) 62%,
      rgba(4, 9, 20, 0.25) 100%
    );
}

#view-clips .vd-clip-card__bottom {
  padding: 26px 12px 11px;
  border-radius: var(--vd-r-md, 14px) var(--vd-r-md, 14px) 0 0;
  background: linear-gradient(
    to top,
    rgba(4, 9, 20, 0.62) 0%,
    rgba(4, 9, 20, 0.38) 62%,
    rgba(4, 9, 20, 0) 100%
  );
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  backdrop-filter: blur(7px) saturate(1.05);
  text-align: left;
}

#view-clips .vd-clip-card__author {
  position: relative;
  z-index: 2;
}

#view-clips .vd-clip-card__name {
  color: #edf3ff; /* ночной канон клипов, не --text */
  text-shadow: 0 1px 6px rgba(2, 6, 16, 0.85), 0 0 2px rgba(2, 6, 16, 0.6);
}

#view-clips .vd-clip-card__dot {
  box-shadow: 0 0 0 1.5px rgba(237, 243, 255, 0.35);
}

#view-clips .vd-clip-card__cap {
  position: relative;
  z-index: 2;
  text-align: left;
  color: rgba(237, 243, 255, 0.88); /* ночной канон клипов */
  text-shadow: 0 1px 5px rgba(2, 6, 16, 0.9), 0 0 2px rgba(2, 6, 16, 0.55);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Чипы длительности/просмотров чуть плотнее к фону (на светлых градиентах) */
#view-clips .vd-chip {
  background: rgba(6, 11, 22, 0.72);
  border-color: rgba(237, 243, 255, 0.18);
}

/* ---------- 2. ЛЕНТА: бейдж «+N» фото-сетки — контраст на светлых фото ---------- */

#view-feed .vy-mosaic--feed .vy-mosaic__more {
  text-shadow: 0 1px 6px rgba(2, 6, 16, 0.55);
}

/* Виньетка-скрим — только на ячейке с бейджем «+N» (пустые сетки не темням) */
#view-feed .vy-mosaic--feed .vy-mosaic__cell:has(.vy-mosaic__more)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 90% at 50% 55%, rgba(2, 6, 16, 0) 38%, rgba(2, 6, 16, 0.45) 100%);
  pointer-events: none;
}

/* Бейдж и содержимое последней ячейки — над скримом */
#view-feed .vy-mosaic--feed .vy-mosaic__more {
  z-index: 2;
}

#view-feed .vy-mosaic--feed .vy-mosaic__cell img,
#view-feed .vy-mosaic--feed .vy-mosaic__cell video {
  position: relative;
  z-index: 0;
}

/* ---------- 3. ЛЕНТА: страховка треда комментариев ---------- */
/* Тред внутри карточки (overflow:hidden у .feed-card есть) — страховка
   от двойного отсупа после VC-ряда действий и от слипания с кнопкой. */

#view-feed .feed-card__thread {
  margin-top: 8px;
}

#view-feed .feed-card__comments-list .comment-row + .comment-row {
  border-top: 1px solid color-mix(in srgb, var(--vc-border, var(--border)) 60%, transparent);
}

html[data-theme="dark"] #view-feed .feed-card__comments-list .comment-row + .comment-row {
  border-top-color: color-mix(in srgb, var(--border) 85%, transparent);
}

/* Фокус-кольца в треде — каноничный акцент (не подавляем outline соседей) */
#view-feed .feed-card__comment-input:focus-visible {
  outline: 2px solid var(--vc-accent, var(--accent));
  outline-offset: 1px;
}

/* ---------- 4. Заглушка битой картинки — не даём ей схлопнуться ---------- */

#view-feed .vy-mosaic__cell .vc-ph,
#view-feed .vc-ph--cell {
  z-index: 1;
}

/* ---------- 5. Reduced motion / print-безопасность ---------- */

@media (prefers-reduced-motion: reduce) {
  #view-clips .vd-clip-card,
  #view-clips .vd-clip-card__bottom {
    transition: none;
  }
}