.attempt-history { margin-top: 1rem; }
.attempt-history-controls { display:flex; align-items:end; justify-content:space-between; gap:.8rem; flex-wrap:wrap; margin-bottom:.8rem; }
.attempt-history-controls label { display:grid; gap:.3rem; font-weight:700; }
.attempt-history-controls select { min-width:11rem; padding:.55rem .7rem; border:1px solid var(--border); border-radius:.55rem; background:var(--surface); color:var(--text); }
.attempt-history-toggle-buttons { gap:.4rem; }
.attempt-history-groups { display:grid; gap:.7rem; }
.attempt-history-group { border:1px solid var(--border); border-radius:.75rem; background:var(--surface); overflow:hidden; }
.attempt-history-group > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1rem; cursor:pointer; }
.attempt-history-group > summary > span:first-child { display:grid; gap:.15rem; }
.attempt-history-group > summary small { color:var(--muted); font-weight:500; }
.attempt-history-summary-tags { display:flex; gap:.35rem; flex-wrap:wrap; justify-content:flex-end; }
.attempt-history-list { display:grid; border-top:1px solid var(--border); }
.attempt-history-item { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 1rem; }
.attempt-history-item + .attempt-history-item { border-top:1px solid var(--border); }
@media (max-width:620px) {
  .attempt-history-controls, .attempt-history-item { align-items:stretch; flex-direction:column; }
  .attempt-history-controls select, .attempt-history-toggle-buttons .btn { width:100%; }
  .attempt-history-group > summary { align-items:flex-start; flex-direction:column; }
  .attempt-history-summary-tags { justify-content:flex-start; }
}