.public-list {
  display: grid;
  gap: .75rem;
}

.public-list-row {
  display: grid;
  align-items: center;
  gap: 1.5rem;
  min-width: 0;
  padding: 1.25rem 1.5rem;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 1.1rem;
  background: rgba(255, 255, 255, .045);
  transition: border-color .2s ease, background .2s ease;
}

.public-list-row:hover,
.public-list-row:focus-within {
  border-color: rgba(200, 167, 93, .5);
  background: rgba(255, 255, 255, .075);
}

.public-list-copy { min-width: 0; }
.public-list-copy h2,
.public-list-copy h3 { line-height: 1.35; overflow-wrap: anywhere; }
.public-list-copy p { overflow-wrap: anywhere; }

.category-list-row {
  grid-template-columns: minmax(0, 1fr) auto 1.5rem;
  color: inherit;
  text-decoration: none;
}

.category-list-row:hover h3,
.category-list-row:focus-visible h3 { color: #c8a75d; }
.category-list-row:focus-visible,
.nominee-list-vote:focus-visible { outline: 2px solid #c8a75d; outline-offset: 3px; }
.public-list-count { color: #c8a75d; font-size: .875rem; white-space: nowrap; }
.public-list-arrow { color: #c8a75d; font-size: 1.5rem; line-height: 1; text-align: right; }

.nominee-list-row { grid-template-columns: minmax(0, 1fr) auto; }
.nominee-list-vote { min-width: 7rem; white-space: nowrap; }

@media (max-width: 640px) {
  .public-list-row { gap: .75rem; padding: 1.1rem 1.2rem; }
  .category-list-row { grid-template-columns: minmax(0, 1fr) 1.5rem; }
  .category-list-row .public-list-copy { grid-column: 1; }
  .public-list-count { grid-column: 1; grid-row: 2; }
  .public-list-arrow { grid-column: 2; grid-row: 1 / span 2; }
  .nominee-list-row { grid-template-columns: minmax(0, 1fr); }
  .nominee-list-vote { width: 100%; margin-top: .25rem; }
}
