Improve multi month polls

static/style.css

@@ -209,6 +209,8 @@ textarea { resize: vertical; min-height: 4rem; }
   display: flex;
   align-items: center;
   justify-content: space-between;
+  flex-wrap: wrap;
+  gap: var(--space-1) var(--space-2);
   border-bottom: var(--border-dashed);
   padding-bottom: var(--space-1);
   margin-bottom: var(--space-2);
@@ -223,6 +225,37 @@ textarea { resize: vertical; min-height: 4rem; }
 
 .cal-nav { display: flex; gap: var(--space-2); }
 
+/* Month pills (poll page): one per month that has offered dates */
+.cal-months {
+  display: flex;
+  gap: var(--space-2);
+  flex-wrap: wrap;
+  justify-content: flex-end;
+}
+
+.cal-months .pill {
+  background: none;
+  border: none;
+  color: var(--text-muted);
+  font: inherit;
+  font-size: var(--font-sm);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  cursor: pointer;
+  padding: 0 var(--space-1);
+}
+.cal-months .pill::before { content: "["; color: var(--secondary); }
+.cal-months .pill::after { content: "]"; color: var(--secondary); }
+.cal-months .pill:hover { color: var(--primary-hover); }
+
+.cal-months .pill.active { color: var(--link); font-weight: 700; }
+
+.cal-months .pill .n {
+  font-size: var(--font-xs);
+  margin-left: 0.35em;
+  color: var(--secondary);
+}
+
 .cal-nav button {
   background: none;
   border: none;