/* Quantitative tables. Scoped to preserve the surrounding project page. */
.quantitative-results {
  --results-accent: #4568ad;
  --results-highlight: #eef2fc;
  --results-header: #f4f6f9;
  width: 85%;
  max-width: 1003px;
  margin-inline: auto;
}

.results-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px 24px;
  margin-bottom: 22px;
}

.results-tabs {
  display: inline-flex;
  gap: 4px;
  max-width: 100%;
  padding: 5px;
  border: 1px solid #dfe5ed;
  border-radius: 9px;
  background: #f1f4f7;
}

.results-tabs button {
  border: 0;
  border-radius: 6px;
  padding: 10px 17px;
  background: transparent;
  color: #606e80;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  cursor: pointer;
  transition: background-color .15s, color .15s, box-shadow .15s;
}

.results-tabs button:hover { color: var(--results-accent); background: #e8edf5; }
.results-tabs button[aria-selected="true"] {
  color: var(--results-accent);
  background: #fff;
  box-shadow: 0 1px 5px rgb(35 54 85 / 9%);
}

.results-view-tabs { margin-left: auto; }
.results-context {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 14px;
  margin-bottom: 12px;
  font-size: 15px;
  color: var(--muted);
}
.results-context strong { color: #526077; font-weight: 600; }

.results-table-scroll {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #dce3ec;
  border-radius: 7.65px;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #b9c6d9 #f4f6f9;
}
.results-table-scroll:focus-visible { outline: 3px solid #78a6db; outline-offset: 4px; }

.quantitative-table {
  width: 100%;
  min-width: 612px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  text-align: right;
  font-size: 15px;
  line-height: 1.5;
  font-variant-numeric: tabular-nums lining-nums;
}
.quantitative-table th, .quantitative-table td {
  padding: 14.45px 19.55px;
  border-bottom: 1px solid #e6ebf1;
  vertical-align: middle;
  white-space: nowrap;
}
.quantitative-table tr > :first-child { width: 32%; text-align: left; }
.quantitative-table thead th {
  padding-block: 16.15px;
  background: var(--results-header);
  color: #647389;
  font-weight: 600;
  text-align: right;
}
.quantitative-table tbody th { color: var(--ink); font-weight: 550; }
.quantitative-table tbody tr { background: #fff; }
.quantitative-table tbody tr:not(.results-category):hover { background: #fafbfd; }
.quantitative-table tbody:last-child tr:last-child > * { border-bottom: 0; }
.quantitative-table .results-category th {
  padding: 7.65px 19.55px;
  background: #f8f9fb;
  color: #728096;
  font-size: 10.2px;
  font-weight: 600;
  letter-spacing: .055em;
}
.quantitative-table .results-ours-group tr:first-child > * { border-top: 1px solid #dce3ec; }
.quantitative-table tr.results-one-stage { background: #f8faff; }
.quantitative-table tr.results-one-stage > * { color: #67758b; }
.quantitative-table .results-one-stage th span { font-weight: 400; }
.quantitative-table tbody tr.results-ours,
.quantitative-table tbody tr.results-ours:hover { background: var(--results-highlight); }
.quantitative-table tr.results-ours > *,
.quantitative-table tr.results-ours strong { color: var(--results-accent); font-weight: 700; }
.quantitative-table tr.results-ours th { box-shadow: inset 3.4px 0 #7287cf; }
.results-scroll-hint { display: none; }
/* With JavaScript disabled, show every table with comfortable separation. */
.results-view + .results-view, .results-modality-panel + .results-modality-panel { margin-top: 28px; }
.quantitative-results.is-enhanced .results-view,
.quantitative-results.is-enhanced .results-modality-panel { margin-top: 0; }

/* Leave room for the page's existing fixed Back to top control. */
@media (min-width: 1201px) and (max-width: 1479px) {
  .quantitative-results { max-width: calc(85vw - 255px); }
}

@media (max-width: 1000px) {
  .results-tabs button { padding-inline: 13px; }
  .quantitative-table th, .quantitative-table td { padding-inline: 13.6px; }
}

@media (max-width: 760px) {
  .results-controls { align-items: flex-start; gap: 12px; margin-bottom: 17px; }
  .results-modality-tabs { align-self: flex-start; }
  .results-view-tabs { width: 100%; margin-left: 0; flex-wrap: wrap; }
  .results-tabs button { padding: 9px 12px; font-size: 13px; }
  .results-view-tabs button { flex: 1 1 auto; }
  .results-context { flex-direction: column; gap: 1px; font-size: 13px; }
  .quantitative-table { min-width: 578px; font-size: 11.9px; }
  .quantitative-table th, .quantitative-table td { padding: 11.9px 13.6px; }
  .quantitative-table thead th { padding-block: 13.6px; }
  .quantitative-table tr > :first-child { width: 187px; }
  .quantitative-table th[scope="row"], .quantitative-table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #fff;
    border-right: 1px solid #e6ebf1;
  }
  .quantitative-table thead th:first-child { background: var(--results-header); }
  .quantitative-table .results-one-stage th { background: #f8faff; }
  .quantitative-table .results-ours th { background: var(--results-highlight); }
  .quantitative-table .results-category th { padding: 6.8px 13.6px; }
  .results-scroll-hint { display: block; margin-top: 7px; color: #728096; font-size: 11px; }
}

@media (max-width: 430px) {
  .results-view-tabs[data-results-view-tabs="echo"] { flex-direction: column; }
  .results-view-tabs[data-results-view-tabs="echo"] button { width: 100%; text-align: left; }
  .quantitative-table tr > :first-child { width: 159.8px; }
  .quantitative-table th[scope="row"] span { display: block; font-size: 10.2px; }
}