/* Sortable header · the kit rules for this component, quoted from phase-2/kit (kit v3) by phase-4/src/build_pack.py.
   Tokens come from ../../styles.css. Build it as: Table. */
/* families/data-table/family.css */
.dt th{font-family:var(--font-voice);font-stretch:var(--font-stretch-title);font-variation-settings:normal;letter-spacing:0}
/* families/data-table/family.css */
.dt th{position:sticky;top:0;z-index:3;height:var(--row-th);padding:0 var(--s-3);background:hsl(var(--muted));border-bottom:1px solid hsl(var(--border));text-align:left;font-size:var(--text-small);font-weight:var(--w-semibold);color:hsl(var(--muted-foreground));white-space:nowrap;vertical-align:middle}
/* families/data-table/family.css */
.dt th.num{text-align:right}
/* families/data-table/family.css */
.dt th.num .dt-sort{flex-direction:row-reverse;margin-right:-6px;margin-left:0}
/* families/data-table/family.css */
.dt-sort{display:inline-flex;align-items:center;gap:var(--s-1);height:28px;padding:0 6px;margin-left:-6px;border-radius:var(--r-control);font:inherit;color:inherit;transition:background-color var(--motion-hover),color var(--motion-hover)}
/* families/data-table/family.css */
.dt-sort svg{opacity:.45;transition:opacity var(--motion-hover),transform var(--motion-hover)}
/* families/data-table/family.css */
.dt-sort:hover, .dt-sort.is-hover{background:hsl(var(--foreground)/.06);color:hsl(var(--foreground))}
/* families/data-table/family.css */
.dt-sort:hover svg, .dt-sort.is-hover svg{opacity:.9}
/* families/data-table/family.css */
.dt-sort.is-focus{outline:2px solid hsl(var(--ring));outline-offset:0}
/* families/data-table/family.css */
.dt-sort[disabled]{pointer-events:none}
/* families/data-table/family.css */
.dt-sort .i-up, .dt-sort .i-dn{display:none}