.panel-tools { display: flex; align-items: center; gap: 10px; }
.panel-tools input { width: 220px; padding: 7px 10px; font-size: 12px; }
th.sortable { cursor: pointer; user-select: none; }
th.sortable:hover { color: var(--text); }
th.sortable::after { content: " ↕"; color: #49615a; }
th.sortable[data-direction="asc"]::after { content: " ↑"; color: var(--teal); }
th.sortable[data-direction="desc"]::after { content: " ↓"; color: var(--teal); }
.row-actions { display: flex !important; grid-auto-flow: column; gap: 6px !important; }
@media (max-width: 700px) {
  .panel-tools input { width: 150px; }
}