/* Фонды (БПИФ) и фонды недвижимости (ЗПИФ) в облике Coinbase.
 * Общая основа (палитра, шрифт, заголовок, мультиселект, шапка, подвал) -
 * в cb-skin.css, здесь своё у этих двух страниц: у них одинаковая строка
 * фильтров в линию и одинаковая таблица без обёртки .scroll-классов
 * облигаций, поэтому файл один на обе.
 *
 * Лайм здесь остаётся знаком бренда: черта под заголовком и кнопка
 * Telegram-блока на чёрном. Выбранное и действие - синие, как в
 * облигациях и акциях.
 */

/* ── заголовок ─────────────────────────────────────────────────────────── */
html.cb main .sub { font-size: 15px; line-height: 1.55; color: var(--c-ink3); }
html.cb main .sub a { color: var(--acc); }
html.cb main .sub a:hover { text-decoration: underline; text-underline-offset: 3px; }
html.cb main .status { font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--c-ink3); }
html.cb main .status .live { color: var(--c-up); font-weight: 600; }
html.cb main .status .stale { color: var(--c-dn); font-weight: 600; }

/* ── строка фильтров ───────────────────────────────────────────────────── */
/* Панелью, как в облигациях и акциях: фильтры - один блок над таблицей,
   а не россыпь пилюль по фону страницы. */
html.cb main .filters { background: var(--pnl); border: 1px solid var(--line); border-radius: 20px;
  padding: 14px 16px; gap: 8px; margin: 24px 0 16px; }
html.cb main .filters .tag, html.cb main .tag { font-size: 13px; font-weight: 500; letter-spacing: 0;
  text-transform: none; color: var(--c-ink3); margin: 0 6px 0 4px; }
html.cb main .filters select, html.cb main .filters input, html.cb main .filters .msel-btn {
  height: 42px; min-height: 42px; padding: 0 16px; border-radius: 999px; border: 1px solid transparent;
  background-color: var(--pnl2); color: var(--c-ink); font-size: 14px; font-weight: 500;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease; -moz-appearance: textfield; }
html.cb main .filters select { padding-right: 36px; }
/* Ширину полей задаём сами: по умолчанию браузер даёт полю ввода двадцать
   знаков, и у недвижимости кнопка сброса одна уезжала на вторую строку. */
html.cb main .filters input { width: 160px; }
html.cb main .filters input#search { width: 236px; }
html.cb main .filters .msel-val { font-weight: inherit; }
html.cb main .filters input::-webkit-outer-spin-button,
html.cb main .filters input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
html.cb main .filters input::placeholder { color: var(--c-ink3); opacity: 1; }
html.cb main .filters :is(select, input, .msel-btn):hover { background-color: var(--pnl3); }
html.cb main .filters :is(select, input):focus, html.cb main .filters .msel-btn:focus-visible,
html.cb main .filters .msel-btn[aria-expanded="true"] {
  outline: none; background-color: var(--pnl) !important; border-color: var(--acc) !important;
  box-shadow: 0 0 0 3px var(--acc-ring); }
html.cb main .filters .msel-chev { color: var(--c-ink3); }
html.cb main .filters input.on, html.cb main .filters select.on, html.cb main .filters .msel.has-val .msel-btn {
  background-color: var(--acc-soft) !important; border-color: transparent !important;
  color: var(--acc) !important; font-weight: 600; }
html.cb main .filters .msel.has-val .msel-chev { color: var(--acc); }
html.cb main .filters .msel-pop { border-radius: 16px; }

html.cb main .resetbtn { height: 42px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--line2);
  background: var(--pnl); color: var(--c-ink2); font-size: 14px; font-weight: 600; }
html.cb main .resetbtn:hover { background: var(--pnl2); border-color: var(--line2); color: var(--c-ink); }
html.cb main .resetbtn.show { background: var(--acc-soft); border-color: transparent; color: var(--acc); }
html.cb main .resetbtn.show:hover { background: var(--acc); color: var(--acc-ink); }
html.cb main .resetbtn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--acc-ring); border-color: var(--acc); }

html.cb main .click-hint { font-size: 13px; color: var(--c-ink3); }
html.cb main .click-hint svg { color: var(--acc); }

/* ── таблица ───────────────────────────────────────────────────────────── */
html.cb main .tablewrap { border-radius: 20px; border: 1px solid var(--line); box-shadow: none; background: var(--pnl); }
html.cb main .scroll { scrollbar-width: thin; scrollbar-color: var(--line2) transparent; border-radius: 20px; }
/* Таблица ровно на экран (Женя, 28.09.2026, как у облигаций): докрутил до
   строки итога - таблица достаёт до низа окна, шапка таблицы липнет внутри
   неё. 86 = отступ под шапкой 12 + строка итога 32 и 10 под ней + рамка и
   полоса прокрутки 16 + отступ снизу 16. Шапку сайта меряет lib/screen-share.js. */
