/* ArkenLabs — layout & overflow fixes.
   Loaded AFTER styles.css so the cascade wins. Additive only, safe to remove.
   Addresses: insight-row spacing, badge/card overflow, unstyled rankings tabs,
   pill spacing, wide-table overflow on Validation/Watchlists. */

/* 1) Stacked insight-rows need vertical spacing (Market Signals, company cards). */
.insight-row + .insight-row { margin-top: 6px; }

/* 2) Badges must wrap inside their card instead of overflowing it. */
.histogram-badge,
.risk-badge,
.band-badge,
.strategy-source-badge,
.factor-component-badge {
  white-space: normal;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* 3) General guard: long tokens / monospace strings wrap instead of spilling out of cards. */
.card { overflow-wrap: anywhere; }
.numeric,
.insight-value,
.mono,
.subtle { overflow-wrap: anywhere; word-break: break-word; }

/* 4) Rankings quick-view tabs were completely unstyled — give them the segmented-pill look. */
.quick-view-btn {
  border: 1px solid var(--line);
  background: var(--surface-soft);
  color: var(--text-secondary);
  border-radius: 999px;
  padding: 8px 14px;
  font: inherit;
  font-size: 0.86rem;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.quick-view-btn:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.quick-view-btn.active,
.quick-view-btn[aria-pressed="true"] {
  color: var(--text-primary);
  background: rgba(251, 97, 7, 0.16);
  border-color: rgba(251, 97, 7, 0.4);
}
.quick-view-btn + .quick-view-btn { margin-left: 8px; }

/* 5) Pills: breathing room when several sit inline/stacked. */
.pill { margin-bottom: 4px; }

/* 6) Wide tables (Validation, Watchlists) scroll horizontally instead of spilling out. */
.table-responsive,
.table-shell { overflow-x: auto; }
.card table { max-width: 100%; }

/* 7) Signal/satellite board cards keep content contained. */
.satellite-card { min-width: 0; }
.stat-grid { align-items: start; }

/* 8) Market index marquee (ticker banner under the header). */
.index-ticker {
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
  white-space: nowrap;
}
.index-ticker .idx-track {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding: 7px 0;
  will-change: transform;
  animation: idx-scroll 60s linear infinite;
}
.index-ticker:hover .idx-track { animation-play-state: paused; }
.idx-item { display: inline-flex; align-items: baseline; gap: 8px; font-size: 0.82rem; }
.idx-label { color: var(--text-secondary); font-weight: 600; letter-spacing: 0.02em; }
.idx-price {
  color: var(--text-primary);
  font-family: "JetBrains Mono", "Consolas", monospace;
  font-variant-numeric: tabular-nums;
}
.idx-chg {
  font-family: "JetBrains Mono", "Consolas", monospace;
  font-variant-numeric: tabular-nums;
}
.idx-chg.up { color: var(--positive); }
.idx-chg.down { color: var(--negative); }
.idx-sep { color: var(--text-muted); opacity: 0.5; margin: 0 4px; }
@keyframes idx-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .index-ticker .idx-track { animation: none; white-space: normal; } }