/* ════════════════════════════════════════════════════════════
   ОНЧЕЙН-РАДАР (webapp/js/onchain-radar.js): таблица во вкладке «Радар»
   страницы /onchain и страница монеты /onchain/radar/<COIN>.
   Основа — классы таблицы скринера (onchain.css: oc-*) и страницы пула
   (onchain-token.css: ot-*); здесь — только своё (префикс rr-).
   Цвета потоков: завели на биржи — красный (--c-neg), вывели — зелёный.
   ════════════════════════════════════════════════════════════ */

/* общие */
.rr-in { color: var(--c-neg); }
.rr-out { color: var(--c-pos); }
.rr-exi, .rr-exl {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 16px; height: 16px; border-radius: 4px; object-fit: cover; vertical-align: middle;
}
.rr-exl {
  background: var(--ec, #7a8a99); color: #fff; font: 700 9px/1 var(--font-body); font-style: normal;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15);
}
.rr-exn { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-family: var(--font-body); font-size: 12px; color: var(--text-1); }
.rr-pp { display: inline-flex; align-items: center; gap: 3px; flex-wrap: nowrap; }
.rr-pp .rr-exi, .rr-pp .rr-exl { width: 14px; height: 14px; font-size: 8px; border-radius: 3px; }
.rr-more { font-style: normal; font-family: var(--font-mono); font-size: 10px; color: var(--text-3); margin-left: 1px; }
.rr-netn { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.rr-netn .oc-net { width: 14px; height: 14px; font-size: 8px; }
.rr-bigc {
  display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 9px; line-height: 18px; text-align: center;
  font-family: var(--font-mono); font-size: 11.5px; font-weight: 700;
  color: var(--c-neg); background: color-mix(in srgb, var(--c-neg) 14%, transparent);
}

/* ════════════ таблица радара (вкладка «Радар» на /onchain) ════════════ */
.oc-rwrap { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.oc-rwrap[hidden], .oc-nets[hidden] { display: none !important; }
/* (строка фильтров .rr-tb над таблицей убрана 10.11.2026: фильтры — в окне
   «Фильтры» тулбара (OC.filters), биржи — кнопка «Биржи» тулбара) */
.rr-esel {
  height: 24px; padding: 0 2px; border: 0; border-radius: var(--r-md);
  background: transparent; color: var(--text-1); font: 600 12px/1 var(--font-body); cursor: pointer;
}
.rr-esel option { background: var(--bg-modal, var(--bg-panel)); color: var(--text-1); }
.rr-pbar { display: inline-block; width: 90px; height: 5px; border-radius: 3px; background: var(--border); overflow: hidden; }
.rr-pbar > i { display: block; height: 100%; border-radius: 3px; background: var(--brand); transition: width .6s ease; }
.rr-tw { flex: 1; min-height: 0; min-width: 0; overflow: auto; }
.rr-note {
  position: sticky; left: 0; padding: 6px 12px; font-size: 12px; color: var(--text-2);
  background: color-mix(in srgb, var(--brand) 7%, transparent); border-bottom: 1px solid var(--border);
}

/* ячейки */
.rr-table td[data-c="coin"] { font-family: var(--font-body); padding-left: 8px; min-width: 150px; }
.rr-coin { display: flex; align-items: center; gap: 10px; }
.rr-coin .oc-logo > img.ok { opacity: 1; background: var(--bg-card); }
.rr-coin .oc-logo:has(> img.ok) .oc-ava { visibility: hidden; }
.rr-cn { display: flex; flex-direction: column; gap: 3px; min-width: 0; text-decoration: none; color: inherit; }
.rr-cn b { font-weight: 700; font-size: 13px; color: var(--text-1); }
.rr-cn:hover b { color: var(--brand); }
.rr-table td[data-c="px"] { min-width: 90px; }
.rr-table td.rr-neg { color: var(--c-neg); font-weight: 600; }
.rr-table td.rr-pos { color: var(--c-pos); font-weight: 600; }
.rr-table td.rr-hot { background: color-mix(in srgb, var(--c-neg) 10%, transparent); box-shadow: inset 2px 0 0 var(--c-neg); }
.rr-table td.rr-stale { color: var(--text-3); }
.rr-table td[data-c="net24"] { min-width: 96px; }
.rr-meter { height: 3px; width: 72px; margin: 3px auto 0; border-radius: 2px; overflow: hidden; background: var(--c-pos); opacity: .8; }
.rr-meter > i { display: block; height: 100%; background: var(--c-neg); }
.rr-table td[data-c="last"] { min-width: 170px; }
.rr-lb { display: flex; align-items: center; gap: 6px; }
.rr-lb b { font-weight: 700; }
.rr-table td[data-c="topex"] { min-width: 110px; }
.rr-table .oc-sub.rr-in { color: var(--c-neg); }
.rr-table .oc-sub.rr-out { color: var(--c-pos); }

/* пустая таблица: «радар наполняется» */
.rr-fill {
  display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
  max-width: 520px; margin: 48px auto; padding: 0 20px; color: var(--text-3); font-size: 13px; line-height: 1.55;
}
.rr-fill > b { color: var(--text-1); font-size: 16px; }
.rr-fill-n { font-family: var(--font-mono); color: var(--text-2); font-size: 13px; }
.rr-fill-i { width: 44px; height: 44px; color: var(--brand); }
.rr-fill-i svg { width: 100%; height: 100%; }
.rr-spin svg path { transform-origin: 12px 12px; animation: rrSweep 2.4s linear infinite; }
@keyframes rrSweep { to { transform: rotate(360deg); } }
.rr-pbar-l { width: min(320px, 80%); height: 6px; }

/* ════════════ страница монеты /onchain/radar/<COIN> ════════════ */
#page-onchainradar.active {
  height: auto; min-height: 100%;
  gap: 0; padding: 0 0 28px; box-sizing: border-box;
  font-variant-numeric: tabular-nums; color: var(--text-1);
}
#page-onchainradar .ot-pos { color: var(--c-pos); }
#page-onchainradar .ot-neg { color: var(--c-neg); }
#page-onchainradar .ot-dim { color: var(--text-3); font-weight: 400; }
#page-onchainradar .ot-mono { font-family: var(--font-mono); }
#page-onchainradar .ot-sp { flex: 1; }
#page-onchainradar button { font-family: inherit; }
.rr-mkmenu .ot-pos { color: var(--c-pos); }

.rr-rbadge { gap: 4px; color: var(--c-neg); border-color: color-mix(in srgb, var(--c-neg) 35%, transparent); background: color-mix(in srgb, var(--c-neg) 9%, transparent); }
.rr-rbadge svg { width: 11px; height: 11px; }
.rr-pph .rr-exi, .rr-pph .rr-exl { width: 16px; height: 16px; font-size: 9px; }
.rr-head .ot-st b .rr-in, .rr-head .ot-st b .rr-out { font-weight: 600; }

/* выбор биржи свечей */
.rr-vseg .ot-sg { display: inline-flex; align-items: center; gap: 5px; padding: 0 8px 0 6px; }
.rr-vseg .rr-exi, .rr-vseg .rr-exl { width: 14px; height: 14px; font-size: 8px; }
.rr-vseg .ot-sg:not(.on) .rr-exi { opacity: .75; }

/* разделитель и подпись полосы потоков */
.rr-fsep {
  position: absolute; z-index: 3; left: 0; right: 84px; top: 70%; height: 0; pointer-events: none;
  border-top: 1px dashed var(--border-hi);
}
.rr-fsep[hidden] { display: none; }
.rr-flg {
  position: absolute; left: 10px; top: 4px; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: 11px; color: var(--text-2); white-space: nowrap;
}
.rr-flg em { font-style: normal; font-family: var(--font-body); font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-3); }
.rr-flg .rr-bigc { line-height: 15px; font-size: 10.5px; }
.rr-flg .rr-ls { display: none; }
@media (max-width: 768px) { .rr-flg .rr-ls { display: inline; } }

/* карточка у маркера */
.rr-tip-rows { grid-template-columns: minmax(0, 1fr) auto auto auto; }
.rr-tex { display: inline-flex; justify-content: center; }
.rr-tex .rr-exi, .rr-tex .rr-exl { width: 14px; height: 14px; font-size: 8px; }
.ot-tip .rr-exn { font-size: 11.5px; }

/* панель */
.rr-iob { position: relative; height: 5px; margin-top: 3px; border-radius: 3px; overflow: hidden; background: var(--c-pos); }
.rr-iob > i { display: block; height: 100%; background: var(--c-neg); border-right: 2px solid var(--bg-panel); }
.rr-iob.empty { background: var(--border); }
.rr-iob.empty > i { background: transparent; border: 0; }
.rr-lbs { border-left-color: var(--c-neg) !important; background: color-mix(in srgb, var(--c-neg) 4%, transparent); }
.rr-lbc { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-family: var(--font-mono); }
.rr-lbc > b { font-size: 16px; font-weight: 700; }
.rr-bxr { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 3px 0; }
.rr-bxr .rr-exn { overflow: hidden; }
.rr-bxr .rr-exn span { overflow: hidden; text-overflow: ellipsis; }
.rr-bxr > b { font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; text-align: right; min-width: 62px; }
.rr-lnk { margin-top: 6px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--text-3); font-size: 12px; font-weight: 600; }
.rr-lnk:hover { color: var(--brand); }
.ot-kv > b .ot-w.rr-w { margin: 0; }

