#palette {
  display: grid;
  grid-template: repeat(4,max-content) / repeat(3,max-content);
  grid-auto-flow: column;
  gap: 1rem;
  justify-content: center;
  font-feature-settings: 'lnum','tnum';
}

#palette > div {
  padding: 2px 2px 2px 2rem;
  border-radius: var(--rounding);
}

#palette > div > span {
  display: block;
  padding: calc(0.25rem - 2px) calc(0.5rem - 2px);
  border-radius: calc(var(--rounding) - 2px);
  background: rgba(255,255,255,0.75);
}

#palette-a35 {
  background: #a35;
}

#palette-c66 {
  background: #c66;
}

#palette-e94 {
  background: #e94;
}

#palette-ed0 {
  background: #ed0;
}

#palette-9d5 {
  background: #9d5;
}

#palette-4d8 {
  background: #4d8;
}

#palette-2cb {
  background: #2cb;
}

#palette-0bc {
  background: #0bc;
}

#palette-09c {
  background: #09c;
}

#palette-36b {
  background: #36b;
}

#palette-639 {
  background: #639;
}

#palette-817 {
  background: #817;
}