/* Потоки капитала: листалка месяцев, полосы участников, словарь, СЗКО.
   Зелёный и красный здесь - только знак нетто-покупки. */



.cff-kpis .cf-keystrip__u { text-wrap: pretty; }
.cff-kpis .cf-keystrip__u .cf-up, .cff-kpis .cf-keystrip__u .cf-down { font-weight: 600; }
@media (max-width: 900px) { .cff-kpis .cf-keystrip__v { font-size: 21px; white-space: normal; } }

.cff-seg { margin-bottom: var(--cf-space-14); }

.cff-empty { align-items: center; flex-wrap: wrap; }
.cff-empty > div { flex: 1 1 260px; }

.cff-gloss { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--cf-space-24); }
.cff-gloss > div { padding: var(--cf-space-12) 0; border-top: 1px solid var(--cf-line); }
@media (max-width: 1100px) { .cff-gloss { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .cff-gloss { grid-template-columns: 1fr; } }
.cff-gloss > div[hidden] { display: none; }
.cff-gloss dt { font-size: 14px; font-weight: 600; }
.cff-gloss dd { margin: var(--cf-space-2) 0 0; font-size: 13.5px; line-height: 1.5; color: var(--cf-ink-2); }

.cff-szko { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cf-space-16); margin-bottom: var(--cf-space-16); }
.cff-szko > div { display: grid; gap: var(--cf-space-4); }
.cff-szko__k { font-size: 13px; color: var(--cf-ink-3); }
.cff-szko b { font-size: 22px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.cff-szko small { font-size: 12.5px; color: var(--cf-ink-3); }

@media (max-width: 767px) {
  .cff-szko { grid-template-columns: 1fr; gap: var(--cf-space-12); }
}
#cfSeg[hidden] { display: none; }

/* История: участник и актив выбираются прямо над графиком. */
.cff-hbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--cf-space-10); margin: 0 0 var(--cf-space-12); }
.cff-chips { display: flex; flex-wrap: wrap; gap: var(--cf-space-6); }
.cff-chip { min-height: var(--cf-h-sm); padding: 0 var(--cf-space-12); border: 0; border-radius: var(--cf-radius-pill); background: var(--cf-surface-2);
  color: var(--cf-ink-2); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; box-shadow: inset 0 0 0 1px var(--cf-line);
  transition: background-color var(--cf-dur-fast) ease, color var(--cf-dur-fast) ease; }
.cff-chip[aria-pressed="true"] { background: var(--cf-accent-soft); color: var(--cf-accent); box-shadow: inset 0 0 0 1px var(--cf-accent-ring, var(--cf-accent-soft)); }
.cff-chip:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .cff-chip:not([aria-pressed="true"]):hover { color: var(--cf-ink); background: var(--cf-surface-3); } }
#cfHistMode[hidden] { display: none; }
@media (max-width: 767px) {
  .cff-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--cf-space-16) * -1); padding: 2px var(--cf-space-16); }
  .cff-chip { min-height: 42px; white-space: nowrap; flex: none; }
  #cfHistCls { max-width: 100%; }
}


@media (max-width: 767px) {
}

/* ---- Кто купил и кто продал: одна лёгкая таблица (26.09.2026) ---- */
.cff-head { display: flex; align-items: center; gap: var(--cf-space-10); }
.cff-head h2 { margin: 0; font-size: 18px; font-weight: 600; letter-spacing: -.02em; }
.cff-head__sp { flex: 1 1 auto; }
.cff-msel { position: relative; }
.cff-msel__s { height: var(--cf-h-sm); padding: 0 var(--cf-space-32) 0 var(--cf-space-14); border: 0; border-radius: var(--cf-radius-pill);
  background: var(--cf-surface-2); box-shadow: inset 0 0 0 1px var(--cf-line); color: var(--cf-ink); font: inherit; font-size: 14px; font-weight: 600;
  appearance: none; -webkit-appearance: none; cursor: pointer; font-variant-numeric: tabular-nums; }
