#hexparrot {
  display: flex;
  flex-direction: column;
}

#hexparrot-input-section {
  width: 100%;
}

#hexparrot-input {
  width: 70%;
  font-size: 0.9rem;
}

#hexparrot-go {
  height: 100%;
}

#hexparrot-status {
  padding: 1rem 0;
  color: var(--green-color);
}

#hexparrot-result {
  padding: 1rem 0;
  min-height: 5rem;
  color: var(--cyan-color);
}

#prompt {
  font-weight: bold;
  color: var(--orange-color);
}

/* applied from hexparrot.js while a request is in flight */
.loader {
  clip-path: inset(0 3ch 0 0);
  animation: l4 1s steps(4) infinite;
}

@keyframes l4 {
  to {
    clip-path: inset(0 -1ch 0 0);
  }
}
