.identity-chip.is-editable {
  cursor: text;
  position: relative;
}

.identity-chip.is-editable::after {
  content: "✎";
  font-size: 0.72em;
  margin-left: 0.32rem;
  opacity: 0.58;
}

.identity-chip.is-editable:focus-visible {
  outline: 2px solid #1236c9;
  outline-offset: 2px;
}

.identity-chip.is-editing {
  padding: 0.18rem 0.3rem;
}

.identity-chip.is-editing::after {
  content: none;
}

.identity-chip-input {
  width: clamp(5.5rem, 18vw, 15rem);
  min-width: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: inherit;
  font: inherit;
  line-height: 1.35;
  padding: 0.22rem 0.5rem;
  outline: 2px solid rgba(0, 48, 87, 0.24);
}

.identity-chip-input:focus {
  outline-color: #1236c9;
}

@media (max-width: 520px) {
  .identity-chip-input {
    width: min(12rem, 58vw);
  }
}