.cff-msel::after { content: ""; position: absolute; right: 14px; top: 50%; width: 6px; height: 6px; margin-top: -5px; pointer-events: none;
  border-right: 1.6px solid var(--cf-ink-3); border-bottom: 1.6px solid var(--cf-ink-3); transform: rotate(45deg); }
.cff-msel__s:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
.cff-subrow { position: relative; display: flex; align-items: baseline; gap: var(--cf-space-12); margin: var(--cf-space-6) 0 var(--cf-space-14); flex-wrap: wrap; }
.cff-subrow p { margin: 0; font-size: 13.5px; color: var(--cf-ink-3); }
.cff-terms > summary { list-style: none; cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--cf-accent); white-space: nowrap; }
.cff-terms > summary::-webkit-details-marker { display: none; }
.cff-terms > summary:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; border-radius: var(--cf-radius-xs); }
.cff-terms__pop { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: var(--cf-z-popover); padding: var(--cf-space-8) var(--cf-space-18);
  border-radius: var(--cf-radius-lg); background: var(--cf-surface); box-shadow: var(--cf-shadow-popover), inset 0 0 0 1px var(--cf-line); }
.cff-terms__pop .cff-gloss > div { padding: var(--cf-space-8) 0; }
.cff-terms__pop .cff-gloss dt { font-size: 13.5px; }
.cff-terms__pop .cff-gloss dd { font-size: 13px; }

.cff-mx { position: relative; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: var(--cf-space-6);
  scroll-snap-type: x mandatory; scroll-padding-left: var(--fix, 236px); }
/* Полоса прокрутки тонкая и светлая: не спорит с таблицей, но находится.
   Дорожка начинается под месяцами, а не под закреплёнными колонками. */
.cff-mx::-webkit-scrollbar { height: 6px; }
.cff-mx::-webkit-scrollbar-track { margin-left: var(--fix, 236px); background: transparent; }
.cff-mx::-webkit-scrollbar-thumb { border-radius: var(--cf-radius-pill, 999px); background: var(--cf-line); }
.cff-mx:hover::-webkit-scrollbar-thumb { background: var(--cf-line-strong); }
@supports not selector(::-webkit-scrollbar) { .cff-mx { scrollbar-width: thin; scrollbar-color: var(--cf-line) transparent; } }
/* Колонки месяцев одной ширины (--mw считает скрипт): видимая часть
   вмещает целое число месяцев, край не режет месяц пополам. */
.cff-mx__t .cff-mx__m, .cff-mx__t td[data-i] { width: var(--mw, 54px); min-width: var(--mw, 54px); max-width: var(--mw, 54px); box-sizing: border-box; }
.cff-mx__t .cff-mx__m { scroll-snap-align: start; }
.cff-mx__t .cff-mx__m button, .cff-mx__t .cff-c { min-width: 0; }
.cff-top .an-note:empty { display: none; }
.cff-top .an-note { margin-bottom: 0; }
.cff-mx__t { border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.cff-mx__t th, .cff-mx__t td { padding: 2px; text-align: center; white-space: nowrap; }
.cff-mx__t thead th { font-size: 12px; font-weight: 500; color: var(--cf-ink-3); vertical-align: bottom; padding-bottom: var(--cf-space-6); }
/* закреплённые колонки: сплошной фон без зазоров - ничего не просвечивает */
.cff-mx__who, .cff-mx__t .cff-mx__sum { position: sticky; z-index: 2; background: var(--cf-surface); }
.cff-mx__who { left: 0; width: 132px; min-width: 132px; max-width: 132px; box-sizing: border-box; text-align: left !important; }
.cff-mx__t .cff-mx__sum { left: 132px; width: 104px; min-width: 104px; max-width: 104px; box-sizing: border-box; text-align: right !important; padding-right: var(--cf-space-14);
  box-shadow: var(--cf-shadow-sticky); }
.cff-mx__t thead .cff-mx__sum { color: var(--cf-ink-2); font-weight: 600; white-space: normal; line-height: 1.3; }
.cff-mx__who button { width: 100%; min-height: 34px; padding: 0 var(--cf-space-8); border: 0; border-radius: var(--cf-radius-sm); background: none;
  color: var(--cf-ink); font: inherit; font-size: 13.5px; font-weight: 600; text-align: left; cursor: pointer; }
.cff-mx__t tr.is-who .cff-mx__who button { color: var(--cf-accent); background: var(--cf-accent-soft); }
.cff-mx__who button:focus-visible, .cff-mx__m button:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 1px; }
.cff-sumv { display: inline-block; min-width: 58px; font-size: 14px; font-weight: 700; text-align: right; }
.cff-sumv.is-up { color: var(--cf-up); } .cff-sumv.is-down { color: var(--cf-down); } .cff-sumv.is-none { color: var(--cf-ink-3); font-weight: 500; }
/* месяцы */
.cff-mx__m button { display: grid; justify-items: center; gap: 0; width: 100%; min-width: 50px; padding: var(--cf-space-4) 0; border: 0; border-radius: var(--cf-radius-sm);
  background: none; color: inherit; font: inherit; cursor: pointer; }
