#quick-filters{background-color:var(--color-surface-warm);border:1px solid var(--color-warning-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);margin:0.25rem 1rem 0.75rem;padding:1rem}
#quick-filters p{font-size:0.9375rem;font-weight:800;line-height:1.3;margin-bottom:0.75rem}
#quick-filters div{display:flex;gap:0.5rem;margin:0 -1rem -0.25rem;overflow-x:auto;padding:0 1rem 0.25rem;scroll-snap-type:x proximity}
#quick-filters a{align-items:center;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);box-shadow:var(--shadow-xs);color:var(--color-text-main);display:inline-flex;flex-shrink:0;font-size:0.8125rem;font-weight:700;gap:0.25rem;line-height:1;min-height:2.5rem;padding:0.625rem 0.875rem;scroll-snap-align:start;transition:background-color 0.15s,border-color 0.15s,color 0.15s,transform 0.15s;white-space:nowrap}
#quick-filters a:focus-visible{outline:var(--focus-ring);outline-offset:2px}
#quick-filters a:active{transform:scale(0.97)}
#quick-filters .material-symbols-outlined{color:var(--color-primary);font-size:16px}
@media (hover: hover){
#quick-filters a:hover{background-color:var(--color-primary-bg-soft);border-color:var(--color-primary-border-strong);color:var(--color-primary-dark);transform:translateY(-1px)}
}
@media (min-width: 768px){
#quick-filters{align-items:center;display:flex;gap:1rem;margin:0 0 1.25rem}
#quick-filters p{margin-bottom:0;white-space:nowrap}
#quick-filters div{flex-wrap:wrap;gap:0.625rem;margin:0;overflow:visible;padding:0}
}