/* Vaded Investments: a compact exchange-style research workspace. */
.integration-requirements {
  white-space: normal;
  min-width: 240px;
  max-width: 560px;
}
.integration-requirements p {
  margin: 4px 0;
  line-height: 1.5;
}
.integration-requirements code {
  font-size: 10px;
  overflow-wrap: anywhere;
  color: #9eafcb;
}
:root {
  --bg: #090b0e;
  --sidebar: #0d1015;
  --panel: #101318;
  --panel2: #14181f;
  --border: #252a32;
  --text: #e9edf3;
  --muted: #87909e;
  --green: #16c784;
  --red: #f6465d;
  --blue: #6c9cff;
  --radius: 7px;
}
.sidebar {
  padding-top: 22px;
  background: #0d1015;
}
.brand {
  letter-spacing: 1px;
}
.brand-light {
  color: #727d8e;
}
.nav-group {
  color: #687383;
  font-size: 9px;
  letter-spacing: 1.6px;
}
nav a {
  border-radius: 5px;
  font-size: 11px;
}
nav a.active {
  background: #1b2c49;
  color: #8fb2ff;
  box-shadow: inset 2px 0 #578bff;
}
.topbar {
  background: #0d1015;
  height: 57px;
}
.button.primary {
  background: #2d62e8;
  border-color: #3972ff;
  color: #fff;
}
.button.primary:hover {
  background: #3a71f2;
}
.button.secondary {
  background: #1a1f28;
  border-color: #303743;
  color: #d6dce7;
}
.button.secondary:hover {
  background: #242c38;
}
.panel {
  box-shadow: none;
}
.stats-grid .stat-card {
  background: linear-gradient(125deg, #141a24, #101318);
  border-color: #252c38;
}
.stat-detail {
  color: #8290a3;
}
.terminal-page .page-wrap {
  padding: 15px 16px 20px;
  max-width: none;
}
.terminal-page .page-heading {
  display: none;
}
.terminal-page .workspace-footer {
  margin-top: 16px;
  padding-top: 13px;
  font-size: 9px;
}
.terminal-page .workspace {
  min-width: 0;
}
.market-terminal {
  min-width: 0;
  color: #e7eaf0;
  --buy: #16c784;
  --sell: #f6465d;
}
.market-terminal button,
.market-terminal select {
  font-size: 11px;
}
.terminal-summary {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 77px;
  padding: 12px 13px;
  margin-bottom: 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: #0c0e12;
  overflow: visible;
}
.terminal-pair-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.pair-orbit {
  width: 29px;
  height: 29px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #212735;
  color: #bacbff;
  border: 1px solid #3a465b;
  font-size: 12px;
  font-weight: 600;
}
.terminal-pair {
  color: #f1f3f7;
  background: #1b2028;
  border: 1px solid #353b46;
  border-radius: 4px;
  padding: 8px 26px 8px 9px;
  font-weight: 600;
  max-width: 145px;
  min-width: 115px;
}
.terminal-metric {
  display: flex;
  flex-direction: column;
  gap: 5px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.terminal-metric > span {
  color: #909aab;
  font-size: 10px;
  letter-spacing: 0.15px;
}
.terminal-metric small {
  font-size: 9px;
  color: #657186;
}
.terminal-metric > strong {
  font-size: 12px;
  font-weight: 550;
}
.price-metric > div {
  display: flex;
  align-items: center;
  gap: 7px;
}
.terminal-last {
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -0.35px;
  line-height: 1.1;
}
.terminal-change {
  font-size: 10px;
  font-weight: 500;
}
.terminal-summary-actions {
  display: flex;
  gap: 7px;
  margin-left: auto;
}
.terminal-summary-actions .button {
  padding: 8px 10px;
  white-space: nowrap;
  border-radius: 4px;
  font-size: 10px;
}
.terminal-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 304px;
  gap: 7px;
  align-items: stretch;
}
.terminal-panel {
  min-width: 0;
  background: #0a0b0d;
  border: 1px solid #292d34;
  border-radius: 5px;
  overflow: hidden;
}
.terminal-panel-tabs {
  height: 40px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 0 8px;
  border-bottom: 1px solid #252a32;
  background: #0c0e12;
}
.terminal-tabs {
  display: flex;
  gap: 5px;
  align-items: center;
  min-width: 0;
}
.button.terminal-tab {
  padding: 5px 8px;
  font-size: 10px;
  border-radius: 4px;
  background: #11151b;
  border: 1px solid #242a34;
  color: #8997aa;
  white-space: nowrap;
}
.button.terminal-tab.active {
  color: #f2f5fa;
  background: #252b35;
  border-color: #363e4c;
}
.chart-source {
  font-size: 8px;
  letter-spacing: 1.4px;
  color: #657388;
  margin-left: auto;
}
.terminal-icon {
  border: 0;
  background: transparent;
  color: #8792a3;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border-radius: 4px;
  flex-shrink: 0;
}
.terminal-icon svg {
  width: 19px;
  height: 19px;
}
.terminal-icon:hover,
.terminal-icon.active {
  background: #262d38;
  color: #e4edff;
}
.terminal-panel-tabs > .terminal-icon {
  margin-left: auto;
  width: 23px;
  height: 25px;
  padding: 4px;
}
.chart-toolbar {
  height: 43px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 7px 0 43px;
  border-bottom: 1px solid #252a32;
  position: relative;
  z-index: 3;
  background: #0c0e12;
}
.timeframe-buttons {
  display: flex;
  gap: 1px;
  align-items: center;
}
.timeframe-button {
  background: none;
  border: 0;
  border-radius: 3px;
  padding: 5px 6px;
  color: #8491a5;
  font-size: 10px !important;
  font-weight: 500;
  line-height: 20px;
}
.timeframe-button:hover {
  color: #e8efff;
  background: #19202c;
}
.timeframe-button.active {
  color: #fff;
  background: #2c3442;
  box-shadow: inset 0 -2px #77a8ff;
}
.chart-mode {
  border: 0;
  border-left: 1px solid #353b46;
  border-radius: 0;
  padding: 4px 7px;
  background: #0c0e12;
  color: #a7b3c5;
  font-size: 10px !important;
  min-width: 72px;
}
.toolbar-spacer {
  flex: 1;
}
.indicator-menu {
  position: relative;
  flex-shrink: 0;
}
.indicator-menu > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: #9aabc4;
  padding: 6px;
  border-radius: 3px;
}
.indicator-menu > summary::-webkit-details-marker {
  display: none;
}
.indicator-menu[open] > summary,
.indicator-menu > summary:hover {
  background: #202735;
  color: #dbe6ff;
}
.indicator-symbol {
  font-size: 15px;
  font-family: Georgia, serif;
  color: #9ca9bb;
}
.indicator-options {
  position: absolute;
  top: 33px;
  left: 0;
  width: 192px;
  padding: 8px;
  background: #171c25;
  border: 1px solid #394354;
  border-radius: 5px;
  box-shadow: 0 8px 25px #0009;
  z-index: 5;
}
.indicator-options label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 6px;
  color: #bac6d8;
  font-size: 11px;
  white-space: nowrap;
  cursor: pointer;
}
.indicator-options input {
  width: 13px;
  height: 13px;
  accent-color: #387bff;
  margin: 0;
}
.chart-body {
  display: flex;
  min-width: 0;
  height: clamp(360px, calc(100vh - 480px), 680px);
  min-height: 360px;
}
.drawing-tools {
  width: 37px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  padding: 10px 3px;
  border-right: 1px solid #242931;
  background: #0c0e12;
}
.drawing-tools .terminal-icon {
  width: 29px;
  height: 29px;
}
.drawing-divider {
  width: 23px;
  height: 1px;
  background: #323a47;
  margin: 3px 0;
}
.terminal-chart-stage {
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.native-chart,
.depth-chart {
  position: absolute;
  inset: 0;
  min-width: 0;
  min-height: 0;
}
.native-chart.drawing-active {
  cursor: crosshair;
}
.depth-chart {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0a0b0d;
}
.depth-chart svg {
  width: 100%;
  max-height: 100%;
  font-family: inherit;
}
.candle-legend {
  position: absolute;
  left: 12px;
  top: 10px;
  display: flex;
  gap: 10px;
  align-items: center;
  z-index: 2;
  pointer-events: none;
  font-family: 'Consolas', 'SFMono-Regular', monospace;
  font-size: 10px;
  background: #0a0b0de8;
  max-width: calc(100% - 88px);
  overflow: hidden;
  white-space: nowrap;
  padding: 2px;
}
.candle-legend b {
  font-weight: 500;
}
.chart-label {
  color: #c2c8d1;
}
.volume-readout {
  color: #aab3c1;
}
.overlay-legend {
  position: absolute;
  left: 14px;
  top: 34px;
  display: flex;
  gap: 12px;
  font-size: 9px;
  font-weight: 550;
  z-index: 2;
  pointer-events: none;
}
.ema-key {
  color: #5f9cff;
}
.sma-key {
  color: #c79b56;
}
.bb-key {
  color: #b395f0;
}
.volume-key {
  color: #6b7585;
}
.chart-message {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 25px;
  color: #8997ab;
  background: #0a0b0de8;
  font-size: 12px;
  z-index: 2;
}
.chart-bottom {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 34px;
  padding: 0 8px 0 43px;
  border-top: 1px solid #262b33;
  color: #7a899f;
  font-size: 9px;
  white-space: nowrap;
  overflow: hidden;
}
.range-buttons {
  display: flex;
  gap: 2px;
  align-items: center;
}
.button.terminal-range,
.button.terminal-scale {
  padding: 3px 5px;
  border: 0;
  border-radius: 3px;
  font-size: 9px;
  background: none;
  color: #8596b0;
  min-height: 20px;
}
.button.terminal-range:hover,
.button.terminal-scale:hover {
  color: #fff;
  background: #222a38;
}
.button.terminal-scale.active {
  background: #1c3260;
  color: #8db7ff;
}
.chart-hint {
  margin-left: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 8px;
  color: #6e7a8b;
}
.chart-bottom time {
  font-family: 'Consolas', monospace;
  font-size: 9px;
}
.book-panel {
  display: flex;
  flex-direction: column;
  max-height: calc(clamp(360px, calc(100vh - 480px), 680px) + 118px);
}
.book-panel .terminal-panel-tabs {
  flex-shrink: 0;
}
.book-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 8px;
  gap: 6px;
}
.book-controls select {
  min-width: 0;
  flex: 1;
  background: #171a21;
  color: #c0c8d5;
  border: 1px solid #2b303a;
  border-radius: 3px;
  padding: 4px 7px;
  font-size: 10px;
}
.book-unit {
  border: 1px solid #2b303a;
  background: #171a21;
  border-radius: 3px;
  padding: 3px 10px;
  font-size: 10px;
  color: #c9d2e1;
}
.order-book-body,
.recent-trades-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #323b49 #0a0b0d;
}
.book-columns,
.book-row,
.trade-columns,
.trade-row {
  display: grid;
  grid-template-columns: 1.1fr 1fr 1.1fr;
  gap: 7px;
  padding: 0 10px;
  align-items: center;
  white-space: nowrap;
  min-width: 0;
}
.book-columns,
.trade-columns {
  position: sticky;
  top: 0;
  height: 27px;
  background: #0d1015;
  color: #758297;
  font-size: 8px;
  z-index: 2;
  border-bottom: 1px solid #252a32;
}
.book-columns span,
.book-row > span:not(:first-child),
.trade-columns span,
.trade-row > *:not(:first-child) {
  text-align: right;
}
.book-row,
.trade-row {
  height: 18px;
  font-family: 'Consolas', 'SFMono-Regular', monospace;
  font-size: 10px;
  position: relative;
  isolation: isolate;
  font-variant-numeric: tabular-nums;
  color: #d2dae7;
}
.book-row::after {
  content: '';
  position: absolute;
  right: 1px;
  top: 1px;
  bottom: 1px;
  width: var(--depth);
  background: #16c78414;
  z-index: -1;
  transition: width 0.3s;
}
.book-row.ask::after {
  background: #f6465d18;
}
.book-row > span:first-child,
.trade-row > span:first-child {
  color: var(--buy);
}
.book-row.ask > span:first-child,
.trade-row.ask > span:first-child {
  color: var(--sell);
}
.book-row:hover,
.trade-row:hover {
  background: #202631;
}
.book-mid {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 6px 10px;
  border-top: 1px solid #323945;
  border-bottom: 1px solid #323945;
  margin: 4px 0;
  background: #0e1218;
}
.book-mid > strong {
  color: #f0f3f7;
  font-size: 12px;
  white-space: nowrap;
}
.book-mid > span {
  font-size: 8px;
  color: #8fa2be;
  text-align: right;
}
.trade-row {
  height: 24px;
  border-bottom: 1px solid #151a22;
}
.trade-row time {
  font-size: 9px;
  color: #8491a4;
}
.book-footer {
  margin-top: auto;
  padding: 8px 10px;
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 8px;
  color: #6e7b8d;
  border-top: 1px solid #252a32;
  flex-shrink: 0;
}
.book-footer .dot {
  width: 4px;
  height: 4px;
}
.terminal-empty {
  display: grid;
  place-items: center;
  min-height: 180px;
  padding: 25px;
  text-align: center;
  color: #77869c;
  font-size: 11px;
  line-height: 1.7;
}
.universe-panel {
  margin-top: 8px;
  background: #0e1116;
}
.universe-panel .terminal-panel-tabs {
  height: 35px;
  font-size: 10px;
}
.universe-panel .terminal-panel-tabs > strong {
  font-size: 10px;
  font-weight: 550;
}
.universe-panel .terminal-panel-tabs > .muted {
  font-size: 9px;
}
.button.terminal-link {
  margin-left: auto;
  border: 0;
  padding: 3px 0;
  background: none;
  color: #7f9bc6;
  font-size: 9px;
}
.terminal-market-strip {
  display: flex;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #323b49 #101318;
  min-height: 65px;
  padding: 0 4px;
}
.button.terminal-market {
  background: none;
  border: 0;
  border-right: 1px solid #262c37;
  border-radius: 0;
  padding: 12px 17px;
  color: #c9d3e3;
  flex-shrink: 0;
  text-align: left;
  min-width: 98px;
  font-variant-numeric: tabular-nums;
}
.terminal-market > span {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.terminal-market b {
  font-size: 10px;
  letter-spacing: 0.25px;
  font-weight: 550;
  color: #8a98af;
}
.terminal-market > span > span {
  font-size: 12px;
  letter-spacing: -0.1px;
}
.button.terminal-market:hover {
  background: #171d28;
}
.button.terminal-market.selected {
  background: #13203a;
  box-shadow: inset 0 -2px #4285ff;
}
.terminal-market.selected b {
  color: #91b7ff;
}
.terminal-provenance {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 11px 2px 0;
  font-size: 8px;
  color: #617086;
}
.terminal-status {
  display: flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  color: #8294aa;
}
.terminal-status .dot {
  width: 4px;
  height: 4px;
}
.terminal-status.stale {
  color: #c9a65c;
}
.terminal-status.stale .dot {
  background: #c9a65c;
}
.terminal-provenance > .source-link {
  margin-left: auto;
  font-size: 8px;
  color: #647792;
}
.terminal-expanded .sidebar {
  display: none;
}
.terminal-expanded .workspace {
  margin-left: 0;
}
.terminal-expanded .topbar {
  height: 43px;
}
.terminal-expanded .chart-body {
  height: calc(100vh - 466px);
}
.terminal-expanded .book-panel {
  max-height: calc(100vh - 348px);
}
.market-terminal:fullscreen {
  padding: 8px;
  background: #090b0e;
  overflow: auto;
}
.market-terminal:fullscreen .chart-body {
  height: calc(100vh - 350px);
}
.market-terminal:fullscreen .book-panel {
  max-height: calc(100vh - 232px);
}
@media (min-width: 1700px) {
  .terminal-workspace {
    grid-template-columns: minmax(0, 1fr) 355px;
  }
  .terminal-summary {
    gap: 30px;
  }
  .book-row {
    height: 21px;
    font-size: 11px;
  }
  .chart-body {
    height: calc(100vh - 480px);
  }
}
@media (max-width: 1250px) {
  .terminal-workspace {
    grid-template-columns: minmax(0, 1fr) 275px;
  }
  .terminal-summary {
    gap: 14px;
    padding: 12px 10px;
  }
  .terminal-summary-actions .button.secondary {
    display: none;
  }
  .terminal-last {
    font-size: 16px;
  }
  .terminal-metric > strong {
    font-size: 11px;
  }
  .chart-hint {
    display: none;
  }
  .chart-toolbar {
    gap: 4px;
    padding-left: 39px;
  }
  .timeframe-button {
    padding: 4px;
  }
  .chart-mode {
    min-width: 60px;
    padding: 4px;
    font-size: 9px !important;
  }
  .indicator-menu > summary {
    font-size: 9px;
  }
}
@media (max-width: 1050px) {
  .terminal-workspace {
    grid-template-columns: minmax(0, 1fr);
  }
  .book-panel {
    max-height: 410px;
    min-height: 330px;
  }
  .terminal-summary {
    flex-wrap: wrap;
    gap: 15px 22px;
  }
  .terminal-summary-actions {
    margin-left: auto;
  }
  .book-row {
    height: 21px;
  }
  .chart-body {
    height: 470px;
  }
  .terminal-provenance {
    flex-wrap: wrap;
  }
  .book-columns,
  .book-row,
  .trade-columns,
  .trade-row {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .book-panel .terminal-panel-tabs {
    min-height: 40px;
  }
}
@media (max-width: 700px) {
  .terminal-page .page-wrap {
    padding: 9px 8px 15px;
  }
  .terminal-summary {
    gap: 14px;
    padding: 12px 10px;
  }
  .terminal-pair-wrap {
    width: calc(50% - 7px);
  }
  .price-metric {
    width: calc(50% - 7px);
  }
  .terminal-pair {
    min-width: 103px;
    max-width: 124px;
    padding-right: 16px;
  }
  .terminal-metric {
    min-width: calc(33.33% - 12px);
  }
  .terminal-summary-actions {
    margin-left: 0;
    width: 100%;
  }
  .terminal-summary-actions .button.secondary {
    display: inline-flex;
  }
  .terminal-summary-actions .button {
    flex: 1;
    justify-content: center;
  }
  .terminal-last {
    font-size: 19px;
  }
  .terminal-metric > strong {
    font-size: 12px;
  }
  .terminal-panel-tabs {
    height: 37px;
  }
  .chart-source {
    font-size: 7px;
  }
  .chart-toolbar {
    height: auto;
    min-height: 43px;
    flex-wrap: wrap;
    padding: 6px;
    gap: 6px;
  }
  .timeframe-buttons {
    flex: 1;
    justify-content: space-between;
  }
  .timeframe-button {
    padding: 3px 5px;
  }
  .chart-mode {
    border-left: 0;
  }
  .chart-toolbar > .toolbar-spacer {
    display: none;
  }
  .chart-toolbar > .terminal-icon {
    margin-left: auto;
  }
  .chart-body {
    height: 420px;
    min-height: 360px;
  }
  .drawing-tools {
    width: 31px;
    padding: 8px 1px;
    gap: 7px;
  }
  .drawing-tools .terminal-icon {
    width: 27px;
    height: 27px;
    padding: 5px;
  }
  .candle-legend {
    left: 8px;
    top: 9px;
    gap: 6px;
    font-size: 8px;
    flex-wrap: wrap;
    max-width: calc(100% - 75px);
    row-gap: 4px;
    white-space: normal;
  }
  .volume-readout {
    display: none;
  }
  .overlay-legend {
    top: 42px;
    left: 10px;
    font-size: 8px;
    gap: 9px;
  }
  .chart-bottom {
    padding-left: 5px;
    gap: 6px;
    font-size: 8px;
  }
  .chart-bottom time {
    font-size: 8px;
    margin-left: auto;
  }
  .button.terminal-range {
    font-size: 8px;
    padding: 3px;
  }
  .terminal-market-strip {
    min-height: 61px;
  }
  .button.terminal-market {
    min-width: 95px;
    padding: 10px 13px;
  }
  .terminal-provenance {
    gap: 7px 12px;
    font-size: 8px;
  }
  .terminal-provenance .tape-note {
    display: none;
  }
  .terminal-provenance > .source-link {
    font-size: 8px;
  }
  .terminal-page .workspace-footer {
    font-size: 8px;
  }
  .book-panel {
    min-height: 400px;
    max-height: 440px;
  }
  .terminal-expanded .chart-body {
    height: 420px;
  }
  .terminal-expanded .book-panel {
    max-height: 440px;
  }
}
