/* ============================================================================
   ТЕСТЕР СТРАТЕГИЙ — стили раздела /strategii/.

   Свой файл, как div.css у дивидендов и blog.css у блога: style.css главной
   не трогаем. Токены, шапка, крошки, футер и кнопка «на главную» повторяют
   раздел дивидендов один в один — переход между разделами не должен выдавать,
   что страницы делали в разное время. Фон чёрный #030303, как на главной и в
   дивидендах (блог на #18191C — это его решение, сюда не тянем).

   Правила сайта, которые здесь соблюдены: читаемый текст на ПК ≥ 18px, ярлыки
   капсом 15px, скругление 12px, рамки #3B3C41 / ховер #6C6F80, активное
   состояние — фон #18191C; ступени адаптива 1279 / 1023 / 767; число колонок
   в рядах считает auto-fit, а не медиазапросы.

   ШРИФТЫ: блок @font-face продублирован — это ПЯТОЕ место после style.css,
   gen_blog_pages.py, gen_dividend_pages.py и privacy/offerta. Переименовал
   woff2 — правь во всех пяти. Почему дубль, а не общий файл, и что нельзя
   трогать (unicode-range, font-display, диапазон weight) — в шапке div.css.
   ============================================================================ */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/montserrat-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/montserrat-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  /* Ужат до европейской латиницы 03.08.2026: 69 КБ -> 37,5 КБ. Диапазон сужен
     ВМЕСТЕ с файлом — иначе браузер качал бы его ради глифов, которых внутри
     уже нет. Полный разбор и команда пересборки — в блоке ШРИФТЫ в style.css;
     этот же блок продублирован ещё в четырёх файлах, правится везде разом. */
  src: url('/fonts/montserrat-latin-ext-eu.woff2') format('woff2');
  unicode-range: U+0100-024F, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/montserrat-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Science Gothic';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/science-gothic-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Science Gothic';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/science-gothic-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Science Gothic';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/science-gothic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Science Gothic';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/science-gothic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Знак рубля отдельным файлом 3,6 КБ (как в style.css): тестер рисует ₽ в каждой
   плитке и строке журнала. Правило ОБЯЗАНО стоять ПОСЛЕ latin-ext-eu — диапазоны
   перекрываются на U+20BD, побеждает объявленное позже. */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/montserrat-ruble.woff2') format('woff2');
  unicode-range: U+20BD;
}

