.filter{display:grid;gap:10px;padding:14px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);margin-bottom:18px}.filter__q{display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--bg);border-radius:var(--r-sm);color:var(--ink-3)}.filter__q input,.filter select{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:.9rem;padding:12px 0;color:var(--ink)}.filter select{background:var(--bg);border-radius:var(--r-sm);padding:12px}.filter__q input:focus{outline:none}.filter__genres{display:flex;flex-wrap:wrap;gap:6px}.chip-radio input{position:absolute;opacity:0}.chip-radio span{display:inline-block;font-size:.78rem;padding:5px 13px;border-radius:999px;border:1px solid var(--line-2);cursor:pointer;transition:background .2s,color .2s}.chip-radio input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}.chip-radio input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}.result-count{font-size:.84rem;color:var(--ink-2);margin-bottom:10px}.result-count b{font-size:1.5rem;color:var(--ink);margin-right:2px}@media(min-width:720px){.filter{grid-template-columns:1.4fr 1fr}.filter__genres,.filter .btn{grid-column:1 / -1}.filter .btn{justify-self:start}}
