/* misc.css — slice of the former style.css (see also: sibling css/ files) */
/* ============================================================
   What's New modal list
   ============================================================ */
.whatsnew-list {
  list-style: disc;
  padding-left: 20px;
  margin: 0 0 16px;
  max-height: 50vh;
  overflow-y: auto;
  font-size: 0.9rem;
  line-height: 1.5;
}
.whatsnew-list li { margin: 4px 0; color: var(--text); }

/* --- What's new history page --- */
.whatsnew-page { max-width: 720px; margin: 0 auto; }
.whatsnew-page-head { margin-bottom: 24px; }
.whatsnew-page-head h1 { margin: 0 0 4px; }
.release-log { list-style: none; margin: 0; padding: 0; }
.release {
	padding: 16px 0;
	border-top: 1px solid var(--border);
}
.release:first-child { border-top: none; }
.release-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}
.release-version { font-weight: 700; font-size: 1.05rem; }
.release-date { font-size: 0.8rem; }
.release-changes { margin: 0; padding-left: 18px; }
.release-changes li { margin: 4px 0; color: var(--text); }
.release-empty { padding: 24px 0; }
.release-more { text-align: center; padding: 16px 0; font-size: 0.85rem; }

/* ============================================================
   User menu version footer
   ============================================================ */
.user-menu-version {
  display: block;
  margin-top: 6px;
  padding-top: 6px;
  font-size: 0.65rem;
  color: var(--muted, #9aa);
  opacity: 0.55;
  text-align: right;
  letter-spacing: 0.04em;
}

/* ============================================================
   Overview compact widgets
   ============================================================ */
.card-header h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.card-header h2 svg { color: var(--accent); flex: 0 0 auto; }

table.leaderboard.compact th,
table.leaderboard.compact td {
  padding: 6px 8px;
  font-size: 0.9rem;
}

.members-preview .avatar-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.avatar-chip {
  display: inline-flex;
  text-decoration: none;
  transition: transform 120ms;
}
.avatar-chip:hover { transform: translateY(-2px); }
.avatar-chip.dim { opacity: 0.45; }
.avatar-chip .avatar {
  border: 2px solid var(--panel);
  box-shadow: 0 0 0 1px var(--border);
  border-radius: 50%;
}
.avatar-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  min-width: 32px;
  padding: 0 8px;
  border-radius: 16px;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--muted, #9aa);
  font-size: 0.8rem;
  text-decoration: none;
}
.avatar-more:hover { color: var(--accent); border-color: var(--accent); }

/* ============================================================
   Tools hub
   ============================================================ */
.tools-grid .tool-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tools-grid .tool-card h2 { margin: 0; font-size: 1.05rem; }
.tools-grid .tool-card .tool-icon { font-size: 1.6rem; line-height: 1; }
.tools-grid .tool-card.disabled { opacity: 0.7; }
.tools-grid .tool-card .pill { align-self: flex-start; margin-top: auto; }

/* ============================================================
   Sortable table headers
   ============================================================ */
table.sortable th.sort-col {
  cursor: pointer;
  user-select: none;
}
table.sortable th.sort-col:hover { color: var(--accent); }
table.sortable .sort-arrow { color: var(--accent); font-size: 0.78em; }


/* version footer is now a link to /whats-new */
.user-menu-version { text-decoration: none; }
.user-menu-version:hover { color: var(--text); }