/* Tables: sticky sortable headers, whole-row links, stacked cards on a phone. */
.tablewrap { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-1); }
.tablescroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
thead th {
  position: sticky; top: 0; z-index: 1; text-align: left; font-weight: 620; font-size: .76rem; letter-spacing: .04em;
  text-transform: uppercase; color: var(--ink-3); background: var(--surface-2); padding: 0 14px; height: 38px; white-space: nowrap;
  border-bottom: 1px solid var(--line);
}
thead th button {
  all: unset; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; height: 38px; color: inherit;
}
thead th button:hover { color: var(--ink); }
thead th button:focus-visible { box-shadow: 0 0 0 2px var(--ring); border-radius: 4px; }
thead th[aria-sort] { color: var(--ink); }
thead th .arrow { opacity: 0; transition: opacity .1s; }
thead th button:hover .arrow, thead th[aria-sort] .arrow { opacity: 1; }
td { padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr.click { cursor: pointer; }
tbody tr.click:hover { background: var(--surface-2); }
tbody tr.click td:first-child a { color: var(--ink); font-weight: 580; }
th.num, td.num { text-align: right; font-variant-numeric: tabular-nums; }
th.num button { justify-content: flex-end; }
td.wrap { overflow-wrap: anywhere; }
td .sub { display: block; color: var(--ink-3); font-size: .82rem; font-weight: 400; margin-top: 1px; }
td.act { text-align: right; white-space: nowrap; }
.more { display: flex; gap: 14px; align-items: center; justify-content: center; padding: 10px; border-top: 1px solid var(--line); color: var(--ink-3); font-size: .88rem; }
.more:empty { display: none; }
@media (max-width: 700px) {
  table, tbody, tr, td { display: block; width: 100%; }
  thead { display: none; }
  tr { padding: 10px 6px; border-bottom: 1px solid var(--line); }
  tbody tr:last-child { border-bottom: 0; }
  td { border: 0; padding: 3px 10px; display: flex; gap: 12px; justify-content: space-between; text-align: right; }
  td::before { content: attr(data-label); color: var(--ink-3); font-size: .8rem; text-align: left; flex: none; max-width: 42%; }
  td:empty { display: none; }
  td.act { justify-content: flex-end; }
  td.act::before { display: none; }
}