/* League balance: the decade heatmap. */

.chart-note {
  color: var(--ink-2);
  font-size: 14px;
  margin: 10px 0 0;
}

.card > .chart-note:first-child {
  margin: 0 0 12px;
}

.heat-key {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink-2);
  margin-bottom: 12px;
}

.heat-key .ramp {
  width: 160px;
  height: 10px;
  border-radius: 3px;
}

.heat-cell {
  cursor: default;
}

.heat-cell:focus {
  outline: none;
}

.heat-cell:focus rect,
.heat-cell:hover rect {
  stroke: var(--ink);
  stroke-width: 1.5;
}

.heat-label {
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}

.row-label {
  fill: var(--ink);
  font-size: 13px;
}

.streak-n {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 800;
}