#anatomy-aic-content .tab-section {
  position: relative;
}

.aic-chain-container {
  display: grid;
  grid-template-columns: var(--panel-w, calc(12rem + 7.5vw)) auto auto 1fr;
  align-items: start;
  gap: 0;
  position: relative;
}

.aic-chain-panel {
  overflow-y: auto;
  max-height: 80vh;
  background: var(--surface);
}

.aic-chain-row {
  font-family: var(--mono);
  font-size: var(--text-sm);
  color: var(--text);
  padding: .4rem .9rem;
  border-left: 3px solid transparent;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
  transition: all var(--dur-fast);
}

.aic-chain-row:hover {
  background: var(--surface2);
}

.aic-chain-row.activeMuscle {
  background: var(--pri-bg);
  border-left: 3px solid var(--pri-fg);
  color: var(--pri-fg);
  font-weight: 600;
}

.aic-chain-connection {
  font-family: var(--mono);
  font-size: var(--text-xs);
  color: var(--text-dim);
  padding: 0 0 .2rem 1.25rem;
}

.aic-chain-terminal {
  font-style: italic;
}

.aic-chain-image-col {
  justify-self: start;
}

.aic-chain-image-wrap {
  position: relative;
}

.aic-chain-img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
  border: 1px solid var(--border);
}

.aic-chain-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.aic-leader-svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
}

.aic-chain-container .resize-handle {
  display: flex;
}

.aic-chain-detail {
  overflow-y: auto;
  max-height: 80vh;
  margin-left: 0.2rem;
  margin-right: 0.2rem;
}

.aic-chain-detail .detail-panel {
  border-left: 4px solid var(--pri-fg);
}

@media (max-width: 600px) {

  .aic-chain-container {
    grid-template-columns: 1fr;
  }

  .aic-chain-container .resize-handle {
    display: none;
  }

  .aic-chain-image-col {
    order: -1;
  }

  .aic-chain-panel {
    max-height: none;
  }

  .aic-chain-detail {
    max-height: none;
  }
}
