/* Bout history and who-is-in. Locked palette and fonts only. */
.bout-who, .bout-history {
  padding: var(--bout-section) var(--bout-inset);
  border-top: 1px solid var(--line);
  display: grid;
  gap: var(--bout-group);
}
.bout-who__body, .bout-history__body { display: grid; gap: var(--space-16); min-width: 0; }
.bout-who-state, .bout-history-state { margin: 0; max-width: 70ch; }
.bout-who-totals { display: flex; flex-wrap: wrap; gap: var(--space-12) var(--space-24); font: 400 var(--fs-label)/1.4 var(--font-body); }
.bout-who-list { list-style: none; padding: 0; margin: 0; display: grid; }
.bout-who-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 1fr) minmax(0, 0.9fr);
  gap: var(--space-12);
  align-items: center;
  min-height: 44px;
  padding-block: var(--space-8);
  border-bottom: 1px solid var(--line);
  min-width: 0;
}
.bout-who-row.is-you { font-weight: 500; }
.bout-who-row a { min-height: 44px; display: inline-flex; align-items: center; }
.bout-who-row.is-enter { animation: bout-who-in 420ms var(--ease-out-expo) both; }
.bout-history-tabs { width: min(100%, 960px); margin-inline: 0; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
.bout-history-tabs .bc-tabs__line { width: calc(100% / var(--tab-count, 1)); }
.bout-history-record { display: grid; gap: var(--space-8); }
.bout-history-record p { margin: 0; font: 400 var(--fs-body)/1.4 var(--font-body); }
.bout-history-split {
  height: 4px;
  background: var(--line);
  overflow: hidden;
}
.bout-history-split__a {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--ink);
  transform: scaleX(var(--split, 0));
  transform-origin: left center;
}
.bout-history-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  min-width: 0;
}
.bout-history-table th,
.bout-history-table td {
  height: 44px;
  min-height: 44px;
  padding: 0 var(--space-8);
  vertical-align: middle;
  font: 400 var(--fs-body)/1.4 var(--font-body);
  font-variant-numeric: tabular-nums;
}
.bout-history-table th { font: 500 var(--fs-label)/1.4 var(--font-body); letter-spacing: var(--track-label); }
.bout-history-table .side-a { text-align: right; }
.bout-history-table .side-b { text-align: left; }
.bout-history-table .day { text-align: center; }
.bout-history-table .is-win { font-weight: 600; }
.bout-history-mark {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: currentColor;
  margin-inline: var(--space-8);
  vertical-align: middle;
}
.bout-history-void { font: 400 var(--fs-label)/1.4 var(--font-body); color: var(--ink-soft); }
.bout-history-skel { display: grid; }
.bout-history-skel__row {
  min-height: 44px;
  border-bottom: 1px solid var(--line);
  background: var(--tint);
}
.bout-history details.bc-accordion { max-width: 70ch; }
@keyframes bout-who-in {
  from { transform: translateY(8px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@media (max-width: 767px) {
  .bout-who-row,
  .bout-history-table,
  .bout-history-table tbody,
  .bout-history-table tr { display: block; }
  .bout-who-row { grid-template-columns: minmax(0, 1fr); padding-block: var(--space-12); }
  .bout-history-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    clip-path: inset(50%);
    overflow: hidden;
  }
  .bout-history-table td {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    text-align: left;
    height: auto;
    min-height: 44px;
    padding: var(--space-12) 0;
  }
  .bout-history-table td::before {
    content: attr(data-label);
    font: 400 12px/1.4 var(--font-body);
    color: var(--ink-soft);
  }
  .bout-history-table .side-a,
  .bout-history-table .side-b,
  .bout-history-table .day { text-align: left; }
  .bout-history-tabs { width: 100%; }
}
@media (max-width: 360px) {
  .bout-who, .bout-history { overflow-x: hidden; }
  .bout-who-row, .bout-history-table { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .bout-who-row.is-enter { animation: none; }
  .bout-history-split__a { transition: none; }
}