fix(month-grid, year-grid): stretch to popover content width inside picker

When a MonthGrid / YearGrid is rendered inside a DatePicker.Content
popover (via DatePicker.MonthView / YearView), the grid was using
inline-size:max-content while the picker-shell Footer below it stretched
to the popover's full content width — leaving an empty band to the right
of each row of cells.

Scope the override to `[data-popover-content]` so the standalone grids
on their own demos keep their natural max-content sizing. Inside the
popover, the grid root and the inner [data-*-grid] both stretch to 100%
so the 3 columns (minmax(0, 1fr)) distribute across the same inline
size as the footer.

Also added box-sizing: border-box to both grid roots so the padding +
border don't push them past the popover content area.

Verified at /uix/components/date-picker with kind='year' size='md':
popover content width = 288px, year-grid width = 262px (= footer width),
inner grid = 228px (= grid container minus padding). 3 columns align
flush to the footer row above.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/uix/eidos/components/month-grid/month-grid.css

@@ -16,6 +16,7 @@
 	gap: var(--calendar-gap);
 	inline-size: max-content;
 	max-inline-size: 100%;
+	box-sizing: border-box;
 	padding: var(--_month-grid-padding);
 	border: var(--calendar-border-width) solid var(--calendar-border);
 	border-radius: var(--calendar-radius);
@@ -185,6 +186,16 @@
 	max-inline-size: 100%;
 }
 
+/* When the month-grid sits inside a popover (DatePicker.MonthView), stretch
+   to the popover's content width so the cells distribute across the same
+   inline size as the picker-shell footer. */
+[data-popover-content] [data-month-grid] {
+	inline-size: 100%;
+}
+[data-popover-content] [data-month-grid-grid] {
+	inline-size: 100%;
+}
+
 [data-month-grid-cell] {
 	display: inline-flex;
 	align-items: center;

src/uix/eidos/components/year-grid/year-grid.css

@@ -16,6 +16,7 @@
 	gap: var(--calendar-gap);
 	inline-size: max-content;
 	max-inline-size: 100%;
+	box-sizing: border-box;
 	padding: var(--_year-grid-padding);
 	border: var(--calendar-border-width) solid var(--calendar-border);
 	border-radius: var(--calendar-radius);
@@ -185,6 +186,16 @@
 	max-inline-size: 100%;
 }
 
+/* When the year-grid sits inside a popover (DatePicker.YearView), stretch
+   to the popover's content width so the cells distribute across the same
+   inline size as the picker-shell footer. */
+[data-popover-content] [data-year-grid] {
+	inline-size: 100%;
+}
+[data-popover-content] [data-year-grid-grid] {
+	inline-size: 100%;
+}
+
 [data-year-grid-cell] {
 	display: inline-flex;
 	align-items: center;