/* ════════════════════════════════════════════════════════════════════════
   FUND2 OVERLAY — bridges app2.js-generated DOM to fund2.css design tokens.
   fund2.css (from design bundle) handles ALL colors/backgrounds/surfaces.
   This file only handles:
   1. Native <input>/<select> transparency inside fund2-tb containers
   2. Sticky left columns positioning (app2.js uses data-table, not sticky-l)
   3. Star column (cine-mode moves ★ into its own left-most TD)
   4. "i" info icons on Symbol + exchange headers only
   5. Win98 chrome hiding on body.cine-mode
   6. app2.js-generated class → fund2 class mapping
   ════════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════════════
   0. NUKE Win98 GLOBAL FONT.
   retro.css L21-25 forces MS Sans Serif on EVERY element with !important.
   Override on cine-mode with Space Mono and !important.
   ════════════════════════════════════════════════════════════════════════ */
body.cine-mode,
body.cine-mode input,
body.cine-mode select,
body.cine-mode textarea,
body.cine-mode button,
body.cine-mode table,
body.cine-mode th,
body.cine-mode td,
body.cine-mode label,
body.cine-mode p,
body.cine-mode h1,
body.cine-mode h2,
body.cine-mode h3,
body.cine-mode h4,
body.cine-mode h5,
body.cine-mode h6,
body.cine-mode span,
body.cine-mode div,
body.cine-mode a,
body.cine-mode b,
body.cine-mode i,
body.cine-mode em,
body.cine-mode small,
body.cine-mode strong,
body.cine-mode nav,
body.cine-mode header,
body.cine-mode footer,
body.cine-mode section,
body.cine-mode article,
body.cine-mode aside {
  font-family: 'Space Mono', ui-monospace, Menlo, Consolas, monospace !important;
}

/* Reset retro body padding & background */
body.cine-mode {
  padding: 0 !important;
  margin: 0 !important;
  background: #050505 !important;
  color: #e8eef7 !important;
}

/* ════════════════════════════════════════════════════════════════════════
   1. NUKE retro.css table colors completely in cine-mode.
   `.data-table tr:hover td { background: var(--win-blue) !important }` from
   retro.css paints rows navy on hover; this section overrides with HIGHER
   specificity (5+ classes) so retro can never win.
   ════════════════════════════════════════════════════════════════════════ */

/* Kill row-level navy hover bg (retro tr:hover { background: var(--win-blue) }) */
body.cine-mode .data-table.fund2-table tbody tr,
body.cine-mode .data-table.fund2-table tbody tr:hover {
  background: transparent !important;
}

/* Default cell bg in cine-mode: transparent (kills zebra striping) */
body.cine-mode .data-table.fund2-table tbody tr td {
  background: transparent !important;
  color: rgba(255,255,255,0.85) !important;
}

/* Sticky cells — same depth-texture as .fund2-shell (consistent surface) */
body.cine-mode .data-table.fund2-table tbody tr td:nth-child(-n+6),
body.cine-mode .data-table.fund2-table tbody tr:hover td:nth-child(-n+6),
body.cine-mode .data-table.fund2-table tbody tr td.symbol-cell,
body.cine-mode .data-table.fund2-table tbody tr:hover td.symbol-cell {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318 !important;
  color: rgba(255,255,255,0.85) !important;
}
body.cine-mode.tradfi-mode .data-table.fund2-table tbody tr td:nth-child(-n+8),
body.cine-mode.tradfi-mode .data-table.fund2-table tbody tr:hover td:nth-child(-n+8) {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318 !important;
  color: rgba(255,255,255,0.85) !important;
}

/* Hover lift on non-sticky cells */
body.cine-mode .data-table.fund2-table tbody tr:hover td:nth-child(n+7) {
  background: rgba(255,255,255,0.04) !important;
}
body.cine-mode.tradfi-mode .data-table.fund2-table tbody tr:hover td:nth-child(n+9) {
  background: rgba(255,255,255,0.04) !important;
}

