.choice-code-content {
  display: grid;
  gap: 22px;
}

.choice-code-intro {
  border: 1px solid rgba(215, 154, 59, .2);
  border-radius: 18px;
  padding: 20px 22px;
  background: rgba(215, 154, 59, .045);
}

.choice-code-intro h2 {
  margin: 0;
  font-size: clamp(1.35rem, 2.5vw, 1.9rem);
}

.choice-code-intro p:last-child {
  max-width: 980px;
  margin: 9px 0 0;
  color: var(--muted);
  font: 500 .88rem/1.6 ui-sans-serif, system-ui, sans-serif;
}

.choice-code-list {
  display: grid;
  gap: 12px;
  padding: 0 22px 24px;
}

.choice-code-list-status {
  margin: 16px 22px 8px;
}

.choice-code-card {
  display: grid;
  gap: 13px;
  padding: 17px;
  border: 1px solid rgba(215, 154, 59, .22);
  border-radius: 15px;
  background: rgba(255, 255, 255, .024);
}

.choice-code-card.is-inactive {
  opacity: .72;
}

.choice-code-card-top,
.choice-code-card-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.choice-code-card h3 {
  margin: 0;
  font-size: 1.08rem;
}

.choice-code-card-title {
  display: grid;
  gap: 7px;
}

.choice-code-badge {
  display: inline-flex;
  width: fit-content;
  border: 1px solid rgba(240, 187, 103, .35);
  border-radius: 8px;
  padding: 5px 8px;
  color: var(--gold-light);
  background: rgba(215, 154, 59, .08);
  font: 800 .8rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}

.choice-code-status {
  border-radius: 999px;
  padding: 6px 9px;
  font: 800 .68rem/1 ui-sans-serif, system-ui, sans-serif;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.choice-code-status.is-active {
  color: var(--success);
  background: rgba(133, 214, 163, .1);
}

.choice-code-status.is-inactive,
.choice-code-status.is-used {
  color: var(--muted);
  background: rgba(255, 255, 255, .05);
}

.choice-code-meta,
.choice-code-members-copy {
  color: var(--muted);
  font: 600 .8rem/1.45 ui-sans-serif, system-ui, sans-serif;
}

.choice-code-member-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.choice-code-member-chip {
  border: 1px solid rgba(215, 154, 59, .16);
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(0, 0, 0, .15);
  color: var(--ink);
  font: 600 .74rem/1.25 ui-sans-serif, system-ui, sans-serif;
}

.choice-code-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.choice-code-members {
  display: grid;
  gap: 9px;
}

.choice-code-member-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-height: 58px;
  border: 1px solid rgba(215, 154, 59, .18);
  border-radius: 12px;
  padding: 11px 12px;
  background: rgba(255, 255, 255, .02);
}

.choice-code-member-option.is-unavailable {
  opacity: .55;
}

.choice-code-member-option input {
  width: 17px;
  min-height: 17px;
  height: 17px;
  margin: 3px 0 0;
}

.choice-code-member-copy {
  display: grid;
  gap: 3px;
}

.choice-code-member-copy strong {
  color: var(--ink);
  font: 750 .82rem/1.3 ui-sans-serif, system-ui, sans-serif;
}

.choice-code-member-copy small {
  color: var(--muted);
  font: 500 .74rem/1.35 ui-sans-serif, system-ui, sans-serif;
}

@media (max-width: 760px) {
  .choice-code-card-top,
  .choice-code-card-bottom {
    align-items: stretch;
    flex-direction: column;
  }

  .choice-code-actions .button {
    flex: 1;
  }
}