/* Chip: the handoff's chip (sheet 1a). JetBrains Mono capitals, spaced out, on a square, in one of
   three forms: filled with ink and lettered in the shell's colour (ours, staged, the ask is
   approval), outlined in ink on nothing (theirs, a look), or dashed (set aside, coming). The word
   carries the meaning; the form only whose it is.

   The uppercase is the stylesheet's, so the words stay as written for a screen reader and for
   anybody who copies them. */
.chip {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--text-mono-chip);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-chip);
  text-transform: uppercase;
  line-height: 1;
  padding: var(--chip-padding);
  border: var(--hairline) solid var(--color-ink);
  border-radius: var(--radius-chip);
  white-space: nowrap;
  vertical-align: middle;
}

/* Filled: ours, staged, or the ask is approval. */
.chip-filled {
  background: var(--color-ink);
  color: var(--color-bg);
}

/* Outlined: theirs, or a look. */
.chip-outlined {
  background: transparent;
  color: var(--color-ink);
}

/* Dashed: set aside, or coming. */
.chip-dashed {
  background: transparent;
  border-style: dashed;
  color: var(--color-ink);
}