/*
 * Главная - исследование «26 лет против индекса» (ТЗ 23.09.2026, issue #6).
 *
 * Стили артефакта, ограниченные блоком .avsResearch: шапка и футер сайта
 * остаются в стилях темы. Тема задаёт заголовкам Montserrat и верхний
 * регистр, таблицам и кнопкам свои рамки, поэтому здесь эти свойства
 * переопределены явно.
 *
 * Отличия от артефакта:
 *   - нет тёмной темы: у сайта её нет, а светлая шапка над тёмным блоком
 *     выглядела бы чужой;
 *   - нет веб-шрифтов Newsreader и Instrument Sans. В них нет кириллицы,
 *     и в артефакте русский текст и так выводился запасными Georgia и Arial;
 *     здесь они основные, без загрузки с Google Fonts;
 *   - нет правил для html/body: фон и шрифт задаются самому блоку.
 *
 * Размеры - calc(N * var(--rem)), а не Nrem: тема ставит html{font-size:18px},
 * и в rem весь блок был бы на 12,5% крупнее задуманного (аудит P17). --rem
 * равен 16px, как корень в артефакте.
 *
 * Фирменный фиолетовый (--brand) - у ссылок и переключателей. Синий
 * --c-AVICORE остаётся только линией стратегии на графиках (аудит P38).
 */
