.browse { display: grid; grid-template-columns: 260px 1fr; gap: var(--space-12); padding-block: var(--space-8) var(--space-12); align-items: start; }
.browse-filters { position: sticky; top: calc(var(--nav-h) + 24px); display: grid; gap: var(--space-6); }
.filter-group { display: grid; gap: 10px; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-input { width: 100%; height: 40px; padding: 0 12px; border-radius: var(--radius-sm); background: var(--ink-1); border: 0; box-shadow: inset 0 0 0 1px var(--line); color: var(--paper); outline: 0; }
.filter-input:focus { box-shadow: inset 0 0 0 1px var(--paper-2); }
select.filter-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23999' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
.browse-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-6); flex-wrap: wrap; }
.browse-title { font-size: var(--text-xl); }
.browse-count { color: var(--paper-3); font-weight: 400; font-size: 0.5em; vertical-align: middle; margin-left: 6px; }
.browse-sort select { background: var(--ink-1); border: 0; color: var(--paper); padding: 8px 10px; border-radius: var(--radius-sm); box-shadow: inset 0 0 0 1px var(--line); }
.browse-more { display: flex; justify-content: center; padding-top: var(--space-8); }

.rows { border-top: 1px solid var(--line); }
.rows-month { padding: 28px 0 10px; }
.rows-empty { padding: var(--space-12) 0; display: grid; gap: 8px; }
.row a { display: grid; grid-template-columns: 64px 1.6fr 1fr auto 24px; gap: var(--space-6); align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); transition: background var(--dur-fast); margin-inline: -12px; padding-inline: 12px; border-radius: var(--radius-sm); }
.row a:hover { background: var(--ink-1); }
.row-date { display: grid; justify-items: center; font-family: var(--font-mono); line-height: 1.05; padding: 8px 0; background: var(--ink-1); border-radius: var(--radius-sm); }
.row a:hover .row-date { background: var(--ink-2); }
.row-date b { font-size: 1.35rem; font-weight: 500; }
.row-date span { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--paper-2); }
.row-date small { font-size: 10px; color: var(--paper-3); margin-top: 2px; }
.row-title { font-size: 1.1rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }
.row-venue { color: var(--paper-3); font-size: var(--text-sm); margin-top: 3px; }
.row-tags { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--text-xs); color: var(--paper-2); }
.row-price { text-align: right; display: grid; }
.row-price b { font-size: 1.15rem; font-weight: 600; letter-spacing: -0.02em; }
.row.is-soldout .row-price b { color: var(--paper-3); }
.row-arrow { color: var(--paper-3); transition: transform var(--dur-fast), color var(--dur-fast); }
.row a:hover .row-arrow { transform: translateX(4px); color: var(--signal); }
@media (max-width: 960px) {
  .browse { grid-template-columns: 1fr; gap: var(--space-6); }
  .browse-filters { position: static; }
  .row a { grid-template-columns: 56px 1fr auto; }
  .row-tags, .row-arrow { display: none; }
}

.view-toggle { display: inline-flex; gap: 4px; margin-left: auto; }
.browse-map { position: relative; height: calc(100dvh - var(--nav-h) - 160px); min-height: 460px; border-radius: var(--radius-lg); overflow: hidden; box-shadow: inset 0 0 0 1px var(--line); }
.browse-map::after { content: attr(data-placed); position: absolute; left: 12px; top: 12px; z-index: 500; padding: 6px 10px; border-radius: 999px; background: color-mix(in oklab, var(--ink-0) 80%, transparent); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--paper-2); pointer-events: none; }
.map-pop .eyebrow { margin-bottom: 8px; }
.map-pop ul { display: grid; gap: 2px; }
.map-pop li a { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--line); color: var(--paper-2); font-size: 13px; }
.map-pop li a:hover { color: var(--paper); }
.map-pop li b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--paper); }
