/* === Category system (append to assets/style.css) === */
.cat-bar { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1rem 0 1.4rem; }
.cat-chip {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .35rem .8rem; border-radius: 99px;
  background: var(--card); border: 1px solid var(--line);
  color: var(--ink); font-size: .88rem;
}
.cat-chip:hover { border-color: var(--marine); text-decoration: none; }
.cat-chip.active { background: var(--marine); border-color: var(--marine); color: #fff; }
.cat-chip .cnt {
  background: rgba(0,0,0,.12); border-radius: 99px;
  padding: 0 .45rem; font-size: .75rem;
}
.cat-chip.active .cnt { background: rgba(255,255,255,.25); }
.cat-tag { color: var(--marine-d); font-weight: 600; }
select {
  width: 100%; padding: .55rem .7rem; border: 1px solid var(--line);
  border-radius: 8px; font: inherit; background: #fff;
}
select:focus { outline: 2px solid var(--marine); outline-offset: 1px; border-color: var(--marine); }