/* Keep foreground and surface paired; no crossfade through low-contrast colours. */
.app-shell .category-chip{background:#eeece7;color:#171614;border-color:transparent;transition:transform 160ms ease}
.app-shell .category-chip:is(.category-chip--active,[aria-selected=true]){background:#171614;color:#fffefa;border-color:transparent}
.app-shell .category-chip :is(span,svg){color:inherit}
:root[data-theme=dark] .app-shell .category-chip{background:#222428;color:#e8e9e6;border-color:#ffffff18}
:root[data-theme=dark] .app-shell .category-chip:is(.category-chip--active,[aria-selected=true]){background:#f0f0ed;color:#151618;border-color:transparent}
@media(hover:hover){
 .app-shell .category-chip:not(.category-chip--active):not([aria-selected=true]):hover{background:#e2dfd8;color:#171614}
 .app-shell .category-chip:is(.category-chip--active,[aria-selected=true]):hover{background:#2b2925;color:#fffefa}
 :root[data-theme=dark] .app-shell .category-chip:not(.category-chip--active):not([aria-selected=true]):hover{background:#303338;color:#fff}
 :root[data-theme=dark] .app-shell .category-chip:is(.category-chip--active,[aria-selected=true]):hover{background:#fff;color:#151618}
}
.app-shell .category-chip:is(.category-chip--active,[aria-selected=true]):active{background:#171614;color:#fffefa}
:root[data-theme=dark] .app-shell .category-chip:is(.category-chip--active,[aria-selected=true]):active{background:#f0f0ed;color:#151618}