/* Headers sticky row — same depth-texture as shell, чуть тёмнее для отделения */
body.cine-mode .data-table.fund2-table thead th:nth-child(-n+6),
body.cine-mode.tradfi-mode .data-table.fund2-table thead th:nth-child(-n+8) {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
    #0e0e13 !important;
}

/* Watchlist row tint */
body.cine-mode .data-table.fund2-table tbody tr:has(.watchlist-btn.active) td:nth-child(-n+6),
body.cine-mode .data-table.fund2-table tbody tr:has(.watchlist-btn.active):hover td:nth-child(-n+6) {
  background: rgba(255,216,77,0.06) !important;
}
body.cine-mode.tradfi-mode .data-table.fund2-table tbody tr:has(.watchlist-btn.active) td:nth-child(-n+8),
body.cine-mode.tradfi-mode .data-table.fund2-table tbody tr:has(.watchlist-btn.active):hover td:nth-child(-n+8) {
  background: rgba(255,216,77,0.06) !important;
}

/* Hover text colors — keep cine green/red, kill retro yellow/white */
body.cine-mode .data-table.fund2-table tbody tr:hover td,
body.cine-mode .data-table.fund2-table tbody tr:hover td.symbol-cell {
  color: rgba(255,255,255,0.85) !important;
}
body.cine-mode .data-table.fund2-table tbody tr:hover .rate-positive,
body.cine-mode .data-table.fund2-table tbody tr:hover .spread-cell,
body.cine-mode .data-table.fund2-table tbody tr:hover .apy-cell { color: #6bff9a !important; }
body.cine-mode .data-table.fund2-table tbody tr:hover .rate-negative { color: #ff7b7b !important; }
body.cine-mode .data-table.fund2-table tbody tr:hover .symbol-cell .symbol-link { color: #fff !important; }

/* ───────── Win98 chrome — hide on cine-mode + fixed window scroll ───────── */
body.cine-mode .window {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0; padding: 0;
  display: flex; flex-direction: column;
  height: 100vh;
  overflow: hidden;
}
body.cine-mode .window > .title-bar,
body.cine-mode .window > .menu-bar,
body.cine-mode .window > .status-bar { display: none !important; }
/* Outer content-area (direct child of .window) — flex container */
body.cine-mode > .window > .content-area,
body.cine-mode .window > .content-area {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  flex: 1; min-height: 0; min-width: 0;
  display: flex; flex-direction: column;
  overflow: hidden;
}
/* Inner content-area (legacy wrapper inside .fund2-scroll) — pass-through */
body.cine-mode .fund2-scroll > .content-area {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  display: contents;
}
body.cine-mode .inset-panel {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  display: contents;
}
body.cine-mode #o1InviteTab,
body.cine-mode #o1InvitePopup { display: none !important; }

/* page-content as flex column with internal scroll for the table */
body.cine-mode .cine-page-content.fund2-page-content {
  flex: 1; min-height: 0; min-width: 0;
  width: 100%;
  display: flex; flex-direction: column;
  overflow: hidden;
  height: auto;
  max-width: none;
}
body.cine-mode .fund2-page-head,
body.cine-mode .fund2-toolbar,
body.cine-mode .fund2-statusbar,
body.cine-mode .tf-ticker,
body.cine-mode .tf-cats { flex-shrink: 0; }

body.cine-mode .fund2-shell {
  flex: 1; min-height: 0; min-width: 0;
  width: 100%;
  display: flex; flex-direction: column;
  overflow: hidden;
}
body.cine-mode .fund2-scroll {
  flex: 1; min-height: 0; min-width: 0;
  width: 100%;
  overflow-x: scroll !important;
  overflow-y: auto !important;
}

/* ───────── Body / page chrome ───────── */
html, body { background: #050505; color: rgba(255,255,255,0.85); }
body.cine-mode {
  padding: 0; margin: 0;
  height: 100vh;
  overflow: hidden;
  font-family: 'Space Mono', ui-monospace, monospace !important;
}

/* ───────── Toolbar corner brackets ───────── */
body.cine-mode .fund2-toolbar { position: relative; }

/* ───────── Native <input>/<select> inside fund2-tb containers ───────── */
.fund2-tb-num input[type="number"],
.fund2-tb-num input[type="text"] {
  flex: 1; min-width: 0;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: #fff !important;
  font: inherit !important;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  padding: 0 4px !important;
  -moz-appearance: textfield;
}
.fund2-tb-num input::-webkit-outer-spin-button,
.fund2-tb-num input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.fund2-tb-search input[type="text"],
.fund2-tb-search input[type="search"] {
  flex: 1; min-width: 0;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: #fff !important;
  font: inherit !important;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
  padding: 0 !important;
}
.fund2-tb-search input::placeholder { color: rgba(255,255,255,0.32) !important; }

/* Custom cine-select (replaces native <select>) — trigger button + popout menu */
.fund2-tb-select.cine-sel { padding: 0 !important; position: relative; overflow: visible; }
.fund2-tb-select.cine-sel > select { display: none !important; }
body.cine-mode .fund2-tb-select-trigger,
body.cine-mode button.fund2-tb-select-trigger {
  width: 100%; height: 28px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 10px !important;
  gap: 8px;
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
  cursor: pointer;
  -webkit-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
}
body.cine-mode .fund2-tb-select-trigger:hover,
body.cine-mode .fund2-tb-select-trigger:focus,
body.cine-mode .fund2-tb-select-trigger:active,
body.cine-mode button.fund2-tb-select-trigger:hover,
body.cine-mode button.fund2-tb-select-trigger:focus,
body.cine-mode button.fund2-tb-select-trigger:active {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
.fund2-tb-select-label { color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fund2-tb-select-caret {
  color: rgba(255,255,255,0.5); font-size: 10px;
  transition: transform 140ms ease;
}
.fund2-tb-select.cine-sel.open .fund2-tb-select-caret { transform: rotate(180deg); }

.fund2-tb-select-menu {
  position: absolute;
  top: calc(100% + 4px); left: -1px; right: -1px;
  z-index: 200;
  padding: 4px 0;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318;
  border: 1px solid rgba(255,255,255,0.3);
  box-shadow: 0 14px 28px -8px rgba(0,0,0,0.9), inset 0 1px 0 rgba(255,255,255,0.06);
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.06em;
  max-height: 280px; overflow-y: auto;
}
.fund2-tb-select-opt {
  padding: 7px 12px;
  cursor: pointer;
  color: rgba(255,255,255,0.7);
  text-transform: uppercase;
  border-left: 2px solid transparent;
  transition: all 120ms ease;
  white-space: nowrap;
}
.fund2-tb-select-opt:hover { color: #fff; background: rgba(255,255,255,0.04); }
.fund2-tb-select-opt.on {
  color: #fff;
  background: rgba(255,255,255,0.06);
  border-left-color: #fff;
}

/* checkbox: hide native, drive styled box via :checked */
.fund2-tb-checkbox input[type="checkbox"] {
  position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0;
}
.fund2-tb-checkbox-box { position: relative; }
.fund2-tb-checkbox input[type="checkbox"]:checked + .fund2-tb-checkbox-box::after {
  content: '✓'; color: #fff; font-size: 11px; line-height: 1;
}
.fund2-tb-checkbox.star input[type="checkbox"]:checked + .fund2-tb-checkbox-box::after {
  content: '★'; color: #ffd84d; font-size: 11px;
}

/* ───────── app2.js table → fund2-table mapping ───────── */
.fund2-table.data-table {
  width: max-content; min-width: 100%;
  border-collapse: separate; border-spacing: 0;
  table-layout: fixed;
}

/* thead — depth-texture (consistent with shell, чуть отделено от рядов) */
.fund2-table.data-table thead th {
  position: sticky; top: 0; z-index: 5;
  height: 32px; padding: 0 12px;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
    #0e0e13;
  border-bottom: 1px solid rgba(255,255,255,0.18);
  border-right: 1px solid rgba(255,255,255,0.04);
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  text-align: center; color: rgba(255,255,255,0.65);
  font-weight: 700; white-space: nowrap;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  user-select: none; cursor: pointer;
}
.fund2-table.data-table thead th.exchange-col { text-align: center !important; }

/* "i" info icon — ONLY on Symbol + exchange column headers (per design) */
.fund2-table.data-table thead th.symbol-cell::after,
.fund2-table.data-table thead th.exchange-col::after {
  content: 'i';
  display: inline-block;
  width: 12px; height: 12px; margin-left: 6px;
  border: 1px solid rgba(255,255,255,0.3); border-radius: 50%;
  font-size: 8px; line-height: 10px; text-align: center;
  color: rgba(255,255,255,0.5); font-weight: 400;
  letter-spacing: 0; font-style: italic; font-family: serif;
  vertical-align: middle;
}
.fund2-table.data-table thead th.no-info::after { content: none !important; }

/* ── Sticky left columns
   Funding (6 sticky): 1=★  2=symbol  3=spread  4=apy  5=long  6=short
   TradFi  (8 sticky): 1=★  2=symbol  3=cat  4=spread  5=apy  6=trend  7=long  8=short
*/
.fund2-table.data-table thead th:nth-child(-n+6),
.fund2-table.data-table tbody td:nth-child(-n+6) {
  position: sticky; z-index: 4;
}
.fund2-table.data-table thead th:nth-child(-n+6) { z-index: 6; }

/* canonical widths from more-screens.jsx <colgroup>: 36/110/100/90/110/110 */
.fund2-table.data-table thead th:nth-child(1),
.fund2-table.data-table tbody td:nth-child(1) { left: 0;    width: 36px;  min-width: 36px;  text-align: center; background-color: #0a0a0a; }
.fund2-table.data-table thead th:nth-child(2),
.fund2-table.data-table tbody td:nth-child(2) { left: 36px;  width: 110px; min-width: 110px; text-align: left;   background-color: #0a0a0a; }
.fund2-table.data-table thead th:nth-child(3),
.fund2-table.data-table tbody td:nth-child(3) { left: 146px; width: 100px; min-width: 100px; background-color: #0a0a0a; }
.fund2-table.data-table thead th:nth-child(4),
.fund2-table.data-table tbody td:nth-child(4) { left: 246px; width: 90px;  min-width: 90px;  background-color: #0a0a0a; }
.fund2-table.data-table thead th:nth-child(5),
.fund2-table.data-table tbody td:nth-child(5) { left: 336px; width: 110px; min-width: 110px; background-color: #0a0a0a; }
.fund2-table.data-table thead th:nth-child(6),
.fund2-table.data-table tbody td:nth-child(6) {
  left: 446px; width: 110px; min-width: 110px;
  border-right: 1px solid rgba(255,255,255,0.14) !important;
  background-color: #0a0a0a;
}
/* exchange columns — minimum 92px, expand to fill remaining space */
.fund2-table.data-table thead th:nth-child(n+7),
.fund2-table.data-table tbody td:nth-child(n+7) {
  min-width: 92px;
}
/* thead sticky — depth-texture (same as shell + чуть тёмнее) */
.fund2-table.data-table thead th:nth-child(-n+6) {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
    #0e0e13 !important;
}

/* TradFi: extend sticky to 8 cols */
body.tradfi-mode .fund2-table.data-table thead th:nth-child(7),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(7),
body.tradfi-mode .fund2-table.data-table thead th:nth-child(8),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(8) {
  position: sticky; z-index: 4;
}
body.tradfi-mode .fund2-table.data-table thead th:nth-child(7),
body.tradfi-mode .fund2-table.data-table thead th:nth-child(8) { z-index: 6; }

body.tradfi-mode .fund2-table.data-table thead th:nth-child(1),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(1) { left: 0;    width: 36px;  min-width: 36px;  background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(2),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(2) { left: 36px;  width: 130px; min-width: 130px; background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(3),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(3) { left: 166px; width: 100px; min-width: 100px; background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(4),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(4) { left: 266px; width: 100px; min-width: 100px; background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(5),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(5) { left: 366px; width: 90px;  min-width: 90px;  background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(6),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(6) {
  left: 456px; width: 80px; min-width: 80px;
  border-right: 1px solid rgba(255,255,255,0.04) !important;
  box-shadow: none !important;
  background-color: #0a0a0a;
}
body.tradfi-mode .fund2-table.data-table thead th:nth-child(7),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(7) { left: 536px; width: 120px; min-width: 120px; background-color: #0a0a0a; }
body.tradfi-mode .fund2-table.data-table thead th:nth-child(8),
body.tradfi-mode .fund2-table.data-table tbody td:nth-child(8) {
  left: 656px; width: 120px; min-width: 120px;
  border-right: 1px solid rgba(255,255,255,0.14) !important;
  background-color: #0a0a0a;
}
body.tradfi-mode .fund2-table.data-table thead th:nth-child(-n+8) {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
    #0e0e13 !important;
}

/* ───────── Star cell (cine-mode: separate left TD) ───────── */
.fund2-table.data-table .star-cell { text-align: center !important; padding: 0 !important; }
.fund2-table.data-table .star-cell .watchlist-btn {
  background: transparent !important; border: none !important;
  color: rgba(255,255,255,0.25) !important; font-size: 13px !important;
  cursor: pointer !important; padding: 0 !important; line-height: 1 !important;
  font-family: inherit !important;
}
.fund2-table.data-table .star-cell .watchlist-btn.active {
  color: #ffd84d !important; text-shadow: 0 0 6px rgba(255,216,77,0.5);
}

/* Row watchlist highlight */
.fund2-table.data-table tbody tr:has(.watchlist-btn.active) td {
  background-color: rgba(107,255,154,0.06) !important;
}
.fund2-table.data-table tbody tr:has(.watchlist-btn.active) td:nth-child(-n+6) {
  background-color: rgba(107,255,154,0.14) !important;
}
body.tradfi-mode .fund2-table.data-table tbody tr:has(.watchlist-btn.active) td:nth-child(-n+8) {
  background-color: rgba(107,255,154,0.14) !important;
}

/* ───────── Body rows ───────── */
.fund2-table.data-table tbody tr { cursor: pointer; transition: background-color 100ms ease; }
.fund2-table.data-table tbody td {
  height: 30px; padding: 0 12px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  border-right: none;
  text-align: right; white-space: nowrap; vertical-align: middle;
  color: rgba(255,255,255,0.85);
  font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 11px;
}
.fund2-table.data-table tbody tr:hover td:not(:nth-child(-n+6)) {
  background-color: rgba(255,255,255,0.04) !important;
}
body.tradfi-mode .fund2-table.data-table tbody tr:hover td:not(:nth-child(-n+8)) {
  background-color: rgba(255,255,255,0.04) !important;
}

/* ───────── Symbol cell ───────── */
.fund2-table.data-table .symbol-cell { text-align: left !important; }
.fund2-table.data-table .symbol-cell .symbol-link {
  color: #fff !important;
  font-weight: 700 !important; letter-spacing: 0.04em !important; font-size: 12px !important;
  cursor: pointer !important;
  text-decoration: underline dotted rgba(255,255,255,0.35) !important;
  text-underline-offset: 3px !important;
  -webkit-text-decoration: underline dotted rgba(255,255,255,0.35) !important;
  transition: color 120ms ease, text-decoration-color 120ms ease !important;
}
.fund2-table.data-table .symbol-cell .symbol-link:hover {
  color: #6bff9a !important;
  text-decoration: underline solid #6bff9a !important;
  -webkit-text-decoration: underline solid #6bff9a !important;
}
.fund2-table.data-table .symbol-cell .tradfi-info-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 14px !important; height: 14px !important;
  background: transparent !important; color: rgba(255,255,255,0.4) !important;
  border: 1px solid rgba(255,255,255,0.25) !important; border-radius: 50% !important;
  font-size: 8px !important; font-style: italic !important; cursor: pointer !important;
  margin-left: 4px !important; font-family: serif !important;
}
.fund2-table.data-table .symbol-cell .tradfi-info-btn:hover {
  color: #fff !important; border-color: rgba(255,255,255,0.7) !important;
}

/* ───────── Cell colours ───────── */
.fund2-table.data-table .spread-cell,
.fund2-table.data-table .apy-cell { text-align: right !important; font-weight: 700 !important; color: #6bff9a !important; }
.fund2-table.data-table .rate-positive { color: #6bff9a !important; font-weight: 700 !important; }
.fund2-table.data-table .rate-negative { color: #ff7b7b !important; font-weight: 700 !important; }
.fund2-table.data-table .exchange-col { text-align: right !important; }
.fund2-table.data-table thead th.exchange-col { text-align: center !important; }
.fund2-table.data-table thead th { text-align: center !important; }
.fund2-table.data-table thead th.symbol-cell { text-align: center !important; }

/* ───────── Long/Short (arb-pair) — exchange links ───────── */
.fund2-table.data-table .arb-pair { text-align: left !important; }
.fund2-table.data-table .arb-pair a {
  color: rgba(255,255,255,0.85) !important; text-decoration: underline !important;
  text-decoration-color: rgba(255,255,255,0.3) !important; text-underline-offset: 3px !important;
  text-transform: uppercase !important; font-weight: 700 !important;
  letter-spacing: 0.06em !important; font-family: inherit !important;
}
.fund2-table.data-table .arb-pair a:hover {
  color: #fff !important; text-decoration-color: rgba(255,255,255,0.8) !important;
}

/* ───────── Spark cell (TradFi trend) ───────── */
.fund2-table.data-table .spark-cell { padding: 2px 8px !important; }

/* ───────── Loading / Error ───────── */
body.cine-mode .loading, body.cine-mode .error {
  color: rgba(255,255,255,0.5) !important; background: transparent !important;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  letter-spacing: 0.18em !important; text-transform: uppercase !important;
  padding: 30px 14px !important; font-size: 11px !important;
}
body.cine-mode .error { color: #ff7b7b !important; }

/* ───────── Exchange popup — depth-texture (matches shell/toolbar) ───────── */
body.cine-mode #exchangePopup {
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.018) 28%, rgba(255,255,255,0.008) 100%),
    #131318 !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 14px 28px -8px rgba(0,0,0,0.9) !important;
  color: #fff !important; font-family: 'Space Mono', ui-monospace, monospace !important;
  padding: 14px 16px !important; min-width: 340px;
}
body.cine-mode #exchangePopup b {
  color: rgba(255,255,255,0.7); letter-spacing: 0.22em;
  text-transform: uppercase; font-size: 10px; font-weight: 700;
}
body.cine-mode #exchangePopup label {
  color: rgba(255,255,255,0.85) !important; font-size: 10px !important;
  letter-spacing: 0.06em !important; text-transform: uppercase !important;
  display: inline-flex !important; align-items: center !important;
  gap: 6px !important; padding: 3px 0 !important;
}
body.cine-mode #exchangePopup label input[type="checkbox"] {
  appearance: none !important; -webkit-appearance: none !important;
  width: 12px !important; height: 12px !important;
  background: transparent !important; border: 1px solid rgba(255,255,255,0.45) !important;
  cursor: pointer !important; display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  margin: 0 !important; position: relative !important;
}
body.cine-mode #exchangePopup label input[type="checkbox"]:checked::after {
  content: '✓'; position: absolute; top: -3px; left: 0;
  font-size: 11px; color: #fff; line-height: 1;
}
body.cine-mode #exchangePopup .tb-btn {
  background: transparent !important; border: 1px solid rgba(255,255,255,0.4) !important;
  color: rgba(255,255,255,0.85) !important; font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 10px !important; letter-spacing: 0.18em !important; text-transform: uppercase !important;
  cursor: pointer !important; height: 22px !important; padding: 0 8px !important;
}
body.cine-mode #exchangePopup .tb-btn:hover {
  color: #fff !important; border-color: rgba(255,255,255,0.7) !important;
  background: rgba(255,255,255,0.04) !important;
}

/* ───────── Exchange popup: CEX/DEX columns + section header ───────── */
.fund2-exch-popup-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.fund2-exch-popup-section {
  font-size: 9px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  padding-bottom: 6px;
  margin-bottom: 4px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
/* override fund2.css `.fund2-exch-popup-list { gap: 6px 12px }` for col layout */
.fund2-exch-popup .fund2-exch-popup-list { gap: 14px; }

/* ───────── Status bar links ───────── */
.fund2-statusbar a { color: rgba(255,255,255,0.7); text-decoration: underline; text-decoration-color: rgba(255,255,255,0.3); }
.fund2-statusbar a:hover { color: #fff; }

/* ───────── Mobile cards ───────── */
@media (max-width: 768px) {
  body.cine-mode .mobile-card {
    background: #131318 !important;
    border: 1px solid rgba(255,255,255,0.18) !important;
    color: #fff !important; padding: 10px 12px !important; margin: 0 !important;
  }
  body.cine-mode .mc-symbol, body.cine-mode .mc-symbol a { color: #fff !important; }
  body.cine-mode .mc-apy.positive { color: #6bff9a !important; }
  body.cine-mode .mc-apy.negative { color: #ff7b7b !important; }
  body.cine-mode .mc-spread { color: rgba(255,255,255,0.7) !important; }
  body.cine-mode .mc-exchanges { color: rgba(255,255,255,0.85) !important; }
  body.cine-mode .mc-btn-backtest {
    background: transparent !important; color: #fff !important;
    border: 1px solid rgba(255,255,255,0.4) !important;
    text-decoration: none !important; letter-spacing: 0.18em !important;
    font-size: 10px !important; text-transform: uppercase !important; padding: 4px 10px !important;
  }
  body.cine-mode .mc-star { color: rgba(255,255,255,0.3) !important; }
  body.cine-mode .mc-star.active { color: #ffd84d !important; }
  body.cine-mode .mobile-cards-container { padding: 8px !important; gap: 8px !important; }
  body.cine-mode .fund2-toolbar { flex-wrap: wrap; }
  body.cine-mode .fund2-statusbar { flex-wrap: wrap; }
}

/* ───────── Page ambient grid ───────── */
.cine-bg-grid {
  position: fixed; inset: 0; pointer-events: none; z-index: 1;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px; opacity: 0.5;
}
.cine-bg-vignette {
  position: fixed; inset: 0; pointer-events: none; z-index: 1;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,0.7) 100%);
}

/* X (Twitter) social link in statusbar */
body.cine-mode .fund2-statusbar .fund2-x-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  color: #fff !important;
  text-decoration: none !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  font-family: 'Space Mono', ui-monospace, monospace !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  transition: all 140ms ease !important;
  background: rgba(0,0,0,0.4) !important;
}
body.cine-mode .fund2-statusbar .fund2-x-link:hover {
  border-color: #fff !important;
  background: rgba(255,255,255,0.08) !important;
  box-shadow: 0 0 10px rgba(255,255,255,0.25) !important;
}
body.cine-mode .fund2-statusbar .fund2-x-link svg {
  display: block !important;
  color: #fff !important;
  filter: drop-shadow(0 0 4px rgba(255,255,255,0.4));
}
body.cine-mode .fund2-statusbar .fund2-status-hidden { display: none !important; }