.soil-pile {
  position: absolute;
  right: 18px;
  z-index: 3;
  min-height: 18px;
  border: 2px solid #101715;
  border-radius: 7px 7px 3px 3px;
  background: repeating-linear-gradient(90deg, #f9fbfa 0 4px, #e2e9e6 4px 6px);
  box-shadow: 0 0 0 2px #fff8;
}
.soil-pile::before { content: ""; position: absolute; inset: -5px -5px auto; height: 5px; background: #101715; border-radius: 2px; }
.soil-pile i { position: absolute; left: 50%; bottom: -7px; width: 0; height: 0; transform: translateX(-50%); border-inline: 7px solid transparent; border-top: 7px solid #101715; }
.soil-pile b { position: absolute; left: 50%; bottom: -4px; width: 4px; height: 4px; transform: translateX(-50%); border-radius: 50%; background: var(--red); }
.soil-pile span { position: absolute; right: calc(100% + 8px); top: 1px; width: 116px; text-align: right; color: #25332e; font-size: 10px; font-weight: 650; line-height: 1.2; text-shadow: 0 1px #fff; }

.soil-layer { display: flex; align-items: center; }
.soil-layer-labels { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding-right: 84px; text-align: left; }
.tip-depth-marker span { top: 7px; }

@media (max-width: 1200px) {
  .soil-layer-labels { padding-right: 66px; }
}