/* HOM-121: Filters panel. Side panel on desktop, bottom sheet on phones. */
.filters-dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(480px,100%);max-width:none;height:100dvh;max-height:none;padding:0;border:0;border-left:1px solid var(--line);background:var(--surface);color:var(--ink);display:none;flex-direction:column}
.filters-dialog[open]{display:flex}
.filters-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 16px 8px 20px}
.filters-head h2{font-size:var(--fs-lg,20px);margin:0}
.filters-head .close-button{position:static}
.filters-tabs{display:flex;gap:4px;padding:0 16px 0 20px;border-bottom:1px solid var(--line)}
.filters-tabs [role=tab]{font:inherit;font-size:var(--fs-sm);color:var(--muted);background:none;border:0;border-bottom:2px solid transparent;padding:10px 10px 9px;min-height:44px;cursor:pointer}
.filters-tabs [role=tab][aria-selected=true]{color:var(--ink);border-bottom-color:var(--accent);font-weight:650}
.filters-tabs [role=tab]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.filters-tab-count{color:var(--accent-text,var(--accent));font-weight:650}
.filters-body{flex:1;overflow-y:auto;padding:12px 20px 20px;overscroll-behavior:contain}
.filters-pane>details{border:0;margin:0;background:none}
.filters-pane>details>summary{display:none}
.filters-pane .fx-index-body{border-top:0;padding:0}
.filters-pane .tech-browse-controls>label:first-child{max-width:none;flex-basis:100%}
.filters-pane>.advanced{display:grid;grid-template-columns:1fr;gap:12px;margin:0;padding:0;border:0}
.filters-pane>.advanced label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-sm);color:var(--muted)}
.filters-pane>.advanced .checkbox-label{flex-direction:row;align-items:center;gap:8px;color:var(--ink-2);min-height:44px}
.filters-foot{display:flex;justify-content:space-between;gap:12px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}
.filters-foot .button{min-height:44px;justify-content:center}
.filters-foot [data-filters-show]{flex:1}
.filters-badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:12px;font-weight:700}
.filters-badge[hidden]{display:none}
#more-filter .icon{width:16px;height:16px}
.reset-filters,.filters-foot [data-reset]{color:var(--reset);background:var(--reset-soft);border-color:var(--reset-line);font-weight:650}
.reset-filters:hover,.filters-foot [data-reset]:hover{color:var(--reset);background:var(--reset-soft);border-color:var(--reset)}
.reset-filters:focus-visible,.filters-foot [data-reset]:focus-visible{outline:2px solid var(--reset);outline-offset:2px}
@media(max-width:640px){
 .filters-dialog{inset:auto 0 0 0;width:100%;height:min(88dvh,760px);border-left:0;border-top:1px solid var(--line);border-radius:16px 16px 0 0}
 .filters-head{padding:14px 12px 6px 16px}
 .filters-tabs{padding:0 12px}
 .filters-body{padding:12px 16px 16px}
 .filters-foot{padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
}
.filters-dialog[open]{animation:filters-in-side .18s ease-out}
@keyframes filters-in-side{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
@keyframes filters-in-up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
@media(max-width:640px){.filters-dialog[open]{animation-name:filters-in-up}}
@media(prefers-reduced-motion:reduce){.filters-dialog[open]{animation:none}}
#results-section>.active-filters{margin:4px 0 12px}