.avsResearch{
  --bg:#F4F6F8; --surface:#FFFFFF; --ink:#152033; --muted:#5A6576; --rule:#D6DCE4; --soft:#E9EDF2;
  --note-bg:#FFF6DC; --note-ink:#6B5210; --pos:#1E7A55; --neg:#B23A3A;
  --c-EMERALD:#0E8F6A; --c-POWER:#C8372D; --c-AVICORE:#1F5FAF; --c-STABILITY:#4E7F8C;
  --c-YELLOW:#D19A12; --c-INDIGO:#5A48B5; --c-DIVIDEND:#9A4F8E; --c-GREEN:#6FA83A;
  --c-EW8:#152033; --c-SP500:#8C96A5; --c-GOLD:#B08D3C;
  --serif:Georgia, "Times New Roman", serif;
  --sans:"Helvetica Neue", Arial, sans-serif;
  --brand:#4B326B; --brand-soft:#F8F6FB; --brand-dark:#352357;
  --rem:16px;
  display:block;
  box-sizing:border-box;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--serif);
  font-size:calc(1.1875 * var(--rem));
  line-height:1.65;
  -webkit-text-size-adjust:100%;
}
.avsResearch *,.avsResearch *::before,.avsResearch *::after{box-sizing:border-box}
.avsResearch .wrap{width:94%;max-width:1140px;margin:0 auto;padding:0}
.avsResearch .col{max-width:calc(40 * var(--rem));margin:0}
.avsResearch header.hero{padding:calc(3.5 * var(--rem)) 0 calc(1 * var(--rem));background:none;position:static}
.avsResearch .kicker{font-family:var(--sans);font-size:calc(.9 * var(--rem));color:var(--muted);margin:0 0 calc(1.25 * var(--rem))}
.avsResearch h1,.avsResearch h2{font-family:var(--serif);color:var(--ink);text-transform:none;text-align:left}
.avsResearch h1{font-weight:500;font-size:clamp(calc(2.1 * var(--rem)),5.2vw,calc(3.6 * var(--rem)));line-height:1.08;letter-spacing:-.015em;margin:0 0 calc(1.25 * var(--rem));max-width:22ch}
.avsResearch .dek{font-size:calc(1.3 * var(--rem));line-height:1.5;color:var(--muted);margin:0;max-width:calc(36 * var(--rem))}
.avsResearch h2{font-weight:500;font-size:calc(1.75 * var(--rem));line-height:1.2;margin:calc(3.5 * var(--rem)) 0 calc(1 * var(--rem));letter-spacing:-.005em}
.avsResearch p{margin:0 0 calc(1.1 * var(--rem));font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}
.avsResearch a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.avsResearch a:hover{color:var(--brand-dark)}
.avsResearch figure{margin:calc(2.25 * var(--rem)) 0}
.avsResearch figcaption{font-family:var(--sans);font-size:calc(.85 * var(--rem));color:var(--muted);margin-top:calc(.75 * var(--rem));line-height:1.5}
.avsResearch .panel{--pad-x:calc(1.25 * var(--rem));background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:calc(1.25 * var(--rem)) var(--pad-x) calc(1 * var(--rem))}
.avsResearch .panel-head{display:flex;flex-wrap:wrap;gap:calc(.75 * var(--rem)) calc(1.5 * var(--rem));align-items:baseline;justify-content:space-between;margin-bottom:calc(.75 * var(--rem));font-family:var(--sans)}
.avsResearch .panel-title{font-weight:600;font-size:calc(1 * var(--rem))}
.avsResearch .chart-box{position:relative;width:100%}
.avsResearch .chart-box.tall{height:min(62vh,500px);min-height:340px}
.avsResearch .chart-box.mid{height:380px}
.avsResearch .chips{display:flex;flex-wrap:wrap;gap:calc(.4 * var(--rem));font-family:var(--sans);margin-top:calc(.9 * var(--rem))}
.avsResearch button{margin:0;box-shadow:none;text-transform:none;letter-spacing:normal;min-height:0;width:auto}
.avsResearch .chip{display:inline-flex;align-items:center;gap:calc(.45 * var(--rem));border:1px solid var(--rule);background:transparent;color:var(--muted);font:500 calc(.82 * var(--rem))/1 var(--sans);padding:calc(.45 * var(--rem)) calc(.7 * var(--rem));border-radius:999px;cursor:pointer}
.avsResearch .chip .sw{width:14px;height:3px;border-radius:2px;background:var(--sw)}
.avsResearch .chip.dash .sw{background:repeating-linear-gradient(90deg,var(--sw) 0 4px,transparent 4px 7px)}
.avsResearch .chip[aria-pressed="true"]{color:var(--ink);border-color:var(--brand);background:var(--brand-soft)}
.avsResearch .chip:focus-visible,.avsResearch .seg button:focus-visible,.avsResearch select:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.avsResearch .seg{display:inline-flex;border:1px solid var(--rule);border-radius:8px;overflow:hidden;font-family:var(--sans)}
.avsResearch .seg button{background:transparent;border:0;border-radius:0;color:var(--muted);font:500 calc(.82 * var(--rem)) var(--sans);padding:calc(.4 * var(--rem)) calc(.75 * var(--rem));cursor:pointer;white-space:nowrap}
.avsResearch .seg button+button{border-left:1px solid var(--rule)}
.avsResearch .seg button[aria-pressed="true"]{background:var(--brand);color:#fff}
.avsResearch .dd-label{font-family:var(--sans);font-size:calc(.85 * var(--rem));color:var(--muted)}
.avsResearch select{font:500 calc(.85 * var(--rem)) var(--sans);color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:calc(.4 * var(--rem)) calc(.6 * var(--rem));height:auto;width:auto;margin-left:calc(.35 * var(--rem))}
.avsResearch .scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.avsResearch table{border-collapse:collapse;width:100%;font-family:var(--sans);font-size:calc(.88 * var(--rem));font-variant-numeric:tabular-nums;margin:0;border:0;background:none}
.avsResearch th,.avsResearch td{padding:calc(.55 * var(--rem)) calc(.6 * var(--rem));text-align:right;white-space:nowrap;border:0;border-bottom:1px solid var(--rule);background:none;color:inherit;font-size:inherit}
.avsResearch th:first-child,.avsResearch td:first-child{text-align:left}
.avsResearch thead th{font-weight:500;color:var(--muted);border-bottom:1px solid var(--ink);vertical-align:bottom}
.avsResearch tr.bench td{color:var(--muted)}
.avsResearch tr.basket td{font-weight:600}
.avsResearch tr.sep td{border-top:1px solid var(--ink)}
.avsResearch .dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--sw);margin-right:calc(.5 * var(--rem));vertical-align:1px}
.avsResearch th.grp{text-align:center;border-bottom:1px solid var(--rule);padding-bottom:calc(.35 * var(--rem));color:var(--ink)}
.avsResearch .g1{border-left:1px solid var(--rule)}
.avsResearch td.bm{color:var(--muted)}
.avsResearch th.grp+th.grp{border-left:1px solid var(--rule)}
.avsResearch .heat td{padding:calc(.4 * var(--rem)) calc(.5 * var(--rem));font-size:calc(.8 * var(--rem));border-bottom:1px solid var(--bg)}
.avsResearch .heat td:first-child{color:var(--muted)}
.avsResearch .facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(1.5 * var(--rem));margin:calc(2 * var(--rem)) 0;font-family:var(--sans)}
.avsResearch .fact .n{font-family:var(--serif);font-size:calc(2.2 * var(--rem));line-height:1.1;font-weight:500;font-variant-numeric:lining-nums}
.avsResearch .fact .l{font-size:calc(.88 * var(--rem));color:var(--muted);margin-top:calc(.35 * var(--rem));line-height:1.45}
.avsResearch .avs-strings{display:none}
.avsResearch .more-intro{margin-top:calc(3.5 * var(--rem))}
.avsResearch .more-intro p{color:var(--muted)}
.avsResearch .sections{margin-top:calc(1.5 * var(--rem))}
.avsResearch details.sec{border:0}
.avsResearch details.sec:last-child>summary .sum-in{border-bottom:1px solid var(--rule)}
.avsResearch .final{margin-top:calc(1 * var(--rem))}
.avsResearch details.sec>summary{list-style:none;cursor:pointer}
.avsResearch details.sec>summary::-webkit-details-marker{display:none}
.avsResearch .sum-in{display:flex;align-items:center;justify-content:space-between;gap:calc(1 * var(--rem));padding:calc(1.15 * var(--rem)) 0;border-top:1px solid var(--rule)}
.avsResearch .sum-t{font-family:var(--serif);font-weight:500;font-size:calc(1.6 * var(--rem));line-height:1.25}
.avsResearch .sum-i{position:relative;flex:0 0 22px;height:22px}
.avsResearch .sum-i::before,.avsResearch .sum-i::after{content:"";position:absolute;left:3px;right:3px;top:10px;height:2px;background:var(--ink);border-radius:1px;transition:transform .2s ease}
.avsResearch .sum-i::after{transform:rotate(90deg)}
.avsResearch details.sec[open] .sum-i::after{transform:rotate(0deg)}
.avsResearch details.sec>summary:hover .sum-t{color:var(--brand)}
.avsResearch details.sec>summary:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:4px}
.avsResearch details.sec>.col>h2:first-child{display:none}
.avsResearch details.sec[open]{padding-bottom:calc(1.5 * var(--rem))}
.avsResearch details.sec figure:first-child{margin-top:0}
.avsResearch footer{font-family:var(--sans);font-size:calc(.82 * var(--rem));color:var(--muted);border-top:1px solid var(--rule);margin-top:calc(4 * var(--rem));padding:calc(1.5 * var(--rem)) 0 calc(3 * var(--rem));line-height:1.55;background:none;position:static}
.avsResearch footer a{color:inherit}
@media (prefers-reduced-motion:reduce){.avsResearch .sum-i::before,.avsResearch .sum-i::after{transition:none}}
@media (max-width:768px){.avsResearch .wrap{width:calc(100% - 32px)}}
@media (max-width:600px){
  .avsResearch{font-size:calc(1.0625 * var(--rem))}
  .avsResearch .dek{font-size:calc(1.1 * var(--rem))}
  .avsResearch .sum-t{font-size:calc(1.3 * var(--rem))}
  .avsResearch .facts{grid-template-columns:1fr}
  .avsResearch .panel{--pad-x:calc(.75 * var(--rem));padding:calc(1 * var(--rem)) var(--pad-x) calc(.75 * var(--rem))}
  .avsResearch .chart-box.mid{height:320px}
  .avsResearch header.hero{padding-top:calc(2.25 * var(--rem))}
}

