.activity-record-links {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: start;
  gap: .5rem;
}
.activity-bonus-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.9375rem;
  max-width: 9rem;
  padding: .25rem .625rem;
  border: 1px solid #dae7fb;
  border-radius: .5rem;
  color: #2473de;
  font-size: .75rem;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
}
.bonus-records .bonus-records-filters {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: end;
  gap: .625rem;
  padding: .625rem 0;
}
.bonus-records .bonus-records-filters > span {
  align-self: end;
  padding-block: .5rem;
  text-align: end;
}
.bonus-records select.filter-trigger {
  display: block;
  font-family: inherit;
}
.bonus-records select:focus-visible {
  outline: 2px solid #397df8;
  outline-offset: 2px;
}
.bonus-records .record {
  padding-block: .875rem;
}
.bonus-records .bonus-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  justify-content: space-between;
  gap: .375rem .75rem;
}
.bonus-records .bonus-status {
  display: inline-block;
  padding: .125rem .375rem;
  border-radius: .25rem;
  background: #eef4ff;
  color: #2969bd;
  font-size: var(--font-note);
  line-height: 1.4;
}
.bonus-records .bonus-status[data-bonus-status="completed"] {
  background: #e9f6f0;
  color: #137958;
}
.bonus-records .bonus-turnover {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: .5rem;
  margin: .625rem 0;
  font-size: var(--font-note);
}
.bonus-records .bonus-turnover dt {
  margin-bottom: .125rem;
  color: #576b83;
}
.bonus-records .bonus-turnover dd {
  margin: 0;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.bonus-records .bonus-receipt {
  color: #576b83;
  font-size: var(--font-note);
  overflow-wrap: anywhere;
}
.bonus-records .bonus-receipt summary {
  width: fit-content;
  cursor: pointer;
}
.bonus-records .bonus-records-filters .bonus-refresh {
  margin-inline-start: .25rem;
  max-width: none;
}
.bonus-records .bonus-message {
  padding: 1rem 0;
  color: #576b83;
  font-size: var(--font-text);
  text-align: center;
}