:root{
  --bg:#030303;--card:#0b0c0e;--card2:#111214;--line:#3B3C41;--line2:#6C6F80;
  --ink:#ededed;--ink2:#a7a9b2;--ink3:#74767e;--green:#4CAF50;
  --red:#ef5350;--amber:#d8b25a;--rad:12px;--fs:18px;
  --text:#cfd2d9;
  --hair:#17181b;
  --col:100%;
  /* Фирменный жёлтый — цвет «вы сейчас здесь» на всём сайте. В тестере им
     нарисована кривая ВАШЕЙ стратегии; «купил и держи» — нейтральный серый,
     потому что это эталон для сравнения, а не вторая равноправная серия. */
  --brand:#FFEF03;
  --sans:'Montserrat',"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --display:'Science Gothic','Montserrat',sans-serif;}
*{box-sizing:border-box}
html,body{background:var(--bg);margin:0}
body{font-family:var(--sans);color:var(--ink);line-height:1.7;font-size:var(--fs);-webkit-font-smoothing:antialiased;padding:0}
h1,h2,h3{text-wrap:balance;margin:0}
a{color:var(--ink);text-decoration:none}
.lnk{color:#cfd2da;text-decoration:underline;text-decoration-color:#3a3b40;text-underline-offset:3px}
.lnk:hover{color:#fff;text-decoration-color:var(--line2)}
.num{font-variant-numeric:tabular-nums}
.wrap{width:1366px;max-width:calc(100% - 40px);margin:0 auto;padding:0 20px}
.topbar{border-bottom:1px solid #111;padding:16px 0}
.topbar .wrap{display:flex;align-items:center;justify-content:center}
.brand{display:inline-flex;align-items:center;gap:11px}
.brand-logo{width:40px;height:40px;display:block;flex-shrink:0}
.brand-name{font-family:var(--display);font-size:22px;font-weight:300;letter-spacing:.05em;color:#fff;white-space:nowrap}
.brand-tm{font-size:8px;font-weight:300;letter-spacing:2.3px;display:inline-block;line-height:1;vertical-align:top;margin-left:4px;opacity:.85}
main{padding:26px 0 8px}
.crumbs{font-size:16px;color:var(--ink3);margin-bottom:20px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{text-decoration:none} .crumbs a:hover{color:#A9A9A9} .crumbs .sep{color:#3a3b40}
h1{font-family:var(--display);font-size:34px;font-weight:400;letter-spacing:.01em;line-height:1.25;overflow-wrap:anywhere}
.lead{font-size:21px;line-height:1.6;color:var(--ink);max-width:var(--col);margin:24px 0 0;text-wrap:pretty}
.muted{color:var(--ink3);font-size:16px;line-height:1.6}

/* ── КОНСТРУКТОР ─────────────────────────────────────────────────────────
   Одна карточка, внутри — группы через волосяные линии (как секции страниц
   дивидендов, только внутри рамки). Поля — в стиле поиска хаба: прозрачный фон,
   рамка --line, ховер/фокус --line2, никакой заливки. */
.builder{margin-top:34px;border:1px solid var(--line);border-radius:var(--rad);background:var(--card);padding:6px 26px 26px}
/* Готовые стратегии — аккордеон: шапка группы (название · число · стрелка как у
   выпадающих списков), внутри чипы. Открытая группа — стрелка перевёрнута. */
.presets{padding:18px 0 14px;border-bottom:1px solid var(--hair)}
.presets-l{display:block;color:var(--ink2);font-size:16px;margin-bottom:10px}
.pgroup{border-top:1px solid var(--hair)}
.pg-h{display:flex;align-items:center;gap:12px;width:100%;padding:11px 0;background:none;border:0;cursor:pointer;font-family:var(--sans);font-size:17px;color:var(--ink);text-align:left}
.pg-h:hover .pg-t,.pg-h:focus-visible .pg-t{color:#fff}
.pg-h:focus-visible{outline:none}
.pg-t{transition:color .13s}
.pg-n{color:var(--ink3);font-size:15px}
.pg-h .dd-arrow{margin-left:auto}
.pgroup.open .pg-h .dd-arrow{transform:rotate(180deg)}
.pg-body{display:none;flex-wrap:wrap;gap:8px 10px;padding:2px 0 14px}
.pgroup.open .pg-body{display:flex}
.preset{font-family:var(--sans);font-size:16px;color:var(--ink2);background:transparent;border:1px solid var(--line);border-radius:var(--rad);padding:8px 14px;cursor:pointer;transition:border-color .13s,color .13s}
.preset:hover{border-color:var(--line2);color:var(--ink)}
.preset.on{background:#18191C;color:var(--ink)}
.bgroup{padding:22px 0 20px;border-bottom:1px solid var(--hair)}
.bh{font-family:var(--display);font-size:20px;font-weight:400;letter-spacing:.02em;margin-bottom:14px}
.brow{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:flex-end}
.brow+.brow{margin-top:14px}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fl{color:var(--ink2);font-size:15px;line-height:1.3}
.fl .opt{color:var(--ink3)}
.fi{font-family:var(--sans);font-size:17px;line-height:1.3;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 12px;outline:none;transition:border-color .2s ease;min-width:0}
.fi:hover,.fi:focus{border-color:var(--line2)}
select.fi{padding-right:34px;cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 19'%3E%3Cpath d='M17.19 18.75c-.4 0-.8-.15-1.1-.46L.46 2.67a1.56 1.56 0 0 1 2.2-2.2l14.53 14.52L31.7.46a1.56 1.56 0 1 1 2.21 2.21L18.29 18.29c-.3.31-.7.46-1.1.46z' fill='%236C6F80'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:14px 8px}
input.fi{height:42px}
input.fi[type=number]{width:150px}
input.fi[type=date]{width:180px;color-scheme:dark}
/* ── ВЫПАДАЮЩИЕ СПИСКИ — как фильтры на главной (.filter-dropdown) ──────
   Нативный <select> скрыт, значение хранит он; рисуем кнопку + меню в стиле
   сайта: рамка #3B3C41, ховер #6C6F80, меню чёрное с рамкой, пункт по ховеру
   #0E0F11, подсветки выбранного нет (на сайте убрана намеренно). Ширина каждого
   списка — под его самый длинный пункт (+62px: поля 12+12, зазор 22, стрелка
   16), как у #filter-* в style.css; мерилось в браузере, не на глаз. */
.dd{position:relative;width:100%}
.dd-native{display:none}
.dd-btn{display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:var(--bg);cursor:pointer;transition:border-color .2s ease;font-family:var(--sans);font-size:17px;line-height:1.3;font-weight:400;letter-spacing:.02em;color:#fff;text-align:left}
.dd-btn:hover,.dd.open .dd-btn,.dd-btn:focus-visible{border-color:var(--line2);outline:none}
.dd-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.dd-arrow{width:16px;height:16px;flex:none;color:#3B3C41;transition:transform .2s ease}
.dd.open .dd-arrow{transform:rotate(180deg)}
.dd-menu{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;background:#000;border:1px solid var(--line);border-radius:12px;overflow:hidden;z-index:100}
.dd.open .dd-menu{display:block}
.dd-item{font-size:17px;letter-spacing:.02em;color:#fff;padding:11px 14px;cursor:pointer;white-space:nowrap;transition:background .15s ease}
.dd-item:hover,.dd-item.focus{background:#0E0F11}
.dd-item.off{color:var(--ink3);cursor:default}
.dd-item.off:hover{background:transparent}
/* замер 12.09.26: «Сбербанк (SBER), дневные свечи 2018—2026» 456, «Пересечение двух
   скользящих средних» 428, «Трейлинг кратный ATR (чандельер)» 388, «Фиксированный,
   % от цены входа» 373, «Риск на сделку, % капитала» 312, «Экспоненциальная (EMA)» 262 */
.dd[data-for=f-ticker]{width:625px}
.dd[data-for=f-split]{width:495px}
.dd[data-for=f-entry]{width:430px}
.dd[data-for=f-stop]{width:390px}
.dd[data-for=f-take]{width:375px}
.dd[data-for=f-size]{width:330px}
.params .dd{width:270px}
.params .dd[data-key=anchor]{width:330px}
.params-inline .dd{width:110px}
/* ширины списков параметров-галочек — под самый длинный пункт + 62px (замер 14.09.2026) */
.params-inline .dd[data-key=after]{width:385px}
.params-inline .dd[data-key=level]{width:305px}
.params-inline .dd[data-key=cross]{width:260px}
.params-inline .dd[data-key=mode]{width:310px}
/* Параметры блока — в один ряд с селектом, поле числа узкое: значения там
   двух-трёхзначные. */
.params{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:flex-end;min-width:0}
.params .fld input.fi{width:120px}
.params:empty,.params[hidden]{display:none}
.params-inline{margin:8px 0 0 30px}
.params-inline .fld{flex-direction:row;align-items:center;gap:10px}
.params-inline .fld input.fi{width:100px;padding:6px 10px;font-size:16px}
.params-inline .dd-btn{padding:6px 10px;font-size:16px}
.params-inline .dd-item{font-size:16px;padding:9px 10px}
.brow-checks{flex-direction:column;align-items:stretch;gap:12px}
.chk-blk{display:flex;flex-direction:column}
.chk{display:flex;align-items:flex-start;gap:12px;cursor:pointer;font-size:17px;color:var(--text);line-height:1.45}
.chk input{appearance:none;-webkit-appearance:none;flex:none;width:20px;height:20px;margin:3px 0 0;border:1px solid var(--line);border-radius:6px;background:var(--bg);cursor:pointer;position:relative;transition:border-color .13s}
.chk:hover input{border-color:var(--line2)}
.chk input:checked{border-color:var(--line2);background:#18191C}
.chk input:checked::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)}
.chk input:focus-visible{outline:2px solid var(--line2);outline-offset:2px}
.pills{display:flex;gap:8px}
.pill{font-family:var(--sans);font-size:16px;color:var(--ink2);background:transparent;border:1px solid var(--line);border-radius:10px;padding:9px 16px;cursor:pointer;transition:border-color .13s}
.pill:hover{border-color:var(--line2)}
.pill.on{background:#18191C;color:var(--ink);border-color:var(--line)}
.bnote{color:var(--ink3);font-size:15px;line-height:1.55;margin:14px 0 0;max-width:110ch}
.bnote:empty{display:none}

/* Замок платного инструмента (Газпром, Лукойл, вечные фьючерсы): та же
   риторика, что у premium-lock на главной, но своя компактная вёрстка —
   style.css сюда не подключён. Кнопка ведёт на главную с #auth=… */
.lock{margin:14px 0 0;padding:20px 22px;border:1px solid var(--line);border-radius:var(--rad);background:var(--card);display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.lock[hidden]{display:none}
.lock-icon{flex:0 0 auto}
.lock-body{flex:1 1 320px;min-width:0}
.lock-title{font-family:var(--display);font-size:20px;color:var(--ink);margin:0 0 6px}
.lock-text{color:var(--ink2);font-size:15px;line-height:1.5;margin:0}
.lock-cta{display:inline-block;margin-top:12px;padding:10px 18px;border-radius:8px;background:var(--brand);color:#111;font-weight:600;font-size:15px;text-decoration:none}
.lock-cta:hover{filter:brightness(1.06)}
.lock-note{display:block;margin-top:8px;color:var(--ink3);font-size:13px}
.brun{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;padding-top:24px}
.run-note{color:var(--ink3);font-size:15px}
.ferr{margin:14px 0 0;padding:12px 0 12px 16px;border-left:3px solid var(--red);color:var(--text);font-size:16px;line-height:1.5}

/* Главная кнопка — та же рамка-перелив, что у «Смотреть аналитику» на первом
   экране: единственная анимированная кнопка сайта отмечает главное действие.
   Механика дословно из style.css (чёрная заливка по padding-box, два
   конических градиента по border-box, смешивание screen) — там она переписана
   29.08.26 без mask-composite ради Android. */
@property --a1{syntax:'<angle>';inherits:true;initial-value:270deg}
@property --a2{syntax:'<angle>';inherits:true;initial-value:100deg}
.run-btn{box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;padding:15px 35px;min-width:313px;height:59px;
  border:1px solid transparent;border-radius:13px;
  background:linear-gradient(#000,#000) padding-box,
    conic-gradient(from var(--a1) at 50% 50%,#111112 0deg,#898C9A 3deg,#898C9A 20deg,#111112 40deg,#111112 360deg) border-box,
    conic-gradient(from var(--a2) at 50% 50%,#111112 0deg,#575963 10deg,#575963 20deg,#111112 90deg,#111112 360deg) border-box;
  background-blend-mode:normal,screen,normal;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
  font-family:var(--display);font-size:18px;font-weight:300;letter-spacing:.01em;color:#fff;cursor:pointer;white-space:nowrap;outline:none;
  --a1:270deg;--a2:100deg;transition:--a1 .5s linear,--a2 .6s linear}
.run-btn:hover{--a1:450deg;--a2:280deg}
.run-btn:disabled{opacity:.55;cursor:default}
.run-btn:focus-visible{outline:2px solid var(--line2);outline-offset:3px}

/* ── ИСТОРИЯ ПРОГОНОВ ─────────────────────────────────────────────────────── */
.hist{margin-top:14px;border:1px solid var(--line);border-radius:var(--rad);background:var(--card);overflow:hidden}
.hist summary{cursor:pointer;padding:15px 20px;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;font-weight:600;font-size:var(--fs)}
.hist summary::-webkit-details-marker{display:none}
.hist summary:hover{color:#fff}
.hist-sub{color:var(--ink3);font-size:15px;font-weight:400}
.histt{width:100%;border-collapse:collapse;font-size:16px}
.histt th,.histt td{text-align:left;padding:9px 12px;border-top:1px solid var(--hair);white-space:nowrap}
.histt th:first-child,.histt td:first-child{padding-left:20px}
.histt th:last-child,.histt td:last-child{padding-right:20px}
.histt th{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);font-weight:600}
.histt td{color:var(--text)} .histt td.dim{color:var(--ink3)}
.histt td:nth-child(2){white-space:normal;min-width:180px}   /* описание переносится — остальное цифры */
.histt td.num,.histt th.num{text-align:right;font-variant-numeric:tabular-nums}
.histt tbody tr{cursor:pointer;transition:background .13s}
.histt tbody tr:hover{background:#0e0f11}
.histt td.good{color:var(--green)} .histt td.bad{color:var(--red)}
/* лучший Шарп — фирменным жёлтым, как «вы сейчас здесь» на страницах дивидендов */
.histt tr.best td:nth-child(2){color:var(--brand)}
.hist-foot{display:flex;justify-content:flex-end;padding:10px 20px 16px;border-top:1px solid var(--hair)}

/* ── РЕЗУЛЬТАТ ───────────────────────────────────────────────────────────── */
.result{margin-top:46px;padding-top:30px;border-top:1px solid var(--line)}
.rh{font-family:var(--display);font-size:27px;font-weight:400;letter-spacing:.01em;line-height:1.25}
.verdict{font-size:21px;line-height:1.55;color:var(--ink);margin:14px 0 0;max-width:var(--col);text-wrap:pretty}
.verdict b{font-weight:600}
.verdict .good{color:var(--green)} .verdict .bad{color:var(--red)} .verdict .warn{color:var(--amber)}
/* Плитки: подпись капсом 15px, значение крупно пропорциональными цифрами
   (tabular-nums только в таблицах), подстрочник — та же метрика у «купил и
   держи», чтобы сравнение было в каждой плитке, а не в отдельной таблице. */
/* 200px × 6 + 5 зазоров = 1 260px — влезает в контент 1 286px одной строкой. */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px;margin-top:24px}
.tile{border:1px solid var(--line);border-radius:var(--rad);background:var(--card);padding:16px 18px 14px;min-width:0}
.tile .tl{display:block;color:var(--ink3);font-size:15px;text-transform:uppercase;letter-spacing:.05em;line-height:1.3}
.tile .tv{display:block;font-size:32px;font-weight:600;line-height:1.2;margin-top:8px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .tv.good{color:var(--green)} .tile .tv.bad{color:var(--red)}
.tile .ts{display:block;color:var(--ink2);font-size:15px;margin-top:6px;line-height:1.4}

/* График — карточка с шапкой: заголовок слева, легенда справа. Сам SVG
   рисуется скриптом под реальную ширину контейнера (текст не масштабируется
   вместе с осями, как было бы у viewBox). */
.chart-card{margin-top:22px;border:1px solid var(--line);border-radius:var(--rad);background:var(--card);padding:18px 20px 10px}
.chart-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin-bottom:6px}
.ch{font-family:var(--display);font-size:20px;font-weight:400;letter-spacing:.01em}
.ctabs{display:flex;gap:8px}
.ctab{font-family:var(--sans);font-size:15px;color:var(--ink2);background:transparent;border:1px solid var(--line);border-radius:10px;padding:6px 14px;cursor:pointer;transition:border-color .13s}
.ctab:hover{border-color:var(--line2)} .ctab.on{background:#18191C;color:var(--ink)}
.legend{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px;color:var(--ink2)}
.legend span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.legend i{display:inline-block;width:18px;height:0;border-top:2px solid var(--ink3)}
.legend i.s{border-color:var(--brand)} .legend i.b{border-color:var(--line2)} .legend i.sp{border-top-style:dashed;border-color:var(--ink3)}
.chart{position:relative;width:100%;min-height:200px}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart .grid{stroke:var(--hair);stroke-width:1}
.chart .ax{fill:var(--ink3);font-family:var(--sans);font-size:13px}
.chart .ln-s{fill:none;stroke:var(--brand);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .ln-b{fill:none;stroke:var(--line2);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .split{stroke:var(--ink3);stroke-width:1;stroke-dasharray:4 5}
.chart .split-l{fill:var(--ink3);font-family:var(--sans);font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.chart .end-l{fill:var(--ink2);font-family:var(--sans);font-size:13px}
.chart .cross{stroke:var(--line2);stroke-width:1;pointer-events:none}
.chart .dot{fill:var(--bg);stroke-width:2;pointer-events:none}
.chart .dot.s{stroke:var(--brand)} .chart .dot.b{stroke:var(--line2)}
.chart .hit{fill:transparent;cursor:crosshair}
.tip{position:absolute;top:0;left:0;pointer-events:none;background:#0E0F11;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:14px;line-height:1.5;color:var(--text);white-space:nowrap;z-index:2;box-shadow:0 6px 24px rgba(0,0,0,.45)}
.tip b{color:var(--ink);font-weight:600}
.tip .k{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:7px;vertical-align:-1px}
.tip .k.s{background:var(--brand)} .tip .k.b{background:var(--line2)}

.rblock{margin-top:34px}
.rhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:12px}
.rsub{color:var(--ink3);font-size:15px}
/* Опорные линии — три карточки в ряд; вердикт словом + цветом, никогда цветом
   одним. Число — та же метрика, что у стратегии, чтобы сравнивать глазами. */
.refs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px;margin-top:12px}
.ref{border:1px solid var(--line);border-radius:var(--rad);background:var(--card);padding:16px 18px;display:flex;flex-direction:column}
.ref .rn{display:block;font-family:var(--display);font-size:19px;font-weight:400;letter-spacing:.01em;margin-bottom:8px}
.ref .rv{display:block;font-size:17px;color:var(--text);line-height:1.5}
.ref .rv b{color:var(--ink);font-weight:600;white-space:nowrap}
.ref .rj{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:12px;font-size:15px;font-weight:600;letter-spacing:.01em}
.ref .rj::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;flex:none}
.rj.good{color:var(--green)} .rj.bad{color:var(--red)} .rj.warn{color:var(--amber)} .rj.none{color:var(--ink3)}
.flags{list-style:none;margin:12px 0 0;padding:0}
.flags li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--hair);font-size:17px;line-height:1.5;color:var(--text)}
.flags li:last-child{border-bottom:none}
.flags .fdot{flex:none;width:10px;height:10px;border-radius:50%;margin-top:9px}
.flags .fdot.red{background:var(--red)} .flags .fdot.yellow{background:var(--amber)} .flags .fdot.ok{background:var(--green)} .flags .fdot.session{background:var(--line2)}
.flags .fl-l{color:var(--ink3);font-size:15px;text-transform:uppercase;letter-spacing:.04em;margin-right:8px}

/* Таблица сделок — линии строк без рамки, как везде на сайте. */
.tbl-wrap{overflow-x:auto}
table.trades{width:100%;border-collapse:collapse;font-size:16px}
.trades th,.trades td{text-align:left;padding:11px 0;border-bottom:1px solid var(--hair);white-space:nowrap}
.trades th+th,.trades td+td{padding-left:18px}
.trades th{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);font-weight:600;line-height:1.3}
.trades td{color:var(--text)}
.trades td.num,.trades th.num{text-align:right;font-variant-numeric:tabular-nums}
.trades td.good{color:var(--green)} .trades td.bad{color:var(--red)}
.trades td.dim{color:var(--ink3)}
.trades tbody tr:last-child td{border-bottom:none}
.trades .side-l{color:var(--green)} .trades .side-s{color:var(--red)}
/* Компактная карточка сделки для телефона живёт в той же строке, что и
   полные ячейки: на ПК её не видно, на ≤1023px видно только её. Одна
   разметка — два вида, без второго рендера. */
.trades td.tt{display:none}
.more-row{display:flex;justify-content:center;margin-top:14px}
.more-btn{font-family:var(--sans);font-size:16px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:10px 18px;cursor:pointer;transition:border-color .13s}
.more-btn:hover{border-color:var(--line2)}

.rdetails{margin-top:34px;border-top:1px solid var(--hair)}
.rdetails summary{cursor:pointer;padding:17px 0;font-weight:600;font-size:var(--fs);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
.rdetails summary::-webkit-details-marker{display:none}
.rdetails summary::after{content:"";width:9px;height:9px;border:solid var(--ink3);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .2s;flex:none;margin-right:4px}
.rdetails[open] summary::after{transform:rotate(-135deg)}
.rdetails summary:hover{color:#fff}
/* 380px: таблица «настройка/проверка» с подстрочниками B&H влезает без скролла;
   на ПК три карточки в ряд, счётчики — четвёртой, им узкая колонка к лицу. */
.rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:14px;padding-bottom:6px}
.dc{border:1px solid var(--line);border-radius:var(--rad);background:var(--card);padding:16px 18px;min-width:0}
.dc .tw{overflow-x:auto}
.dc h4{font-family:var(--display);font-size:18px;font-weight:400;letter-spacing:.01em;margin:0 0 10px}
.dc table{width:100%;border-collapse:collapse;font-size:16px}
.dc th,.dc td{padding:8px 0;border-bottom:1px solid var(--hair);text-align:left}
.dc th+th,.dc td+td{padding-left:14px}
.dc th{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);font-weight:600}
.dc td{color:var(--text)}
.dc td.num,.dc th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dc td.good{color:var(--green)} .dc td.bad{color:var(--red)}
.dc td small{display:block;font-size:13px;color:var(--ink3);font-weight:400;line-height:1.3}
.dc tbody tr:last-child td{border-bottom:none}
.dc .note{color:var(--ink3);font-size:14px;line-height:1.5;margin:10px 0 0}
.ystrip{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:2px 0 0;padding:0}
.ys{font-size:15px;font-weight:600;line-height:1.15;padding:7px 10px;border-radius:9px;border:1px solid var(--line);color:var(--ink2);background:transparent;text-align:center;font-variant-numeric:tabular-nums}
.ys small{display:block;font-weight:400;color:var(--ink3);font-size:13px}
.ys.up{border-color:rgba(76,175,80,.45);color:var(--ink)} .ys.dn{border-color:rgba(239,83,80,.45);color:var(--ink)}
.rfoot{color:var(--ink3);font-size:15px;line-height:1.55;margin:26px 0 0}

/* Плавающая кнопка к форме: появляется, когда конструктор ушёл вверх, а
   результат на экране, — правки без прокрутки в полтора экрана. */
/* Кнопка фиксирована к окну, поэтому её правый край считаем от колонки
   контента: .wrap = min(1366px, 100% − 40px) по центру + внутренний отступ
   20px → на широком экране (100% − 1366px)/2 + 20px, на узком — 40px. Иначе
   на 1920px кнопка висела за правым краем карточки (замечание юзера 17.09). */
.tostrat{position:fixed;right:max(40px,calc((100% - 1366px) / 2 + 20px));bottom:20px;z-index:50;font-family:var(--sans);font-size:15px;color:var(--ink);background:#0E0F11;border:1px solid var(--line);border-radius:12px;padding:10px 16px;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.55);transition:border-color .13s}
.tostrat:hover{border-color:var(--line2)}

/* ── ТЕКСТ ПОД ТЕСТЕРОМ ───────────────────────────────────────────────────── */
.about-tester{margin-top:46px;padding-top:30px;border-top:1px solid var(--line)}
.about-tester h2{font-family:var(--display);font-size:27px;font-weight:400;letter-spacing:.01em;line-height:1.25;margin-bottom:18px}
.about-tester p{margin:0 0 14px;max-width:var(--col);color:var(--text)}
.rules{list-style:none;margin:0 0 18px;padding:0;max-width:var(--col)}
.rules li{padding:12px 0 12px 22px;border-bottom:1px solid var(--hair);color:var(--text);line-height:1.6;position:relative}
.rules li::before{content:"";position:absolute;left:0;top:23px;width:8px;height:8px;border-radius:50%;background:var(--line2)}
.rules li:last-child{border-bottom:none}
.rules b{color:var(--ink);font-weight:600}
.xlinks{display:flex;justify-content:center;margin-top:36px}
.xlink-home{display:block;width:100%;max-width:498px;text-align:center;border:1px solid var(--line);border-radius:var(--rad);padding:14px 18px;font-size:var(--fs);color:var(--ink);line-height:1.45}
.xlink-home:hover{border-color:var(--line2)}
.xlink-home .xh-t{display:block}
.xlink-home .xh-d{display:block;margin-top:5px;font-size:15px;color:var(--ink2)}
.xlink-home:hover .xh-d{color:var(--text)}

/* ── СРАВНЕНИЕ И ЧАСТЫЕ ВОПРОСЫ (SEO-блоки, 17.09.2026) ─────────────────────
   Таблица сравнения — те же линии и кегль, что у журнала сделок, но ячейки
   переносятся: это текст, а не числа. На телефоне строка = карточка, подпись
   колонки берётся из data-l (как у журнала). FAQ — компонент блога и
   /dividendy/ один в один (<details> + шеврон #icon-arrow). */
table.cmp{width:100%;border-collapse:collapse;font-size:16px;max-width:var(--col)}
.cmp th,.cmp td{text-align:left;vertical-align:top;padding:11px 0;border-bottom:1px solid var(--hair);line-height:1.5}
.cmp th+th,.cmp td+td,.cmp th+td{padding-left:18px}
.cmp thead th{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);font-weight:600;line-height:1.3}
.cmp tbody th{color:var(--ink);font-weight:600;width:24%}
.cmp td{color:var(--text)}
.cmp td:first-of-type{color:var(--ink)}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:none}
.cmp-sec .muted{margin-top:16px}
.xl-sec{border-top:none;padding-top:0;margin-top:0}
.sec-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sec-h h2{font-family:var(--display);font-size:var(--fs);letter-spacing:.12em;text-transform:uppercase;color:#fff;font-weight:400}
.sec-h .line{flex:1;height:1px;background:var(--line)}
.faq{margin-top:44px;max-width:var(--col)}
.faq details{border:1px solid var(--line);border-radius:var(--rad);background:var(--card);margin-bottom:10px;transition:border-color .13s}
.faq details:hover{border-color:var(--line2)}
.faq summary{cursor:pointer;padding:16px 18px;font-weight:600;font-size:var(--fs);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] summary{border-bottom:1px solid var(--hair)}
.faq summary .chev{width:16px;height:10px;color:var(--ink3);fill:currentColor;transition:transform .2s;flex:0 0 auto}
.faq details[open] summary .chev{transform:rotate(180deg)}
.faq .ans{padding:14px 18px 16px;color:var(--text);font-size:var(--fs);line-height:1.7;letter-spacing:.02em}
.faq .ans b{color:#fff} .faq .ans a{color:var(--text);text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px}
.faq .ans a:hover{color:#fff}

/* ── ФУТЕР ────────────────────────────────────────────────────────────────── */
.pfoot{border-top:1px solid #111;margin-top:44px;padding:24px 0 10px;color:var(--ink3);font-size:16px}
.pfoot .disc{border:1px solid var(--line);border-radius:var(--rad);padding:14px 16px;background:#070809;color:var(--ink2);margin-bottom:18px;font-size:16px;line-height:1.55}
.pfoot .fnav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 14px;font-size:16px}
.pfoot .fnav a{text-decoration:none}
.pfoot .fnav a:hover{color:#A9A9A9}
.pfoot .fnav .sep{color:#3a3b40;user-select:none}
.pfoot .fcopy{text-align:center;font-family:var(--display);font-size:16px;font-weight:400;letter-spacing:.04em;color:var(--ink3);margin-top:14px}

/* ── АДАПТИВ: ступени сайта 1279 / 1023 / 767 ─────────────────────────────── */
/* Узкий ПК (1024–1279): 12 колонок журнала в 1 000px не влезают (замер 1100px:
   1 142 > 1 020) — жмём отбивку и кегль, колонку стопа прячем: она есть в R. */
@media (min-width:1024px) and (max-width:1279px){
  table.trades{font-size:15px}
  .trades th+th,.trades td+td{padding-left:12px}
  .trades .c-stop{display:none}}
@media (max-width:1023px){
  .builder{padding:4px 18px 20px}
  .dd[data-for]{width:100%}
  .params .dd,.params .dd[data-key]{width:100%}
  /* параметры-галочки: подпись над полем, иначе список на 100 % + подпись в строке вылезают за край */
  .params-inline .fld{flex-direction:column;align-items:stretch;gap:6px;min-width:0}
  .fld{flex:1 1 220px}
  .fld-dir{flex:1 1 100%}
  .params{flex:1 1 100%}
  .params .fld{flex:1 1 140px}
  .params .fld input.fi{width:100%}
  .params .fld select.fi{min-width:0;width:100%}
  input.fi[type=number],input.fi[type=date]{width:100%}
  /* Журнал сделок → компактные карточки (три строки на сделку), без
     горизонтального скролла. 12 подписанных строк на сделку дали бы
     страницу в 25 000px на 30 сделках — замерено 12.09.26. */
  .trades thead{display:none}
  .trades,.trades tbody,.trades tr,.trades td{display:block;width:auto}
  .trades tr{border:1px solid var(--line);border-radius:var(--rad);background:#0E0F11;padding:11px 14px;margin-bottom:10px}
  .trades td{display:none;border-bottom:none;padding:0;white-space:normal;text-align:left}
  .trades td+td{padding-left:0}
  .trades td.tt{display:block;font-size:15px;color:var(--text);line-height:1.5}
  .trades .tt .t1{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 12px;font-size:16px;color:var(--ink)}
  .trades .tt .t1 b{font-weight:600;white-space:nowrap}
  .trades .tt .t2,.trades .tt .t3{margin-top:3px}
  .trades .tt .t3{color:var(--ink3);font-size:14px}
  .trades .tt .good{color:var(--green)} .trades .tt .bad{color:var(--red)}
  .trades tbody tr:last-child td{border-bottom:none}}
@media (max-width:767px){
  /* сравнение: строка → карточка, подпись колонки из data-l */
  .cmp thead{display:none}
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:auto}
  .cmp tr{border:1px solid var(--line);border-radius:var(--rad);background:#0E0F11;padding:11px 14px;margin-bottom:10px}
  .cmp tbody th{padding:0 0 6px;border-bottom:1px solid var(--hair);width:auto;font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3)}
  .cmp td,.cmp th+td,.cmp td+td{padding:7px 0 0;border-bottom:none;font-size:15px}
  .cmp td::before{content:attr(data-l) ": ";color:var(--ink3)}
  .cmp tbody tr:last-child td{border-bottom:none}
  .faq summary{padding:13px 14px;font-size:16px}
  .faq .ans{padding:12px 14px 14px;font-size:16px}
  :root{--fs:16px}
  h1{font-size:26px}
  .lead{font-size:18px;line-height:1.62}
  .rh,.about-tester h2{font-size:22px}
  .verdict{font-size:18px}
  .builder{margin-top:26px;padding:2px 14px 16px}
  .bgroup{padding:18px 0 16px}
  .bh{font-size:18px}
  .brow{gap:12px 16px}
  .fld{flex:1 1 100%}
  .params .fld{flex:1 1 100%}
  .params-inline{margin-left:0;margin-top:10px}
  .params-inline .fld{flex-direction:column;align-items:stretch;gap:6px}
  .params-inline .fld input.fi{width:100%}
  .params-inline .dd,.params-inline .dd[data-key]{width:100%}
  .dd-btn{font-size:16px;gap:12px}
  .dd-item{white-space:normal;font-size:16px}
  .histt .h-mdd,.histt .h-fl{display:none}
  .histt th,.histt td{padding:8px 8px}
  .histt th:first-child,.histt td:first-child{padding-left:14px}
  .histt th:last-child,.histt td:last-child{padding-right:14px}
  .hist summary{padding:13px 14px}
  .hist-foot{padding:8px 14px 14px}
  .tostrat{right:12px;bottom:12px;padding:9px 13px;font-size:14px}
  .pills{flex-wrap:wrap}
  .pill{flex:1 1 auto;text-align:center}
  .run-btn{width:100%;min-width:0;padding:15px 16px;font-size:17px}
  .brun{gap:10px}
  .tiles{gap:10px}
  .tile{padding:14px 14px 12px}
  .tile .tv{font-size:26px}
  .chart-card{padding:14px 12px 8px}
  .chart .ax,.chart .split-l,.chart .end-l{font-size:12px}
  .ref{padding:14px}
  .refs,.rgrid{gap:10px}
  /* Таблицы подробностей: на 310px три колонки с подстрочниками B&H влезают
     только с узкой отбивкой и кеглем на пункт меньше — иначе внутренний скролл. */
  .dc table{font-size:15px}
  .dc th+th,.dc td+td{padding-left:10px}
  .dc th{font-size:12px;letter-spacing:.03em}
  .dc td small{font-size:12px}
  .xlink-home{max-width:none;padding:13px 14px}
  .xlink-home .xh-d{font-size:14px}
  .pfoot .fnav{gap:8px 10px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}