/* Private preview table controls use the established surface and focus tokens. */
.demo-table-reset { position: sticky; left: .75rem; z-index: 1; min-height: 44px; margin: .35rem .75rem; padding: .4rem .7rem; border: 1px solid var(--border); border-radius: .35rem; background: var(--surface); color: var(--lichen); font: inherit; cursor: pointer; }
.demo-table-reset:disabled { opacity: .55; cursor: default; }
.demo-table-sort-button { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; width: 100%; padding: .1rem 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; text-transform: inherit; letter-spacing: inherit; cursor: pointer; }
.demo-table-sort-button:hover { color: var(--lichen); }
.demo-table-sort-button:focus-visible, .demo-table-reset:focus-visible { outline: 3px solid var(--lichen); outline-offset: 2px; }
.demo-table-sort-indicator::after { content: '↕'; opacity: .65; }
.demo-table-sort-button[data-direction='ascending'] .demo-table-sort-indicator::after { content: '↑'; opacity: 1; }
.demo-table-sort-button[data-direction='descending'] .demo-table-sort-indicator::after { content: '↓'; opacity: 1; }