/* Общие узоры проектов (как полосатые паттерны 1654 Fund). Подключают все страницы макета.
   У каждого проекта свой цвет и свой узор, и он стоит везде, где проект обозначен цветом:
   полосы, куски, квадратики легенды, заливка под линией графика. */
:root{
  --р:#D92D20; --и:#B0177E; --а:#F08C00; --е:#2E93D9; --с:#00857A;      /* Скаммерс: бирюзовый, как до нового дизайна */
  --л:#57A82A;            /* АТ Алексей: лаймовый (Иван 15.09; 28.10 вернули после макета, где цвета Скаммерса и Алексея съехали) */
  --тони:#E5579A;            /* Тони: розовый (Иван 30.10) */
  --слэш:#7B4FD8;            /* СЛЭШ: фиолетовый, свободный сектор между голубым Егора и магентой Ивана (30.10) */
  --зелёный:#027135;      /* зелёный 1654 Fund для акцентов «хорошо» */
}
/* Узор рисуется плиткой от центра, поэтому в маленькой иконке он не обрезан с краю. Без рамки. */
.у-р,.у-с,.у-л,.у-и,.у-а,.у-е,.у-т,.у-ш{--т:color-mix(in srgb,var(--c) 22%,#fff);background-position:center!important;background-repeat:repeat!important;border-radius:2px}
.у-р{--c:var(--р);background:linear-gradient(0deg,var(--c) 0 50%,var(--т) 50% 100%) center/4px 4px!important}            /* Рамиль: горизонтальные полосы */
.у-с{--c:var(--с);background:linear-gradient(45deg,var(--c) 0 18%,var(--т) 18% 32%,var(--c) 32% 68%,var(--т) 68% 82%,var(--c) 82%) center/6px 6px!important}  /* Скаммерс: косые / */
.у-л{--c:var(--л);background:linear-gradient(90deg,var(--c) 0 50%,var(--т) 50% 100%) center/4px 4px!important}           /* АТ Алексей: вертикальные */
.у-и{--c:var(--и);background:radial-gradient(circle,var(--c) 1.3px,var(--т) 1.6px) center/4px 4px!important}              /* Абуззище Иван: точки */
.у-а{--c:var(--а);background:linear-gradient(-45deg,var(--c) 0 18%,var(--т) 18% 32%,var(--c) 32% 68%,var(--т) 68% 82%,var(--c) 82%) center/6px 6px!important} /* УП Артём: косые \ */
.у-е{--c:var(--е);background:repeating-conic-gradient(var(--c) 0 25%,var(--т) 0 50%) center/6px 6px!important}            /* УП Егор: шахматка */
.у-т{--c:var(--тони);background:linear-gradient(90deg,var(--т) 0 1.5px,transparent 1.5px) center/5px 5px,linear-gradient(0deg,var(--т) 0 1.5px,var(--c) 1.5px) center/5px 5px!important}   /* Тони: сетка */
.у-ш{--c:var(--слэш);background:linear-gradient(45deg,transparent 0 42%,var(--т) 42% 58%,transparent 58%) center/6px 6px,linear-gradient(-45deg,var(--c) 0 42%,var(--т) 42% 58%,var(--c) 58%) center/6px 6px!important}   /* СЛЭШ: косой крест */

/* «Ёлочка» 1654 Fund (вариант А): слева полосы «/», справа зеркально «\».
   Одна полоса меняет толщину ступенями: у середины плашки самая тонкая, к краям шире (3 ширины).
   Ставится классом .ёлочка на плашку; слой узора вставляет общее/узоры.js.
   У всех частей слоя свои имена с приставкой «ёл-», чтобы стили страниц их не задевали. */
/* слой лежит под текстом за счёт isolation + z-index:-1: так текст без обёртки (кнопки) тоже поверх узора */
.ёлочка{overflow:hidden;isolation:isolate}
.ёлочка:not(.пилюля-хода){position:relative}
.ёлочка>.ёлочка-узор{position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none;margin:0!important;padding:0!important;border-radius:inherit}
.ёлочка-узор>.ёл-половина{position:absolute;top:0;bottom:0;width:50%;height:auto;padding:0;margin:0;border-radius:0;--п:14px;--ц:rgba(255,255,255,.2)}
.ёлочка-узор>.ёл-лево{left:0;background:rgba(255,255,255,.05)}
.ёлочка-узор>.ёл-право{left:50%;transform:scaleX(-1);background:none}
.ёлочка-узор .ёл-полоса{position:absolute;inset:0;display:block;width:auto;height:auto;margin:0;border-radius:0;box-shadow:none;
  background:repeating-linear-gradient(-45deg,
  transparent 0 calc((var(--п) - var(--w))/2),
  var(--ц) calc((var(--п) - var(--w))/2) calc((var(--п) + var(--w))/2),
  transparent calc((var(--п) + var(--w))/2) var(--п))}
.ёлочка-узор .ёл-ш1{--w:1.5px;-webkit-mask:linear-gradient(90deg,transparent 0 66.6%,#000 66.6%);mask:linear-gradient(90deg,transparent 0 66.6%,#000 66.6%)}
.ёлочка-узор .ёл-ш2{--w:3.5px;-webkit-mask:linear-gradient(90deg,transparent 0 33.3%,#000 33.3% 66.7%,transparent 66.7%);mask:linear-gradient(90deg,transparent 0 33.3%,#000 33.3% 66.7%,transparent 66.7%)}
.ёлочка-узор .ёл-ш3{--w:6.5px;-webkit-mask:linear-gradient(90deg,#000 0 33.4%,transparent 33.4%);mask:linear-gradient(90deg,#000 0 33.4%,transparent 33.4%)}
/* на светлом фоне — те же полосы бледно-синим */
.ёлочка.светлая .ёлочка-узор>.ёл-половина{--ц:color-mix(in srgb,var(--синий) 12%,transparent)}
.ёлочка.светлая .ёлочка-узор>.ёл-лево{background:color-mix(in srgb,var(--синий) 3%,transparent)}

/* Простой штрих (Иван: «не ёлочкой, а просто штрихом») — для строки лидера в списках */
.штрих{background-image:repeating-linear-gradient(-45deg,color-mix(in srgb,var(--синий) 20%,transparent) 0 1.5px,transparent 1.5px 6px)!important}

/* «Ступени» — только для выбранного пункта меню (Иван 25.10): вертикальные полосы утолщаются ступенями
   слева направо, тонкие → средние → толстые, как полосы 1654 Fund. Имя с приставкой «ёл-», чтобы не задеть стили страниц. */
.ёл-ступени{background-image:
  repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 1px,transparent 1px 7px),
  repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 2px,transparent 2px 7px),
  repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 3.5px,transparent 3.5px 7px)!important;
  background-size:33.4% 100%,33.4% 100%,33.4% 100%!important;
  background-position:0 0,50% 0,100% 0!important;background-repeat:no-repeat!important}

/* Конверсии: на синих плашках обзора ёлочка тише (Иван 25.10) */
.синяя-плашка.ёлочка .ёлочка-узор>.ёл-половина{--ц:rgba(255,255,255,.09)}
.синяя-плашка.ёлочка .ёлочка-узор>.ёл-лево{background:rgba(255,255,255,.02)}
/* иконки проектов в переключателе шапки (вместо точек) */
.проекты .пр i[data-иконка]{width:12px;height:12px;border-radius:2px;box-shadow:none}