/*
 * Таблицы (аудит P18). Зебра tables.css темы (table tbody>tr:nth-child(odd)>td,
 * вес 0,1,4) сюда не попадает: вес тот же, а research.css подключён позже.
 * Цвета тепловой карты заданы инлайн и не затрагиваются. Длинные заголовки
 * («Волатильность», «Рост капитала») переносятся, цифры - нет: таблица
 * метрик на 1280-1440 помещается в панель без прокрутки.
 * Правила артефакта thead tr:first-child th[rowspan] (линия цвета --ink) здесь
 * нет: оно повторяло thead th, но с весом 0,3,3 перебивало светлые линии шапки
 * avs-design.css (0,3,2) - под «Стратегия», «Запуск», «Месяцев» оставалась
 * тёмная линия, под остальными заголовками той же шапки светлая.
 */
.avsResearch table tbody>tr>td,.avsResearch table tbody>tr>th{background-color:transparent}
.avsResearch thead th{white-space:normal;line-height:1.25;min-width:4.5em}

/*
 * Таблицы шире экрана (аудит P39): первая колонка (стратегия, год) закреплена,
 * тень у правого края показывает, что таблицу можно листать.
 *   - :is(thead tr:first-child, tbody tr): первая ячейка второй строки шапки
 *     «Реальных счетов» - подзаголовок «Стратегия» под «Доходностью за
 *     период», закреплять её нельзя, она наехала бы на заголовок колонки;
 *   - закреплённая ячейка встаёт у края содержимого панели, а не у рамки:
 *     поле --pad-x слева от неё закрывает ::before цвета панели, иначе в нём
 *     видны прокручиваемые цифры. box-shadow не годится: у ячеек при
 *     border-collapse Chrome тень не рисует;
 *   - линии строк (border-collapse) фон закреплённой ячейки не закрывает:
 *     в колонке «Год» сквозь них были видны цвета уехавших под неё ячеек
 *     тепловой карты (и под шапкой - цвет первой строки). Поэтому ::before
 *     заходит на 1px ниже ячейки, а ::after (z-index:-1, под текстом) -
 *     подложка ячейки вместе с линией. Цвет линии наследуется от ячейки
 *     (inherit), а не задан здесь: полупрозрачная линия avs-design.css поверх
 *     белой подложки выглядит так же, как в непрокрученной таблице;
 *   - линия справа от колонки - только у прокрученной таблицы (класс
 *     scrolled ставит research.js), в покое таблица выглядит как раньше;
 *   - тень-признак: верхний слой (local) едет с таблицей и в конце прокрутки
 *     закрывает тень нижнего (scroll), прибитого к краю панели. Таблица,
 *     которая помещается целиком, тени не получает.
 */
