.playerselect {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 100%;
  font-family: "Press Start 2P", monospace;
  letter-spacing: 0.05em;
  font-size: 0.9rem;
  padding-top: 1rem;
  flex-wrap: wrap;
  background: #fbe9ff;
}

[data-theme="dark"] .playerselect {
  background: #2d1b38;
}

.playerselect__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.6rem;
  width: min(320px, 100%);
}

.playerselect__title {
  font-weight: 700;
}

.playerselect__inputs {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}

.playerselect__form {
  width: 100%;
}

.playerselect__form input {
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  font-family: inherit;
  font-size: 0.9rem;
  background: var(--bg);
  color: var(--fg);
}

.playerselect__form input:focus {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}

.playerselect__duck {
  max-height: 90px;
  width: auto;
  object-fit: contain;
}