Full month: August 2026 (Monday start), today marked on the 12th — filled navy circle, aria-current="date" and a screen-reader-only "(today)" suffix, never colour alone. Out-of-month days are muted and their date numbers carry a screen-reader-only month suffix. Saturday the 15th shows the .calendar-display-more "+2 more" overflow link (a link to the day's list view — no popup). "Previous" is a real disabled button (range edge); "Next" is a real link to the September calendar below.

Empty month: September 2026 with no events — the grid renders normally (5 week rows here; the row count is markup-driven, never padded to 6), the legend is omitted because there is nothing to key, and a short note under the table tells the parent why it's quiet. "Next" is the disabled range edge; "Previous" links back up to August. This scenario deliberately does not compose .empty-state: the grid isn't empty — every day cell still renders, still shows its date, and is still browsable — so a centred icon + title + action block would cover working content to announce the absence of a subset of it. .empty-state belongs on the Events list view, where the region really is empty.

Compact: the same August markup inside a ~340px column. The collapse is a container query on .calendar-display (threshold 560px), so it also fires when the calendar sits in a narrow column beside a filter rail at desktop widths — and on any small viewport. Weekday headers drop to single letters (full names stay for screen readers), and each day's chips are replaced by category dots + a visible count backed by a screen-reader-only breakdown ("2 events: 1 deadline, 1 open day"). The hidden chip links leave the tab order entirely — no sub-24px targets on small screens.