.avsResearch .scroll table :is(thead tr:first-child,tbody tr)>:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
.avsResearch .scroll table :is(thead tr:first-child,tbody tr)>:first-child::before{content:"";position:absolute;top:0;bottom:-1px;right:100%;width:var(--pad-x);background:var(--surface)}
.avsResearch .scroll table :is(thead tr:first-child,tbody tr)>:first-child::after{content:"";position:absolute;z-index:-1;top:0;bottom:-1px;left:0;right:0;background:var(--surface);border-bottom:1px solid;border-bottom-color:inherit}
.avsResearch .scroll.scrolled table :is(thead tr:first-child,tbody tr)>:first-child::after{border-right:1px solid var(--rule)}
.avsResearch .scroll{background:linear-gradient(to left,var(--surface) 30%,rgba(255,255,255,0)) right center/40px 100% no-repeat local,radial-gradient(farthest-side at 100% 50%,rgba(21,32,51,.16),transparent) right center/12px 100% no-repeat scroll,var(--surface)}
/* дата запуска под названием - вместо колонок «Запуск» и «Месяцев» на телефоне */
.avsResearch .scroll .sub{display:none;font-size:calc(.75 * var(--rem));font-weight:400;color:var(--muted);line-height:1.3;text-indent:0}

/* Переключатели (аудит P41): отклик на наведение, у нажатых он не нужен.
   Только для мыши: на телефоне :hover залипает после касания. */
@media (hover:hover){
  .avsResearch .chip:not([aria-pressed="true"]):hover{border-color:var(--muted);color:var(--ink)}
  .avsResearch .seg button:not([aria-pressed="true"]):hover{background:var(--soft);color:var(--ink)}
}

@media (max-width:600px){
  /* P39: на телефоне колонка названий уже - длинные названия переносятся,
     вторая строка (и дата запуска) - под названием, а не под точкой */
  .avsResearch .scroll table:not(.heat) tbody td:first-child{white-space:normal;min-width:9em;padding-left:calc(1.1 * var(--rem) + 9px);text-indent:calc(-.5 * var(--rem) - 9px)}
  .avsResearch .hide-sm{display:none}
  .avsResearch .scroll .sub{display:block}
  /* P40: кризисы - сетка 2×2 вместо четырёх кнопок в две строки текста */
  .avsResearch #crisisSeg{display:grid;grid-template-columns:repeat(2,1fr);width:100%}
  .avsResearch #crisisSeg button+button{border-left:0}
  .avsResearch #crisisSeg button:nth-child(even){border-left:1px solid var(--rule)}
  .avsResearch #crisisSeg button:nth-child(n+3){border-top:1px solid var(--rule)}
  /* P40: главный график помещается на экран вместе с заголовком и пилюлями */
  .avsResearch .chart-box.tall{height:360px;min-height:0}
  /* P41: зона нажатия 40px и зазоры между пилюлями */
  .avsResearch .chip{min-height:40px;padding:calc(.55 * var(--rem)) calc(.8 * var(--rem))}
  .avsResearch .chips{gap:calc(.5 * var(--rem))}
  .avsResearch .seg button{min-height:40px}
}