.chart-container-pane {
  width: 100%;
  position: relative;
  overflow: scroll;
}
@media screen and (min-width: 1024px) {
  .chart-container-pane {
    overflow: visible;
  }
}
.chart-table {
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  width: 975px;
}
.chart-table-header .chart-table {
  border-right: none;
  border-bottom: none;
}

.chart-table-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-right: 1px solid #000;
}
.chart-table-row {
  border-right: none;
}

.chart-table-row.span-2 {
  grid-template-columns: 1fr 1fr;
}
.chart-table-row.span-4 {
  grid-template-columns: repeat(4, 1fr);
}
.chart-table-row.span-9 {
  grid-template-columns: repeat(9, 1fr);
}
.chart-table-row.span-12 {
  grid-template-columns: repeat(12, 1fr);
}
.chart-table-row.span-13 {
  grid-template-columns: repeat(13, 1fr);
}
.chart-table-row.span-14 {
  grid-template-columns: repeat(14, 1fr);
}
.chart-table-row.span-15 {
  grid-template-columns: repeat(15, 1fr);
}
.chart-table-cell {
  padding: 8px 4px;
  border-left: 1px solid #000;
  border-bottom: 1px solid #000;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.chart-table-cell.flex-bottom {
  align-items: flex-end;
}
.chart-table-cell:empty {
  background-color: #def7e9;
}
.chart-table-header .chart-table-cell {
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  border-bottom: none;
}

.chart-table-cell.header {
  width: 120px;
}
.chart-table-header .chart-table-cell:first-child {
  border-left: none;
}

.chart-table-header .chart-table-cell:last-child {
  border-right: none;
}

