/* Both lists own their controls. Dynamic search/catalogue nodes never become
   anonymous columns in the desktop grid. Loaded after the visual themes. */
html body #filters-panel .filters-panel__toggle { justify-content:flex-start; flex-wrap:wrap; gap:10px 16px; }
#filters-panel .filters-panel__summary { flex:1; min-width:160px; color:var(--text-color); font-size:12px; font-weight:500; letter-spacing:normal; text-transform:none; }
#filters-panel .filters-panel__action { margin-left:auto; }
#filters-panel .filters-panel__toggle::after { transform:rotate(-135deg); }
#filters-panel.collapsed .filters-panel__toggle::after { transform:rotate(45deg); }
html body #filters-panel #filters-content,
html[data-signal-visual][data-radar-ambient] body #filters-panel #filters-content[data-filter-phase] {
  display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:12px!important; padding:0!important; max-height:none!important;
  position:relative; min-height:0; box-sizing:border-box;
}
html body #filters-panel #filters-content[hidden],
html[data-signal-visual][data-radar-ambient] body #filters-panel #filters-content[data-filter-phase][hidden] { display:none!important; }
#filters-content[data-filter-phase]::before,
#filters-content[data-filter-phase]::after { content:''; position:absolute; inset:0; pointer-events:none; z-index:2; }
#filters-content[data-filter-phase]::before {
  border:1px solid color-mix(in srgb,var(--accent) 50%,transparent); border-radius:14px;
  clip-path:polygon(0 0,22px 0,22px 1px,calc(100% - 22px) 1px,calc(100% - 22px) 0,100% 0,100% 22px,calc(100% - 1px) 22px,calc(100% - 1px) calc(100% - 22px),100% calc(100% - 22px),100% 100%,calc(100% - 22px) 100%,calc(100% - 22px) calc(100% - 1px),22px calc(100% - 1px),22px 100%,0 100%,0 calc(100% - 22px),1px calc(100% - 22px),1px 22px,0 22px);
  opacity:.5;
}
#filters-content[data-filter-phase]::after {
  background:linear-gradient(transparent 48%,color-mix(in srgb,var(--accent) 48%,transparent) 50%,transparent 52%);
  opacity:0;
}
#filters-content[data-filter-phase="opening"]::after { animation:filter-disclosure-scan 380ms ease-out both; }
#filters-content[data-filter-phase="closing"]::after { animation:filter-disclosure-scan 260ms ease-in reverse both; }
#filters-content[data-filter-phase="opening"]::before { animation:filter-disclosure-frame 380ms ease-out both; }
#filters-content[data-filter-phase="closing"]::before { animation:filter-disclosure-frame 260ms ease-in reverse both; }
#filters-content[data-filter-phase="opening"] > .filter-section { animation:filter-disclosure-group-in 380ms ease-out both; }
#filters-content[data-filter-phase="closing"] > .filter-section { animation:filter-disclosure-group-out 260ms ease-in both; }
#filters-content[data-filter-phase="opening"] > .filter-section:last-child { animation-delay:30ms; animation-duration:350ms; }
@keyframes filter-disclosure-scan { from { transform:translateY(-70%); opacity:0; } 25% { opacity:.9; } to { transform:translateY(70%); opacity:0; } }
@keyframes filter-disclosure-frame { from { opacity:0; } 30% { opacity:1; } to { opacity:.5; } }
@keyframes filter-disclosure-group-in { from { opacity:.15; transform:translateY(-7px); } to { opacity:1; transform:translateY(0); } }
@keyframes filter-disclosure-group-out { from { opacity:1; transform:translateY(0); } to { opacity:0; transform:translateY(-5px); } }
#filters-content .filter-catalog-status { grid-column:1/-1; margin:0; padding:0 3px 4px; color:var(--muted); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
#filters-content .filter-section { min-width:0; border:1px solid var(--panel-border); border-radius:16px; background:color-mix(in srgb,var(--panel-color) 94%,var(--accent) 6%); padding:12px; }
#filters-content .filter-section__head { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
#filters-content .filter-section__head h3 { margin:0; font-size:15px; color:var(--text-color); }
#filters-content .filter-section__head span { color:var(--text-color); font-size:12px; font-variant-numeric:tabular-nums; }
#filters-content .runtime-filter-tools { display:flex!important; align-items:center; flex-wrap:wrap; gap:8px; padding:0; margin:0 0 10px; }
#filters-content .runtime-filter-tools label { flex:1 1 100%; min-width:0; }
#filters-content .runtime-filter-tools input { width:100%; height:40px; font-size:14px; }
#filters-content .runtime-filter-summary { flex:1; min-width:140px; white-space:normal; font-size:11px; }
#filters-content .runtime-filter-tools button { min-height:36px; font-size:11px; }
#filters-content .runtime-filter-selected[aria-pressed="true"] { border-color:var(--accent); color:var(--text-color); background:color-mix(in srgb,var(--panel-color) 75%,var(--accent) 25%); }
#filters-content .filter-section__actions { display:flex; flex-wrap:wrap; gap:7px; padding:0 0 10px; }
#filters-content .filter-section__scroll { height:clamp(240px,32vh,360px); min-width:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--accent) transparent; padding:2px 6px 4px 0; }
#filters-content .filter-section .chips { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:7px; padding:0!important; justify-content:stretch; align-content:start; }
#filters-content #pattern-filter-section .chips { grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); }
#filters-content .filter-section .chip { box-sizing:border-box; min-width:0; min-height:36px; margin:0; padding:7px 9px; font-size:12px; font-weight:600; line-height:1.3; font-family:inherit; letter-spacing:normal; text-transform:none; white-space:normal; overflow-wrap:anywhere; justify-content:flex-start; text-align:left; cursor:pointer; }
#filters-content .filter-section button.chip::before { content:none!important; }
#filters-content .filter-section .chip[aria-pressed="true"]::after { content:'✓'; margin-left:auto; color:var(--accent); }
#filters-content .filter-section .chip span { font-size:9px; margin-left:4px; }
#filters-content .filter-section .chip.special { width:auto; font-size:11px; }
#filters-content .filter-section button:focus-visible,
#filters-content .filter-section__scroll:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
#filters-content .filter-section__empty { padding:18px 8px; margin:0; line-height:1.5; color:var(--muted); font-size:13px; }
#filters-content [hidden] { display:none!important; }
@media(max-width:900px) {
  html body #filters-panel:not(.collapsed) #filters-content { grid-template-columns:minmax(0,1fr)!important; }
  #sr-mobile-app .sr-mobile-filter-body { position:relative; }
  #sr-mobile-app .sr-mobile-filter-body #filters-content { display:block!important; padding:0!important; }
  #sr-mobile-app .sr-mobile-filter-body .filter-section { padding:0; border:0; background:transparent; }
  #sr-mobile-app .sr-mobile-filter-body .filter-section__scroll { height:auto; overflow:visible; padding:0; }
  #sr-mobile-app .sr-mobile-filter-body .runtime-filter-tools label { display:none; }
  #sr-mobile-app .sr-mobile-filter-body .runtime-filter-tools { display:flex!important; }
  #sr-mobile-app .sr-mobile-filter-body .runtime-filter-tools button,
  #sr-mobile-app .sr-mobile-filter-body .filter-section .chip { min-height:44px!important; }
  #sr-mobile-app .sr-mobile-filter-body .filter-section .chips,
  #sr-mobile-app .sr-mobile-filter-body #pattern-filter-section .chips { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sr-mobile-app .sr-mobile-filter-body .filter-section .chip { white-space:normal!important; font-size:12px!important; overflow-wrap:anywhere; }
  #sr-mobile-app .sr-mobile-filter-sheet[data-filter-tab="symbols"] #pattern-filter-section,
  #sr-mobile-app .sr-mobile-filter-sheet[data-filter-tab="patterns"] #symbol-filter-section { display:none!important; }
  #sr-mobile-app .filter-catalog-status { font-size:11px; margin-bottom:10px; }
  #sr-mobile-app .sr-mobile-filter-sheet[data-filter-tab="patterns"] .filter-catalog-status { display:none; }
  #sr-mobile-app .sr-mobile-filter-sheet__panel > footer span { min-width:0; overflow-wrap:anywhere; }
}
@media(prefers-reduced-motion:reduce) {
  #filters-panel .filters-panel__toggle::after { transition:none; }
  #filters-content[data-filter-phase]::after,
  #filters-content[data-filter-phase]::before,
  #filters-content[data-filter-phase] > .filter-section { animation:none!important; }
}
