.color-filter-field { min-width: 0; }
.color-filter-label { display: block; font-size: 14px; margin-bottom: 5px; }
.color-filter { position: relative; }
.color-filter > summary { display: flex; justify-content: space-between; gap: 12px; padding: 11px; min-height: 44px; box-sizing: border-box; border: 1px solid var(--line, #435463); border-radius: 6px; list-style: none; }
.color-filter > summary::-webkit-details-marker { display: none; }
.color-filter > summary:focus-visible { outline: 2px solid #bdd9ee; outline-offset: 2px; }
.color-filter-menu { position: absolute; top: calc(100% + 5px); left: 0; right: 0; z-index: 20; padding: 10px; background: #17232c; border: 1px solid #435463; border-radius: 6px; box-shadow: 0 8px 24px #0005; max-height: 320px; overflow-y: auto; }
.color-filter-menu fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.color-filter-legend { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
.color-filter-menu label { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0; padding: 0 6px; cursor: pointer; }
.color-filter-menu label:hover { background: #253746; border-radius: 4px; }
.color-filter-menu input[type=checkbox] { width: 18px; height: 18px; margin: 0; flex-shrink: 0; }
.color-filter-menu button { margin-top: 8px; width: 100%; }