th[aria-sort] { position: relative; }
.table-sort-button { position: relative; width: 100%; border: 0; padding: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; text-align: inherit; cursor: pointer; }
.table-sort-button::before { content: ''; position: absolute; inset: 0; }
.table-sort-button::after { content: var(--table-sort-ascending); display: inline-block; margin-left: .3em; visibility: hidden; }
.table-sort-button:hover { text-decoration: underline; }
th[aria-sort="ascending"] > .table-sort-button::after { content: var(--table-sort-ascending); visibility: visible; }
th[aria-sort="descending"] > .table-sort-button::after { content: var(--table-sort-descending); visibility: visible; }