/* ==========================================================================
   games.css: game library page.
   ========================================================================== */

.library-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--s-4); margin-bottom: var(--s-5); }
.library-controls fieldset { margin: 0; padding: 0; border: 0; }
.library-controls .field:first-child { flex: 1 1 260px; max-width: 360px; }
#genre-filter { min-width: 160px; }

.results-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-3); margin-bottom: var(--s-2); }
.library-empty { margin-top: var(--s-3); list-style: none; }
.library-note { margin-top: var(--s-3); max-width: 80ch; }

.recent { margin-top: var(--s-7); }
.recent-table td:first-child a { color: var(--text); font-weight: 500; }
.recent-table td:first-child a:hover { color: var(--accent); }

@media (max-width: 640px) {
  .library-controls .field:first-child { max-width: none; }
  .segmented span { padding: 0 8px; }
}
.library-controls legend { padding: 0; }