@media (min-width: 768px) {
  html.cb main .ss-bar ~ .tablewrap .scroll { overflow: auto; max-height: max(360px, calc(100dvh - var(--ss-hdr, 71px) - 86px)); }
  /* Верхнюю полосу прокрутки ui-scroll.js прячет, когда таблица влезает по
     ширине (узкие колонки после фильтра): тогда её 14 пикселей отдаём таблице. */
  html.cb main .ss-bar ~ .tablewrap:has(> .hbar[style*="none"]) .scroll { max-height: max(360px, calc(100dvh - var(--ss-hdr, 71px) - 72px)); }
}
html.cb main .scroll::-webkit-scrollbar { width: 10px; height: 10px; }
html.cb main .scroll::-webkit-scrollbar-thumb { background: var(--line2); border-radius: 99px; border: 3px solid var(--pnl); }
html.cb main .scroll::-webkit-scrollbar-track { background: transparent; }
html.cb main .hbar { height: 12px; margin: 6px 18px -4px; scrollbar-width: thin; scrollbar-color: var(--line2) transparent; }
html.cb main .hbar::-webkit-scrollbar { height: 6px; }
html.cb main .hbar::-webkit-scrollbar-thumb { background: var(--line2); border-radius: 99px; }

html.cb main table { font-size: 14px; }
html.cb main thead th { background: var(--pnl); color: var(--c-ink3); font-size: 13px; font-weight: 500;
  letter-spacing: 0; text-transform: none; padding: 15px 14px 13px; border-bottom: 1px solid var(--line); }
html.cb main thead th:hover { color: var(--c-ink); }
html.cb main thead th .sar { color: var(--acc); }
/* Отсортированная колонка отмечена цветом подписи и стрелкой, а не
   лаймовой заливкой всей шапки колонки. */
html.cb main thead th.sorted, html.cb main thead th.sorted.stick { background: var(--pnl); color: var(--c-ink); font-weight: 600; }
html.cb main thead th:first-child, html.cb main tbody td:first-child { padding-left: 20px; }

html.cb main tbody td { padding: 13px 14px; border-bottom: 1px solid var(--line); color: var(--c-ink); font-weight: 450; }
html.cb main tbody tr { transition: background-color .12s ease; }
html.cb main tbody tr:hover { background: var(--pnl2); }
html.cb main tbody tr:hover td.stick { background: var(--pnl2); }
html.cb main tbody tr:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; }
html.cb main th.stick, html.cb main td.stick { background: var(--pnl); border-right-color: var(--line); }
html.cb main thead th.stick { background: var(--pnl); }

html.cb main .fund, html.cb main .fund-link, html.cb main .uk-link { font-weight: 600; color: var(--c-ink); letter-spacing: -.01em; }
html.cb main .fund-link:hover, html.cb main .uk-link:hover { color: var(--acc); text-decoration: none; }
html.cb main .fund-name svg { color: var(--acc); }
html.cb main .fund-meta, html.cb main .subvalue { font-size: 12px; font-weight: 400; color: var(--c-ink3); }
html.cb main .uk-ava { border-radius: 50%; border-color: var(--line); }
/* Знак фонда в недвижимости - того же размера, что знак эмитента в
   размещениях (34px): 28px рядом с ними читался мелким. */
html.cb main .uk-ava { width: 34px; height: 34px; flex-basis: 34px; }
html.cb main .uk-logo { border-radius: 50%; }
/* Знак УК в круге: 22px читался точкой рядом с 14px названием. Картинку
   вписывает lib/logo-fit.js, поэтому без отступов. */
html.cb main .uk-cell .uk-logo { width: 30px; height: 30px; flex-basis: 30px; outline: 1px solid rgba(12,12,14,.08); outline-offset: -1px; }
html.cb main .uk-logo.is-fit { padding: 0; object-fit: cover; background: none; }
html.cb main .price { font-size: 14.5px; font-weight: 600; color: var(--c-ink); }
html.cb main .chg { font-weight: 500; }
html.cb main .chg.up, html.cb main .val-pos { color: var(--c-up); }
html.cb main .chg.down, html.cb main .val-neg { color: var(--c-dn); }
html.cb main .chg.zero, html.cb main .soonv, html.cb main .lvl, html.cb main .seg, html.cb main .small { color: var(--c-ink3); }
html.cb main .bench { font-size: 13px; color: var(--c-ink2); }

