.filters-trigger{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:44px;padding:.7rem 1rem;border:1px solid var(--border-color, #d5d5d5);background-color:#f7f7f7;color:#2b2b26;font:inherit;cursor:pointer;flex-shrink:0;transition:background-color .2s ease,border-color .2s ease}.filters-trigger:hover{background:var(--notice-background, #f7f7f7);border-color:currentColor}.filters-trigger svg{width:21px;height:21px;flex-shrink:0}.blog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1.5rem 1rem;padding:1rem 0;border-top:1px solid var(--border-color, #f7f7f7)}.blog-toolbar-label{font-size:1.4rem;color:#f7f7f7}.filters-overlay{position:fixed;inset:0;z-index:1000;visibility:hidden;pointer-events:none;transition:visibility .35s}.filters-overlay.is-open{visibility:visible;pointer-events:auto}.filters-backdrop{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:#00000073;opacity:0;cursor:default;transition:opacity .35s ease}.filters-overlay.is-open .filters-backdrop{opacity:1}.filters-panel{position:absolute;top:0;right:0;display:flex;flex-direction:column;width:100%;height:100%;height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--background-color, #fff);color:var(--text-color, #222);box-shadow:-8px 0 30px #0000001a;transform:translate(100%);transition:transform .35s ease}@media screen and (min-width: 750px){.filters-panel{width:min(420px,100%)}}.filters-overlay.is-open .filters-panel{transform:translate(0)}.filters-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border-color, #d5d5d5)}.filters-header h2{margin:0;font-size:1.25rem;font-weight:600}.filters-close{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;padding:0;border:0;background:transparent;color:inherit;cursor:pointer}.filters-close:hover{background:var(--notice-background, #f7f7f7)}.filters-close svg{width:24px;height:24px}.filters-container{display:grid;align-content:start;gap:1.35rem;padding:1.5rem}.filters-container label{display:grid;justify-items:start;gap:.55rem;font-size:.9rem;font-weight:500}.filters-container span{font-weight:700;font-size:1rem}.filter-select{width:100%;padding:.7rem 2.5rem .7rem .85rem;border-radius:0;background-color:var(--background-color, #fff);color:inherit;font:inherit;font-size:.95rem;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem;transition:border-color .2s ease,box-shadow .2s ease}.filter-select:focus-visible{outline:2px solid var(--accent-color, #f2613f);outline-offset:2px}.filter-select.is-active{border-color:var(--accent-color, #f2613f);box-shadow:inset 0 0 0 2px var(--accent-color, #f2613f)}.filter-select:hover{outline:2px solid var(--accent-color, #f2613f)}.filter-select option:disabled{color:#999}body.filter-panel-open{overflow:hidden}@media (prefers-reduced-motion: reduce){.filters-overlay,.filters-backdrop,.filters-panel,.filters-trigger,.filter-select{transition:none}}.filters-actions{position:sticky;bottom:0;display:flex;flex-direction:column;gap:.75rem;margin-top:auto;padding:1rem 1.5rem;border-top:1px solid var(--border-color, #d5d5d5);background:var(--background-color, #fff)}.filters-actions button{width:100%;min-width:0;min-height:46px;padding:.75rem 1rem;font:inherit;font-weight:500;cursor:pointer;transition:background-color .2s ease,border-color .2s ease}.filters-apply{border:1px solid var(--accent-color, #a2a2a2);background:var(--accent-color, #222222);color:#fff}.filters-apply:hover{filter:brightness(.9)}.filters-clear{border:1px solid var(--border-color, #aeaeae);background:#7e7e7e;color:#fff}.filters-clear:hover{filter:brightness(.95)}.filters-actions button:focus-visible{outline:2px solid var(--accent-color, #f2613f);outline-offset:3px}@media screen and (min-width: 500px){.filters-actions{flex-direction:row}.filters-actions button{flex:1}}