.cff-mx__m button span { font-size: 12.5px; font-weight: 600; color: var(--cf-ink-2); }
.cff-mx__m button small { font-size: 11px; color: var(--cf-ink-3); }
.cff-mx__m.is-cur button span, .cff-mx__m.is-cur button small { color: var(--cf-accent); }
.cff-mx__t td[data-i] { cursor: pointer; }
.cff-c { position: relative; display: block; min-width: 50px; height: 30px; line-height: 30px; padding: 0 var(--cf-space-6); border-radius: var(--cf-radius-xs);
  font-size: 12.5px; font-weight: 500; color: var(--cf-ink); }
.cff-c.is-up { background: color-mix(in srgb, var(--cf-up) calc(var(--k) * 30%), var(--cf-surface)); }
.cff-c.is-down { background: color-mix(in srgb, var(--cf-down) calc(var(--k) * 30%), var(--cf-surface)); }
.cff-c.is-none { color: var(--cf-ink-3); background: none; }
.cff-c.is-der::after { content: ""; position: absolute; top: 4px; right: 4px; width: 4px; height: 4px; border-radius: 50%; background: var(--cf-ink-3); }
/* одна рамка вокруг выбранных месяцев */
.cff-sel { position: absolute; z-index: 1; border-radius: var(--cf-radius-md); box-shadow: inset 0 0 0 1.5px var(--cf-accent); background: var(--cf-accent-soft);
  opacity: .9; pointer-events: none; mix-blend-mode: multiply; transition: left var(--cf-dur) var(--cf-ease), width var(--cf-dur) var(--cf-ease); }
[data-theme="dark"] .cff-sel { mix-blend-mode: screen; opacity: .6; }
@media (hover: hover) and (pointer: fine) {
  .cff-mx__m:not(.is-cur) button:hover span { color: var(--cf-ink); }
  .cff-mx__who button:hover { background: var(--cf-surface-2); }
  .cff-mx__t td[data-i]:hover .cff-c { box-shadow: inset 0 0 0 1px var(--cf-line-strong); }
}
@media (max-width: 767px) {
  .cff-head { flex-wrap: wrap; }
  .cff-head h2 { flex: 1 1 100%; }
  .cff-msel__s { min-height: 42px; }
  .cff-mx__who { width: 114px; min-width: 114px; max-width: 114px; }
  .cff-mx__t .cff-mx__sum { left: 114px; width: 80px; min-width: 80px; padding-right: var(--cf-space-8); }
  .cff-mx__who button { padding: 0 var(--cf-space-6); }
  .cff-terms__pop { position: static; margin-top: var(--cf-space-8); box-shadow: inset 0 0 0 1px var(--cf-line); }
}
@media (prefers-reduced-motion: reduce) { .cff-sel { transition: none; } }
