.event-browser{flex-direction:column;gap:1rem;display:flex}.event-browser__toolbar{flex-direction:column;gap:.75rem;display:flex}@media (min-width:768px){.event-browser__toolbar{flex-direction:row;justify-content:space-between;align-items:center}}.event-browser__search{flex:1;max-width:480px}.event-browser__input{border:1.5px solid var(--color-border);background:var(--color-surface);border-radius:999px;width:100%;min-height:48px;padding:0 1rem}.event-browser__input:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.event-browser__input:focus{border-color:var(--color-ink)}.event-browser__layouts{background:var(--color-border);border-radius:999px;align-self:flex-start;padding:.25rem;display:inline-flex}.event-browser__layout{min-height:36px;color:var(--color-muted);background:0 0;border:0;border-radius:999px;padding:0 1rem;font-size:.875rem;font-weight:600}.event-browser__layout:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.event-browser__layout--active{background:var(--color-surface);color:var(--color-ink);box-shadow:var(--shadow-sm)}.event-browser__filters{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;grid-auto-flow:column;gap:.75rem;display:grid;overflow-x:auto}.event-browser__filters::-webkit-scrollbar{display:none}.event-browser__filters>*{scroll-snap-align:start}.event-browser__filters{gap:.5rem;margin-inline:-1rem;padding-inline:1rem}@media (min-width:768px){.event-browser__filters{flex-wrap:wrap;margin-inline:0;padding-inline:0;display:flex}}.event-browser__chip{border:1.5px solid var(--color-border);background:var(--color-surface);white-space:nowrap;border-radius:999px;min-height:36px;padding:0 1rem;font-size:.875rem;font-weight:600}.event-browser__chip:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.event-browser__chip:hover{border-color:var(--color-ink)}.event-browser__chip--active{border-color:var(--color-primary);background:var(--color-primary);color:var(--color-on-primary)}.event-browser__chip--active:hover{border-color:var(--color-primary-hover)}.event-browser__count{color:var(--color-muted);font-size:.875rem}.event-browser__list{gap:.75rem;display:grid}
