/* Lists of words (browse) */

.entry-list {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.entry-list li {
  min-width: 0;
  padding: var(--space-4) 0;
  overflow-wrap: anywhere; /* a long word or meaning wraps instead of widening the page on a small phone */
  border-bottom: var(--border-width) solid var(--color-border);
}

.entry-list a {
  font-weight: var(--weight-semibold);
  color: var(--color-text);
  text-decoration: none;
}

.entry-list a:hover {
  color: var(--color-accent);
}

.entry-list p {
  margin: var(--space-1) 0 0;
  color: var(--color-text-muted);
}

.letter-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin: var(--space-2) 0 var(--space-4);
}

.letter-nav a,
.letter-nav strong,
.letter-nav .reference-letter {
  display: inline-grid;
  place-items: center;
  min-width: var(--size-control-md);
  height: var(--size-control-md);
  color: var(--color-text);
  background: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  text-decoration: none;
}

.letter-nav a:hover {
  color: var(--color-accent);
  border-color: var(--color-accent);
}

.letter-nav .reference-letter {
  color: var(--color-text-muted);
  background: none;
  border-style: dashed;
  cursor: text;
  user-select: all; /* one click selects the letter, ready to copy */
}

.letter-nav strong {
  color: var(--color-on-accent);
  background: var(--color-accent);
  border-color: var(--color-accent);
}