/* R123: dark selected diagonal controls only; light and excluded states unchanged. */
html[data-theme=dark] body #filter-panel .diagonal[aria-pressed=true],
html[data-theme=dark] body #filter-panel .diagonal[aria-pressed=true]:hover,
html[data-theme=dark] body #filter-panel #cluster-buttons button[aria-pressed=true],
html[data-theme=dark] body #filter-panel #cluster-buttons button[aria-pressed=true]:hover{background:#000;color:#fff;border-color:#fff;box-shadow:none}
html[data-theme=dark] body #filter-panel .diagonal[aria-pressed=true]:focus-visible,
html[data-theme=dark] body #filter-panel #cluster-buttons button[aria-pressed=true]:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* R124: selected outlines reuse each group's existing highlight token. */
html[data-theme=dark] body #filter-panel .diagonal[aria-pressed=true],
html[data-theme=dark] body #filter-panel .diagonal[aria-pressed=true]:hover{border-color:var(--group-blue)}
html[data-theme=dark] body #filter-panel #cluster-buttons button[aria-pressed=true],
html[data-theme=dark] body #filter-panel #cluster-buttons button[aria-pressed=true]:hover{border-color:var(--genre-highlight)}