#changelog-table {
  display: grid;
  /* IDs never exceed three digits; portraits are 48×48 px */
  grid-template-columns: var(--touch-target-size) var(--touch-target-size) 3fr 4fr 1fr;
  width: 100%;
  padding: var(--space-lg);
  gap: var(--space-md);
  box-sizing: border-box;
}

#changelog-table thead,
#changelog-table tbody,
#changelog-table tr {
  display: contents;
}

#changelog-table th,
#changelog-table td {
  padding: var(--space-xs) var(--space-sm);
  text-align: left;
  border-bottom: 1px solid var(--color-secondary);
}

#changelog-table img {
  width: 48px;
  height: 48px;
  object-fit: cover;
}

#changelog-table tbody tr:nth-child(odd) {
  background-color: var(--color-surface);
}

#changelog-table tbody tr:nth-child(even) {
  background-color: var(--color-tertiary);
}
