/* Native radio controls keep finish selection accessible by keyboard and touch. */
.filter-color-selector{min-inline-size:0;margin:21px 0 23px;padding:0;border:0;}
.filter-color-selector legend{display:flex;gap:10px;align-items:baseline;padding:0 0 10px;color:var(--ink,#16343e);font-size:14px;font-weight:700;line-height:1.5;}
.filter-color-current{color:var(--muted,#58676a);font-size:13px;font-weight:400;}
.filter-color-options{display:flex;flex-wrap:wrap;gap:10px;}
.filter-color-option{position:relative;display:block;flex:0 1 auto;min-inline-size:135px;cursor:pointer;}
.filter-color-option input{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0;}
.filter-color-pill{display:flex;min-block-size:48px;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line,#c6cfca);border-radius:7px;background:var(--paper,#fafaf6);color:var(--ink,#16343e);font-size:14px;font-weight:600;line-height:1.4;}
.filter-color-swatch{display:block;flex:0 0 25px;inline-size:25px;block-size:25px;border:1px solid #506068;border-radius:50%;box-shadow:inset 0 0 0 2px #ffffff35;}
.filter-color-swatch-black{background:#171a1c;}
.filter-color-swatch-blue{border-color:#276b95;background:linear-gradient(180deg,#1165b7 0 25%,#b6e8f1 25% 75%,#1165b7 75% 100%);}
.filter-color-state{display:block;flex:0 0 12px;inline-size:12px;block-size:12px;margin-inline-start:auto;border:1px solid var(--muted,#58676a);border-radius:50%;background:transparent;}
.filter-color-option input:checked + .filter-color-pill{border-color:var(--ink,#16343e);background:#edf2ed;box-shadow:inset 0 0 0 1px var(--ink,#16343e);}
.filter-color-option input:checked + .filter-color-pill .filter-color-state{border-color:var(--ink,#16343e);background:var(--ink,#16343e);box-shadow:inset 0 0 0 2px #edf2ed;}
.filter-color-option input:focus-visible + .filter-color-pill{outline:3px solid #4f8390;outline-offset:3px;}
.filter-color-option:hover .filter-color-pill{border-color:var(--ink,#16343e);}
.filter-color-pack-note{margin:9px 0 0;color:var(--muted,#58676a);font-size:12px;line-height:1.55;}
@media(max-width:420px){.filter-color-options{gap:9px;}.filter-color-option{flex:1 1 135px;}.filter-color-pill{padding-inline:11px;font-size:13px;}.filter-color-selector{margin-block:18px 20px;}}
@media(forced-colors:active){.filter-color-option input:checked + .filter-color-pill{outline:2px solid Highlight;outline-offset:1px;}.filter-color-state{border-color:CanvasText;}.filter-color-option input:checked + .filter-color-pill .filter-color-state{background:Highlight;box-shadow:none;}}