/* ==========================================================================
   v60 — оптовая шкала звёзд, живой блок «Почему eroot».
   Грузится после v59.css; приём специфичности :root:not(#v).
   ========================================================================== */

/* 1. Шкала цен звёзд: ступени, текущая подсвечена */
:root:not(#v) .star-ladder{margin-top:var(--s-4,18px);padding:14px 16px;border-radius:18px;background:color-mix(in srgb,var(--tone,var(--text)) 4%,transparent);box-shadow:inset 0 0 0 1px var(--line)}
:root:not(#v) .star-ladder__t{display:block;margin-bottom:10px;font:600 13px/1.3 var(--f-sans);color:var(--text)}
:root:not(#v) .star-ladder ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
:root:not(#v) .star-ladder li{display:flex;flex-direction:column;gap:4px;padding:9px 10px;border-radius:12px;
  background:color-mix(in srgb,var(--tone,var(--text)) 4%,transparent);transition:background .3s ease,box-shadow .3s ease}
:root:not(#v) .star-ladder li b{font:500 11.5px/1.25 var(--f-sans);color:var(--text-dim)}
:root:not(#v) .star-ladder li span{font:700 15px/1 var(--f-num,var(--f-sans));color:var(--text-dim);font-variant-numeric:tabular-nums}
:root:not(#v) .star-ladder li.is-past span{color:var(--text)}
:root:not(#v) .star-ladder li.is-on{background:color-mix(in srgb,var(--c-stars) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c-stars) 55%,transparent)}
:root:not(#v) .star-ladder li.is-on b,:root:not(#v) .star-ladder li.is-on span{color:var(--text)}
:root:not(#v) .star-ladder small{display:block;margin-top:10px;font:500 12px/1.45 var(--f-sans);color:var(--text-mute)}
@media (max-width:560px){:root:not(#v) .star-ladder ol{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* 2. «Почему eroot»: поле за курсором (lean.js) двигает карточки свойством
      translate — переход не нужен, пружина в JS */
:root:not(#v) [data-lean] .card,:root:not(#v) [data-lean] .trust__item,:root:not(#v) [data-lean] .card__icon{will-change:translate}
:root:not(#v) [data-lean] .card__icon{transition:background .3s ease,box-shadow .3s ease}
:root:not(#v) [data-lean] .card:hover .card__icon{background:color-mix(in srgb,var(--violet) 22%,transparent)}
:root:not(#v) [data-lean] .card:nth-child(even):hover .card__icon{background:color-mix(in srgb,var(--pink) 20%,transparent)}
