/* css/strike.css — лист 20 «Выполнение»: карандашное зачёркивание при завершении.
   Только stroke-прорисовка (канон галки) + transform/opacity (§1). Тайминги —
   CSS-переменные, чтобы js/strike.js держал единый словарь листа 20·2. */

/* волнистая линия зачёркивания поверх текста карточки (js: stkDrawInto) */
.sk-strike{
  position:absolute; left:0; top:0; pointer-events:none; overflow:visible; z-index:2;
}
.sk-strike path{
  stroke:var(--graphite); stroke-width:2.5; fill:none; stroke-linecap:round; opacity:.75;
}

/* ── карточка доски (.task) в момент жеста ── */
/* галка прорисовывается росчерком (dash-draw в js), потому показываем её и до
   коммита (класс .dn ставит render уже после уезда) */
.task.sk-striking .tick > svg{ display:block; }
/* титул гаснет к приглушённому вместе с линией — данные не меняются, только вид */
.task.sk-striking .ttl{
  color:var(--pencil);
  transition:color .36s ease .24s;
}
/* уезд: только transform + opacity */
.task.sk-gone{
  transition:transform .3s ease, opacity .3s ease;
  transform:translateX(48px); opacity:0;
}

/* ── готовые done-карточки: календарь (cvEv) и пункты чеклиста-покупок (cl-item):
   статичная волна вместо прямого text-decoration:line-through ── */
.cv-ev.cv-dn{ position:relative; }
/* перебиваем `.cv-ev > *{position:relative}` (calviews.css грузится позже) */
.cv-ev .sk-strike{ position:absolute; left:0; top:0; }
.cv-ev.cv-dn.sk-struck .cv-et{ text-decoration:none; }
.cl-item.sk-struck .tx{ text-decoration:none; }

@media (prefers-reduced-motion:reduce){
  .task.sk-striking .ttl, .task.sk-gone{ transition:none; }
}