/* Tags describe a plan; statuses come from people (Guidelines §10). Colour never carries
   meaning alone: every tag has words. Ink text on colour, always. */
.tag { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; line-height: 1; font-weight: 700;
  padding: 6px 10px; border-radius: var(--radius-pill); background: var(--tint); color: var(--text); white-space: nowrap; }
.tag .icon { width: 14px; height: 14px; vertical-align: 0; }
.tag.t-mari { background: var(--cmu-marigold-light); color: var(--cmu-ink); }
.tag.t-pet  { background: var(--cmu-petal-light); color: var(--cmu-ink); }
.tag.t-lag  { background: var(--cmu-lagoon-light); color: var(--cmu-ink); }
.tag.t-lil  { background: var(--tint); color: var(--text); }
.tag.t-out  { background: transparent; color: var(--text); border: 1px solid var(--line-strong); }
.tag.t-ink  { background: var(--cmu-ink); color: var(--cmu-paper); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; }

.status { display: inline-flex; align-items: center; gap: 8px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-pill); padding: 6px 12px 6px 6px; font-size: 13.5px; font-weight: 600; }
.status i { width: 22px; height: 22px; border-radius: 50%; display: block; background: var(--line-strong); }
.status.s-here i { background: var(--cmu-lagoon); }
.status.s-late i { background: var(--cmu-marigold); }
.status.s-cant i { background: var(--cmu-petal); }

/* Counts line: "14 going · 4 solo" */
.counts { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--text); }
.counts .icon { width: 16px; height: 16px; color: var(--text-muted); }
.money-line { font-size: 14px; font-weight: 600; color: var(--success); }