/* полосы «вывели ← | → завели» */
.rr-dv { display: inline-grid; grid-template-columns: 1fr 1fr; width: 100%; min-width: 80px; height: 8px; gap: 2px; vertical-align: middle; }
.rr-dvl, .rr-dvr { display: flex; height: 100%; background: var(--border-soft); overflow: hidden; }
.rr-dvl { justify-content: flex-end; border-radius: 4px 0 0 4px; }
.rr-dvr { border-radius: 0 4px 4px 0; }
.rr-dvl > i { display: block; height: 100%; background: var(--c-pos); opacity: .85; }
.rr-dvr > i { display: block; height: 100%; background: var(--c-neg); opacity: .85; }
.rr-ext .rr-dv { width: 180px; }
.rr-legend { display: flex; gap: 16px; padding: 8px 12px; font-size: 11.5px; color: var(--text-3); border-top: 1px solid var(--border-soft); }
.rr-sw { display: inline-block; width: 10px; height: 8px; border-radius: 2px; margin-right: 6px; vertical-align: 0; }
.rr-sw-in { background: var(--c-neg); }
.rr-sw-out { background: var(--c-pos); }

/* лента переводов */
.rr-k {
  display: inline-block; min-width: 58px; padding: 0 6px; border-radius: 4px; line-height: 18px; text-align: center;
  font-family: var(--font-body); font-size: 11px; font-weight: 700;
}
.rr-k-dep { color: var(--c-neg); background: color-mix(in srgb, var(--c-neg) 13%, transparent); }
.rr-k-wd { color: var(--c-pos); background: color-mix(in srgb, var(--c-pos) 13%, transparent); }
.rr-k-wh { color: var(--oc-k-whale, #d95926); background: color-mix(in srgb, var(--oc-k-whale, #d95926) 13%, transparent); }
.rr-k-int { color: var(--text-2); background: var(--tb-badge-bg); }
.rr-evt tbody tr { cursor: pointer; }
.rr-evt td.ot-usd { font-weight: 600; }
.rr-w { max-width: 200px; }
.rr-w .ot-wl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* кто заводит / выводит */
.rr-wu { white-space: nowrap; }
.rr-wu > span:first-child { display: inline-block; min-width: 70px; font-weight: 600; }
.rr-pb { width: 90px; margin-left: 8px; }
.rr-wt td.rr-in .rr-pb i { background: var(--c-neg); }
.rr-wt td.rr-out .rr-pb i { background: var(--c-pos); }
a.ot-ab { text-decoration: none; }

/* адреса */
.rr-sec {
  padding: 12px 12px 6px; color: var(--text-3); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  border-top: 1px solid var(--border-soft);
}
.rr-sec:first-child { border-top: 0; }
.rr-at td, .rr-lt td { height: 32px; }
.rr-addr { font-size: 12px; }
.rr-as { display: none; }
.rr-main-b { margin-left: 8px; vertical-align: 1px; }
.rr-perps { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 4px 12px 10px; }
.rr-pad { padding: 4px 12px 12px; }

/* шапка графика в одну строку: у невыбранных бирж — только логотип */
@media (max-width: 1599px) {
  .rr-vseg .ot-sg:not(.on) span { display: none; }
  .rr-vseg .ot-sg:not(.on) { padding: 0 7px; }
  #page-onchainradar .ot-mkn { display: none; }
}

/* ── телефон ── */
@media (max-width: 768px) {
  .rr-table td[data-c="coin"] { min-width: 112px; max-width: 120px; padding-left: 6px; position: sticky; left: 0; z-index: 1; background: var(--bg); box-shadow: 1px 0 0 var(--border); }
  .rr-table tbody tr:hover td[data-c="coin"] { background: var(--bg-hover); }
  .rr-table thead th[data-k="coin"] { left: 0; z-index: 3; box-shadow: 1px 0 0 var(--border); }
  .rr-table td[data-c="rank"], .rr-table th[data-k="rank"] { display: none; }
  .rr-coin { gap: 7px; }
  .rr-coin .oc-logo, .rr-coin .oc-logo > img, .rr-coin .oc-ava { width: 24px; height: 24px; }
  .rr-pp .rr-exi:nth-child(n+4), .rr-pp .rr-exl:nth-child(n+4) { display: none; }
  .rr-table td[data-c="last"] { min-width: 150px; }
  .rr-fill { margin: 28px auto; }

  .rr-vseg .ot-sg span { display: none; }
  .rr-vseg .ot-sg { padding: 0 7px; }
  .rr-fsep { right: 58px; }
  .rr-flg { font-size: 10px; gap: 6px; left: 8px; }
  /* шапка монеты: [‹ лого тикер … ↗ Связки] / цена / метрики сеткой */
  .rr-head .rr-rbadge, .rr-head .ot-addr { display: none; }
  .rr-head .ot-tt { flex: 1 1 0; min-width: 0; }
  .rr-head .ot-links { order: 3; width: auto; margin-left: auto; }
  .rr-head .ot-gbtn { order: 4; }
  .rr-head .ot-px { order: 5; flex: 1 1 100%; }
  .rr-evt th:nth-child(4), .rr-evt td:nth-child(4) { display: none; }
  .rr-k { min-width: 0; }
  .rr-flg .rr-lf { display: none; }
  .rr-ext .rr-dv { width: 110px; }
  .rr-af { display: none; }
  .rr-as { display: inline; }
  .rr-pb { display: none; }
  .rr-w { max-width: 130px; }
}
@media (min-width: 769px) and (max-width: 1200px) {
  .rr-table td[data-c="coin"] { position: sticky; left: 0; z-index: 1; background: var(--bg); box-shadow: 1px 0 0 var(--border); }
  .rr-table tbody tr:hover td[data-c="coin"] { background: var(--bg-hover); }
  .rr-table thead th[data-k="coin"] { left: 0; z-index: 3; }
}

/* тулбар графика: таймфрейм и биржа выпадающими списками (как на странице токена разлоков) */
.rr-dd { position: relative; flex-shrink: 0; }
.rr-ddb {
  display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 10px;
  background: var(--tb-chip-bg, var(--bg-card)); border: 1px solid var(--tb-chip-bd, var(--border)); border-radius: var(--r-md);
  color: var(--text-1); font-size: 13px; font-weight: 600; cursor: pointer; transition: all var(--dur) var(--ease);
}
.rr-ddb:hover, .rr-dd.open .rr-ddb { background: var(--tb-chip-bg-hi, var(--bg-hover)); border-color: var(--tb-chip-bd-hi, var(--outline)); }
.rr-ddb img, .rr-ddb svg, .rr-ddo img, .rr-ddo svg { width: 16px; height: 16px; flex: none; border-radius: 4px; }
.rr-tfdd .rr-ddb span { min-width: 26px; text-align: left; }
.rr-car { font-style: normal; font-size: 9px; color: var(--text-3); line-height: 1; }
.rr-ddm {
  display: none; position: fixed; z-index: 60; margin-top: 4px; min-width: 90px; max-height: 340px; overflow-y: auto; padding: 4px;
  background: var(--bg-modal); border: 1px solid var(--border-hi); border-radius: var(--r-md); box-shadow: 0 18px 44px rgba(0,0,0,.5);
}
[data-theme="light"] .rr-ddm { box-shadow: 0 12px 30px rgba(0,0,0,.14); }
.rr-dd.open .rr-ddm { display: block; animation: pageEnter .16s cubic-bezier(.16,1,.3,1); }
.rr-vdd .rr-ddm { min-width: 170px; }
.rr-ddo {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 7px 10px; border: 0; background: none;
  border-radius: var(--r-sm); color: var(--text-2); font-size: 13px; font-weight: 600; cursor: pointer;
}
.rr-ddo:hover { background: var(--bg-hover); color: var(--text-1); }
.rr-ddo.active { color: var(--text-1); background: var(--outline-soft); box-shadow: inset 0 0 0 1px var(--outline); }

/* карточка биржи вверху боковой панели (как в арбитраже и у разлоков): зелёная
   полоса слева, выбор биржи, ссылка на биржу, PERP, сети депозита/вывода */
.rr-legc { border-left-color: var(--c-pos) !important; background: color-mix(in srgb, var(--c-pos) 3%, transparent); }
.rr-legc .ot-ssh { gap: 6px; }
.rr-legdd .rr-ddb { height: 26px; padding: 0 8px; gap: 6px; font-size: 13px; }
.rr-legdd .rr-ddb b { font-weight: 700; }
.rr-legdd .rr-ddm { min-width: 170px; }
.rr-legln { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; color: var(--text-3); flex: none; }
.rr-legln:hover { color: var(--text-1); background: var(--bg-hover); }
.rr-legln svg { width: 14px; height: 14px; }
.rr-legc .leg-type { flex-shrink: 0; font-weight: 700; }
.rr-legsym { font-size: 11px; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.rr-legc .fh-open { cursor: pointer; }
.rr-legc .fh-open:hover .fh-lbl { color: var(--text-1); }
.rr-legc .fh-lbl { display: inline-flex; align-items: center; gap: 4px; }
.rr-legc .fh-caret svg { width: 9px; height: 6px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.rr-nets { align-items: flex-start; }
.rr-nets > b { white-space: normal; overflow: visible; }
.rr-nets .net-chips { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 3px; }

/* маркеры: «Заводы» и «Выводы» — два независимых переключателя, порог отдельно */
.rr-mkt .rr-mki { font-style: normal; font-size: 9px; margin-right: 4px; opacity: .45; }
.rr-mk-dep.on .rr-mki { color: var(--c-neg); opacity: 1; }
.rr-mk-wd.on .rr-mki { color: var(--c-pos); opacity: 1; }
.rr-mkmin { margin-left: 4px; }
.rr-mkmin u { text-decoration: underline dotted; text-underline-offset: 3px; }
.rr-tipwho { padding-bottom: 0; }
/* шапка монеты: с «Капа / FDV» статистика шире — на ноутбуке «Связки» без
   подписи и плотнее промежутки, чтобы ряд не переносился */
@media (min-width: 769px) and (max-width: 1640px) {
  .rr-head .ot-stats { gap: 13px; }
  .rr-head .ot-gbtn span { display: none; }
  .rr-head .rr-st-big { display: none; }        /* есть в панели «Потоки на биржи» */
}

/* колонка «Биржа» (как .ul-ven в разлоках) */
.rr-ven { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-family: var(--font-body); font-weight: 600; font-size: 12.5px; color: var(--text-1); }
.rr-ven .rr-exi, .rr-ven .rr-exl { width: 16px; height: 16px; font-size: 9px; border-radius: 4px; }
.rr-vmore { color: var(--text-3); font-weight: 400; font-size: 11px; cursor: help; }

/* граница «переводы собраны с …» на графике монеты (история назад догружается) */
.rr-cov { position: absolute; z-index: 3; top: 0; bottom: 28px; width: 0; border-left: 1px dashed var(--border-hi); pointer-events: none; }
.rr-cov[hidden] { display: none; }
.rr-cov.rr-cov-off { border-left-color: transparent; }
.rr-cov span {
  position: absolute; top: 30px; left: 6px; white-space: nowrap;
  font-family: var(--font-body); font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-3);
}
.rr-cov.rr-cov-l span { left: auto; right: 6px; }

/* маркер и вид «Продажа на DEX» */
.rr-dex { color: var(--c-warn, #F59E0B); }
.rr-mk-dex.on .rr-mki { color: var(--c-warn, #F59E0B); opacity: 1; }
.rr-mk-dex .rr-mki { font-size: 8px; }
.rr-k-dex { color: var(--c-warn, #F59E0B); background: color-mix(in srgb, var(--c-warn, #F59E0B) 13%, transparent); }
.rr-k-dexb { color: var(--text-2); background: var(--tb-badge-bg); }

/* объёмы под свечами: подписи полос (фьючерс / спот) */
.rr-vlg {
  position: absolute; z-index: 3; left: 10px; display: flex; gap: 8px; align-items: baseline; pointer-events: none;
  font-family: var(--font-mono); font-size: 11px; color: var(--text-2); white-space: nowrap;
}
.rr-vlg[hidden] { display: none; }
.rr-vlg em { font-style: normal; font-family: var(--font-body); font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-3); }
.rr-mkt.rr-na { opacity: .5; }
@media (max-width: 768px) { .rr-vlg { left: 8px; font-size: 10px; } }
.rr-vax { position: absolute; right: 0; z-index: 2; background: var(--bg); border-left: 1px solid var(--border); pointer-events: none; }
.rr-vax[hidden] { display: none; }
