@layer components{:where(.page-programs,.page-events) .filters{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:2.5rem;display:flex}:where(.page-programs,.page-events) .filter{border:1px solid var(--ink-200);background:var(--canvas-white);min-height:44px;color:var(--ink-700);letter-spacing:.1em;text-transform:uppercase;border-radius:9999px;padding:0 16px;font-size:12px;font-weight:600;transition:all .2s}:where(.page-programs,.page-events) .filter:hover{border-color:var(--ink-900)}:where(.page-programs,.page-events) .filter[aria-pressed=true]{background:var(--ink-900);border-color:var(--ink-900);color:var(--canvas-white)}:where(.page-programs,.page-events) .filters__count{color:var(--ink-500);margin-left:auto;font-size:13px}:where(.page-programs,.page-events) .filters+.filters{margin-top:.75rem}:where(.page-programs,.page-events) .filters__reset{font:inherit;color:var(--lumina-600);text-underline-offset:3px;background:0 0;border:0;margin-left:.5rem;padding:0;text-decoration:underline}:where(.page-programs,.page-events) .filters__reset:hover{color:var(--lumina-700)}:where(.page-programs,.page-events) .filters__opts{display:contents}@media (width<=640px){:where(.page-programs,.page-events) .filters__opts{scrollbar-width:none;flex:100%;gap:.5rem;margin:0 -1.25rem;padding:0 1.25rem;scroll-padding-inline:1.25rem;display:flex;overflow-x:auto}:where(.page-programs,.page-events) .filters__opts::-webkit-scrollbar{display:none}:where(.page-programs,.page-events) .filters__opts .filter{flex:none}}}