.chart-table-cell.col-3 {
  grid-column: 3;
}
.chart-table-cell.col-4 {
  grid-column: 4;
}
.chart-table-cell.col-5 {
  grid-column: 5;
}
.chart-table-cell.col-6 {
  grid-column: 6;
}
.chart-table-cell.col-7 {
  grid-column: 7;
}
.chart-table-cell.col-8 {
  grid-column: 8;
}
.chart-table-cell.col-9 {
  grid-column: 9;
}
.chart-table-cell.col-10 {
  grid-column: 10;
}
.chart-table-cell.col-11 {
  grid-column: 11;
}
.chart-table-cell.col-12 {
  grid-column: 12;
}
.chart-table-cell.col-13 {
  grid-column: 13;
}
.chart-table-cell.col-14 {
  grid-column: 14;
}
.chart-table-cell.col-15 {
  grid-column: 15;
}
.chart-table-cell.col-5-row-4 {
  grid-column: 5;
  grid-row: 4;
}
.chart-table-cell.col-6-row-4 {
  grid-column: 6;
  grid-row: 4;
}
.chart-table-cell.col-7-row-4 {
  grid-column: 7;
  grid-row: 4;
}
.chart-table-cell.col-8-row-4 {
  grid-column: 8;
  grid-row: 4;
}
.chart-table-cell.col-9-row-4 {
  grid-column: 9;
  grid-row: 4;
}
.chart-table-cell.col-10-row-4 {
  grid-column: 10;
  grid-row: 4;
}
.chart-table-cell.col-11-row-4 {
  grid-column: 11;
  grid-row: 4;
}
.chart-table-cell.col-12-row-4 {
  grid-column: 12;
  grid-row: 4;
}
.chart-table-cell.col-13-row-4 {
  grid-column: 13;
  grid-row: 4;
}
.chart-table-cell.col-14-row-4 {
  grid-column: 14;
  grid-row: 4;
}
.chart-table-cell.col-2-row-span-3-5 {
  grid-column: 2;
  grid-row: 3/span 5;
}
.chart-table-cell.col-3-row-span-3-5 {
  grid-column: 3;
  grid-row: 3/span 5;
}
.chart-table-cell.col-3-row-span-1-1 {
  grid-column: 3;
  grid-row: 1/span 1;
}
.chart-table-cell.col-3-row-span-2-4 {
  grid-column: 3;
  grid-row: 2/span 3;
}
.chart-table-cell.col-4-row-span-4-3 {
  grid-column: 4;
  grid-row: 4/span 3;
}
.chart-table-cell.col-5-row-span-1-2 {
  grid-column: 5;
  grid-row: 1/span 2;
}
.chart-table-cell.col-5-row-span-2-3 {
  grid-column: 5;
  grid-row: 2/span 3;
}
.chart-table-cell.col-5-row-span-3-4 {
  grid-column: 5;
  grid-row: 3/span 2;
}
.chart-table-cell.col-6-row-span-1-3 {
  grid-column: 6;
  grid-row: 1/span 3;
  border-bottom: 1px solid #000;
}
.chart-table-cell.col-6-row-span-2-3 {
  grid-column: 6;
  grid-row: 2/span 3;
}
.chart-table-cell.col-6-row-span-5-2 {
  grid-column: 6;
  grid-row: 5/span 2;
}
.chart-table-cell.col-7-row-span-1-3 {
  grid-column: 7;
  grid-row: 1/span 3;
}
.chart-table-cell.col-7-row-span-2-3 {
  grid-column: 7;
  grid-row: 2/span 3;
}
.chart-table-cell.col-7-row-span-5-2 {
  grid-column: 7;
  grid-row: 5/span 2;
}
.chart-table-cell.col-8-row-span-1-3 {
  grid-column: 8;
  grid-row: 1/span 3;
}
.chart-table-cell.col-8-row-span-2-3 {
  grid-column: 8;
  grid-row: 2/span 3;
}
.chart-table-cell.col-8-row-span-5-2 {
  grid-column: 8;
  grid-row: 5/span 2;
}
.chart-table-cell.col-9-row-span-1-3 {
  grid-column: 9;
  grid-row: 1/span 3;
}
.chart-table-cell.col-9-row-span-2-3 {
  grid-column: 9;
  grid-row: 2/span 3;
}
.chart-table-cell.col-9-row-span-5-2 {
  grid-column: 9;
  grid-row: 5/span 2;
}
.chart-table-cell.col-10-row-span-1-3 {
  grid-column: 10;
  grid-row: 1/span 3;
}
.chart-table-cell.col-10-row-span-2-3 {
  grid-column: 10;
  grid-row: 2/span 3;
}
.chart-table-cell.col-10-row-span-5-2 {
  grid-column: 10;
  grid-row: 5/span 2;
}
.chart-table-cell.col-11-row-span-1-3 {
  grid-column: 11;
  grid-row: 1/span 3;
}
.chart-table-cell.col-11-row-span-2-3 {
  grid-column: 11;
  grid-row: 2/span 3;
}
.chart-table-cell.col-11-row-span-5-2 {
  grid-column: 11;
  grid-row: 5/span 2;
}
.chart-table-cell.col-12-row-span-1-3 {
  grid-column: 12;
  grid-row: 1/span 3;
}
.chart-table-cell.col-12-row-span-2-3 {
  grid-column: 12;
  grid-row: 2/span 3;
}
.chart-table-cell.col-12-row-span-5-2 {
  grid-column: 12;
  grid-row: 5/span 2;
}
.chart-table-cell.col-13-row-span-1-3 {
  grid-column: 13;
  grid-row: 1/span 3;
}
.chart-table-cell.col-13-row-span-2-3 {
  grid-column: 13;
  grid-row: 2/span 3;
}
.chart-table-cell.col-13-row-span-5-2 {
  grid-column: 13;
  grid-row: 5/span 2;
}
.chart-table-cell.col-14-row-span-1-3 {
  grid-column: 14;
  grid-row: 1/span 3;
}
.chart-table-cell.col-14-row-span-2-3 {
  grid-column: 14;
  grid-row: 2/span 3;
}
.chart-table-cell.col-14-row-span-5-2 {
  grid-column: 14;
  grid-row: 5/span 2;
}
.chart-table-cell.col-15-row-span-2-3 {
  grid-column: 15;
  grid-row: 2/span 3;
}
.chart-table-cell.col-15-row-span-5-2 {
  grid-column: 15;
  grid-row: 5/span 2;
}
.chart-table-cell.row-span-1-1 {
  grid-row: 1;
}
.chart-table-cell.row-span-1-2 {
  grid-row: 1/span 2;
  border-bottom: 1px solid #000;
}
.chart-table-cell.row-span-1-3 {
  grid-row: 1/span 3;
}
.chart-table-cell.row-span-1-4 {
  grid-row: 1/span 4;
}
.chart-table-cell.row-span-5-3 {
  grid-row: 5/span 3;
}
.chart-table-cell.row-2 {
  grid-row: 2;
}
.chart-table-cell.row-3 {
  grid-row: 3;
}
.chart-table-cell.row-4 {
  grid-row: 4;
}
.chart-table-cell.row-5 {
  grid-row: 5;
}
.chart-table-cell.row-6 {
  grid-row: 6;
}
.chart-table-cell.row-7 {
  grid-row: 7;
}
.chart-table-header {
  padding: 8px 4px;
  border-left: 1px solid #000;
  border-bottom: 1px solid #000;
  background-color: #def7e9;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.chart-table-header .chart-table {
  width: 100%;
}
.chart-table-header:has(.chart-table) {
  width: auto;
  flex-flow: column;
  align-items: normal;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  grid-column: 1/span 2;
}
.drill-bearing-length.sf-fm .chart-table-header:has(.chart-table) .chart-table-cell {
  width: 61px;
}

.drill-bearing-length.h .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(2),
.drill-bearing-length.h .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(5),
.drill-bearing-length.h .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(8) {
  width: 65px;
}

.drill-bearing-length.p .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(2),
.drill-bearing-length.p .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(5),
.drill-bearing-length.p .chart-table-header:has(.chart-table) .chart-table-cell:nth-of-type(8) {
  width: 66px;
}

.span-14 .chart-table-header:last-child {
  grid-column: 3/span 12;
}

.span-15 .chart-table-header:last-child {
  grid-column: 3/span 13;
}