.ason-filter { --ason-filter-accent: #4f63e0; --ason-filter-muted: #6b7280; --ason-filter-bg: #fff; position: relative; font-size: 15px; }
.ason-filter__title { font-size: 1.1em; margin: 0 0 .5em; }
.ason-filter__status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ason-filter__toggle, .ason-filter__backdrop, .ason-filter__drawer-head, .ason-filter__show { display: none; }
.ason-filter__group { padding: 10px 0; }
.ason-filter__group + .ason-filter__group { border-top: 1px solid rgba(0,0,0,.08); }
.ason-filter__head { all: unset; box-sizing: border-box; display: flex; width: 100%; justify-content: space-between; align-items: center; cursor: pointer; font-weight: 600; padding: 4px 0; }
.ason-filter__head::after { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-right: 4px; transition: transform .15s; }
.ason-filter__head[aria-expanded="false"]::after { transform: rotate(-45deg); }
.ason-filter__head:focus-visible, .ason-filter label:focus-within, .ason-filter button:focus-visible { outline: 2px solid var(--ason-filter-accent); outline-offset: 2px; }
.ason-filter__list { list-style: none; margin: 6px 0 0; padding: 0; }
.ason-filter__list.is-inline { display: flex; flex-wrap: wrap; gap: 6px; }
.ason-filter__opt { margin: 0; padding: 0; }
.ason-filter__opt.is-child { padding-left: calc(var(--depth, 1) * 16px); }
.ason-filter__opt label { display: flex; align-items: center; gap: 8px; padding: 5px 0; cursor: pointer; min-height: 32px; }
.ason-filter__opt input { margin: 0; accent-color: var(--ason-filter-accent); width: 18px; height: 18px; flex: none; }
.ason-filter__label { flex: 1; }
.ason-filter__count { color: var(--ason-filter-muted); font-size: .85em; font-variant-numeric: tabular-nums; }
.ason-filter__opt.is-empty { opacity: .45; }
.ason-filter__opt.is-empty label { cursor: default; }
.ason-filter__opt.is-chip label, .ason-filter__opt.is-swatch label { border: 1px solid rgba(0,0,0,.15); border-radius: 999px; padding: 4px 12px; min-height: 0; }
.ason-filter__opt.is-chip input, .ason-filter__opt.is-swatch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ason-filter__opt.is-chip label:has(input:checked), .ason-filter__opt.is-swatch label:has(input:checked) { border-color: var(--ason-filter-accent); color: var(--ason-filter-accent); }
.ason-filter__swatch { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0,0,0,.2); }
.ason-filter__price { padding-top: 6px; }
.ason-filter__ranges { position: relative; height: 28px; }
.ason-filter__ranges input[type="range"] { position: absolute; left: 0; right: 0; width: 100%; margin: 0; top: 6px; pointer-events: none; background: none; accent-color: var(--ason-filter-accent); }
.ason-filter__ranges input[type="range"]::-webkit-slider-thumb { pointer-events: auto; }
.ason-filter__ranges input[type="range"]::-moz-range-thumb { pointer-events: auto; }
.ason-filter__nums { display: flex; gap: 8px; }
.ason-filter__nums label { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: .85em; color: var(--ason-filter-muted); }
.ason-filter__nums input { width: 100%; box-sizing: border-box; }
.ason-filter__clear { all: unset; cursor: pointer; color: var(--ason-filter-accent); font-weight: 600; padding: 8px 0; }
.ason-filter.is-loading .ason-filter__groups { opacity: .6; }
.ason-filter .ason-filter__toggle, .ason-filter .ason-filter__show { min-height: 44px; padding: 10px 18px; border: 0; border-radius: 8px; background: var(--ason-filter-accent, #4f63e0); color: #fff; font: inherit; font-weight: 600; cursor: pointer; line-height: 1.2; }
.ason-filter__clear { min-height: 44px; display: inline-flex; align-items: center; }
.ason-filter__none { list-style: none; padding: 24px 0; color: var(--ason-filter-muted); }
.ason-filter-busy { opacity: .5; transition: opacity .15s; pointer-events: none; }
.ason-filter__results { margin-top: 16px; }
.ason-filter-empty { padding: 32px 0; text-align: center; }
.ason-filter-empty__text { margin: 0 0 16px; font-size: 1.05em; }
.ason-filter-empty__reset { min-height: 44px; }
.ason-filter.is-drawer .ason-filter__toggle { display: inline-flex; gap: 4px; position: sticky; bottom: 12px; z-index: 50; }
.ason-filter.is-drawer .ason-filter__panel { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100001; max-height: 85vh; display: flex; flex-direction: column; background: var(--ason-filter-bg); border-radius: 16px 16px 0 0; transform: translateY(100%); visibility: hidden; transition: transform .25s ease, visibility .25s; }
.ason-filter.is-drawer.is-open .ason-filter__panel { transform: translateY(0); visibility: visible; transition: transform .25s ease, visibility 0s; }
.ason-filter.is-drawer .ason-filter__drawer-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid rgba(0,0,0,.08); }
.ason-filter.is-drawer .ason-filter__groups { overflow-y: auto; padding: 0 16px; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.ason-filter.is-drawer .ason-filter__drawer-foot { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(0,0,0,.08); }
.ason-filter.is-drawer .ason-filter__show { display: block; flex: 1; text-align: center; }
.ason-filter__close { all: unset; cursor: pointer; font-size: 26px; line-height: 1; width: 40px; height: 40px; text-align: center; }
.ason-filter.is-drawer .ason-filter__backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 100000; background: rgba(0,0,0,.4); }
body.ason-filter-lock { overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
	.ason-filter *, .ason-filter.is-drawer .ason-filter__panel { transition: none !important; }
}