/* Метки - пилюли обычным регистром. Тикер больше не лаймовая плашка:
   лайм на каждой строке превращал таблицу в зебру из акцента. */
html.cb main .tick { background: var(--pnl2); color: var(--c-ink); font-size: 12.5px; font-weight: 600;
  padding: 3px 9px; border-radius: 999px; }
html.cb main .uk { background: var(--pnl2); color: var(--c-ink2); font-size: 12px; font-weight: 600;
  letter-spacing: 0; padding: 3px 10px; border-radius: 999px; }
html.cb main a.uk:hover { background: var(--acc-soft); color: var(--acc); }
html.cb main .typ { background: var(--acc-soft); color: var(--acc); font-size: 12px; font-weight: 600;
  padding: 3px 10px; border-radius: 999px; }
html.cb main .ap { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
html.cb main .ap.pas { background: var(--acc-soft); color: var(--acc); }
html.cb main .ap.act { background: var(--c-vio-soft); color: var(--c-vio); }
html.cb main .otc { border-radius: 999px; padding: 1px 7px; font-size: 11px; border-color: var(--line2);
  background: none; color: var(--c-ink3); }
html.cb main .badge { font-size: 12px; font-weight: 600; }
html.cb main .badge.good { background: var(--c-up-soft); color: var(--c-up); }
html.cb main .badge.bad { background: var(--c-dn-soft); color: var(--c-dn); }
html.cb main .badge.warn { background: var(--c-amb-soft); color: var(--c-amb); }
html.cb main .badge.neutral { background: var(--pnl2); color: var(--c-ink2); }
html.cb main .badge.closing { font-size: 11px; }
html.cb main .suspect-mark { background: var(--c-amb-soft); color: var(--c-amb); }
html.cb main .open-btn { border: 0; border-radius: 999px; background: var(--acc-soft); color: var(--acc);
  font-size: 12.5px; font-weight: 600; padding: 7px 13px; }
html.cb main .open-btn:hover { background: var(--acc); color: var(--acc-ink); }
html.cb main .detbtn { background: var(--pnl2); border-radius: 999px; color: var(--c-ink3); }
html.cb main .detbtn:hover { background: var(--acc-soft); color: var(--acc); }

html.cb main th .q { width: 15px; height: 15px; border-color: var(--line2); color: var(--c-ink3); font-size: 9.5px; }
html.cb main th .q:hover { border-color: var(--acc); color: var(--acc); background: var(--acc-soft); }
html.cb main th .q:hover::after, html.cb main [data-tip]:hover::after {
  border-radius: 12px; padding: 10px 13px; font-size: 12.5px; font-weight: 450; line-height: 1.45;
  letter-spacing: 0; box-shadow: 0 12px 32px rgba(10,11,13,.24); }

html.cb main .count { font-size: 13px; color: var(--c-ink3); margin-top: 14px; }
html.cb main .seo { border-radius: 20px; border-color: var(--line); background: var(--pnl); color: var(--c-ink2); }
html.cb main .seo h2 { letter-spacing: -.025em; color: var(--c-ink); }
html.cb main .seo a { color: var(--acc); }

@media (max-width: 860px) {
  html.cb main .filters { padding: 12px; border-radius: 16px; }
  html.cb main .filters :is(select, input, .msel-btn) { height: 44px; min-height: 44px; font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html.cb main * { transition: none !important; }
}

/* ── «Тип фонда»: варианты с подписью (09.10.2026) ─────────────────────── */
/* Чем БПИФ отличается от ОПИФ, человек читает в самом варианте, без
   подсказки по наведению: так же на телефоне. Футер «Выбрать все /
   Сбросить» у двух вариантов не нужен - вариант снимается вторым нажатием.
   Специфичность выше общего вида таблеток (cb-skin: html.cb main .chip). */
.msel-grid.msel-rows { display: flex; flex-direction: column; gap: var(--cf-space-2); min-width: 300px; }
.msel-grid .chip.chip-opt { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto;
  column-gap: var(--cf-space-12); row-gap: var(--cf-space-2); align-items: center; width: 100%;
  min-height: 0; padding: var(--cf-space-10) var(--cf-space-12); border: 0; border-radius: var(--cf-radius-md);
  background: transparent; color: var(--cf-ink); text-align: left; line-height: 1.3; white-space: normal;
  transition: background-color var(--cf-dur-fast) ease, transform var(--cf-dur-press) var(--cf-ease); }
.chip-opt-t { grid-column: 1; font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }
.chip-opt-d { grid-column: 1; font-size: 12.5px; font-weight: 400; color: var(--cf-ink-3); }
.chip-opt-check { grid-column: 2; grid-row: 1 / span 2; color: var(--cf-accent); opacity: 0;
  transform: scale(0.85); transition: opacity var(--cf-dur-fast) ease-out, transform var(--cf-dur-fast) ease-out; }
@media (hover: hover) and (pointer: fine) {
  .msel-grid .chip.chip-opt:hover { background: var(--cf-surface-2); color: var(--cf-ink); }
}
.msel-grid .chip.chip-opt:active { transform: scale(0.98); }
.msel-grid .chip.chip-opt[aria-pressed="true"] { background: var(--cf-accent-soft); color: var(--cf-ink); }
.msel-grid .chip.chip-opt[aria-pressed="true"] .chip-opt-t { color: var(--cf-accent); }
.msel-grid .chip.chip-opt[aria-pressed="true"] .chip-opt-d { color: var(--cf-ink-2); }
.msel-grid .chip.chip-opt[aria-pressed="true"] .chip-opt-check { opacity: 1; transform: none; }
.msel-grid .chip.chip-opt:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 1px; }
@media (max-width: 767px) {
  .msel-grid.msel-rows { min-width: 0; }
  .msel-grid .chip.chip-opt { min-height: 56px; padding: var(--cf-space-12) var(--cf-space-14); }
}
@media (prefers-reduced-motion: reduce) {
  .msel-grid .chip.chip-opt, .chip-opt-check { transition: none; }
  .msel-grid .chip.chip-opt:active { transform: none; }
}


/* ── скринер фондов: компактная таблица (Женя, 13.10.2026) ────────────────
   Описание слева, цифры справа. Цифровые колонки сжаты до своих чисел,
   подпись переносится в две строки (последнее слово и «?» не отрываются).
   Лишняя ширина уходит в колонку «Фонд», а не в дыры между цифрами.
   Длинные название и УК режутся многоточием, полный текст - в title. Тип фонда не режем: это категория, по ней выбирают. */
html.cb main table.ft { min-width: 0; }
html.cb main table.ft thead th { white-space: normal; vertical-align: bottom; line-height: 1.3; width: 1px; padding-left: 11px; padding-right: 11px; }
html.cb main table.ft tbody td { padding-left: 11px; padding-right: 11px; }
html.cb main table.ft thead th:first-child, html.cb main table.ft tbody td:first-child { padding-left: 20px; }
html.cb main table.ft thead th:last-child, html.cb main table.ft tbody td:last-child { padding-right: 20px; }
html.cb main table.ft thead th.fn { width: auto; }
html.cb main table.ft thead .nw { white-space: nowrap; }
html.cb main table.ft .fund-link,
html.cb main table.ft .uk-cell .uk { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
html.cb main table.ft .fund-link { max-width: 260px; }
html.cb main table.ft .uk-cell .uk { max-width: 150px; }
/* Индекс: короткий у большинства (RUONIA), длинный переносится в две
   строки, а не раздувает колонку под себя. */
html.cb main table.ft .cut { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; white-space: normal; width: max-content; max-width: 112px; line-height: 1.3; overflow-wrap: anywhere; }
html.cb main table.ft td.bench { white-space: normal; }
html.cb main table.ft tbody tr { scroll-snap-align: start; }
/* Первая колонка как в ЗПИФ (Женя, 13.10.2026): звезда, знак УК, название и
   тикер подписью под ним; отдельной колонки «Тикер» нет. Колонка липкая,
   тонкая линия отделяет название от данных. Подпись тикера нужна поиску по
   таблице и снимку для Яндекса - не убирать (решение CPO, вариант B). */
html.cb main table.ft th.stick, html.cb main table.ft td.stick { position: sticky; left: 0; z-index: 3; background: var(--cf-surface); border-right: 1px solid var(--cf-line-strong); }
html.cb main table.ft thead th.stick { z-index: 4; }
html.cb main table.ft tbody tr:hover td.stick { background: var(--cf-surface-2); }
html.cb main table.ft .fund-cell { display: flex; align-items: center; gap: var(--cf-space-10); }
html.cb main table.ft .fund-cell .fav-star { flex: none; margin-left: -6px; }
html.cb main table.ft .fund-cell .uk-logo { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; outline: 1px solid var(--cf-line); outline-offset: -1px; }
html.cb main table.ft .uk-logo--none { display: inline-block; background: var(--cf-surface-2); }
html.cb main table.ft .fund-text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--cf-space-2); min-width: 0; }
html.cb main table.ft .fund-tk { font-size: 12px; font-weight: 500; line-height: 1.2; color: var(--cf-ink-3); letter-spacing: .01em; }
@media (min-width: 768px) {
  html.cb main .tablewrap:has(> .scroll > table.ft) .scroll { scroll-snap-type: y proximity; }
}