Improve layout of data on SK admin bar on smaller viewports

## Bug Description

The layout of the admin toolbar on smaller viewports like mobile could be improved.

As you can see from the screenshot, the data is in one column.

I tested this on a few different smaller viewports and the same issue occurs. I am sure we used to have this data in two columns, but could be wrong.

## Steps to reproduce

1. Go to the front end of a website
2. Switch to a mobile viewport, ie. iPhone 14 Pro Max.
3. Click on the Google logo.
4. Observe the issue highlighted.

---------------

_Do not alter or remove anything below. The following sections will be managed by moderators only._

## Acceptance criteria

* On mobile and other small viewports, the Site Kit admin bar menu shows its data blocks in two columns, instead of a single column.
* A title too long for one line wraps within its column, without being cut off or overlapping the next column.
* The two blocks in a row keep their values aligned, even when their titles take a different number of lines.
* On tablet and desktop viewports, the Site Kit admin bar menu layout is unchanged.

## Implementation Brief

* [ ] Update `assets/js/components/adminbar/AdminBarWidgets.js`
* Add `smSize={ 2 }` to the four data-block cells, the ones holding `AdminBarImpressionsWidget`, `AdminBarClicksWidget`, `AdminBarUniqueVisitorsGA4Widget`, and `AdminBarSessionsGA4Widget`, for a `.mdc-layout-grid__cell--span-2-phone` cell on each.
* [ ] Update `assets/sass/components/adminbar/_googlesitekit-adminbar-overrides.scss`
* Inside `.googlesitekit-adminbar`, add a `.mdc-layout-grid__cell--span-2-phone` rule with an `@extend` of the Material class of the same name, beside the `.mdc-layout-grid__cell--span-2-tablet` entry.
* [ ] Update `assets/sass/components/adminbar/_googlesitekit-adminbar.scss`
* Inside `.googlesitekit-plugin .googlesitekit-adminbar`, add a phone-only block with `@include mdc-layout-grid-media-query_("phone")`:
* Separate the two phone rows with the data block's own `padding-top: 12px`, matching the [WordPress Dashboard](https://github.com/google/site-kit-wp/blob/867e11124d298a2ae5f9e35f925e8f9986a61b90/assets/sass/components/global/_googlesitekit-data-block.scss#L30-L32), and `row-gap: 0` on the row of half-width cells.
* Align the row's two values: make the half-width cell a flex box, and the data block a `flex: 1` column that fills the cell.
* Keep a long title inside its own column with `overflow-wrap: anywhere` on `.googlesitekit-data-block__title`.

### Test Coverage

* Update `assets/js/components/adminbar/AdminBarWidgets.test.js`
* `AdminBarWidgets` renders **Total Impressions**, **Total Clicks**, **Total Users**, and **Total Sessions** each in a `.mdc-layout-grid__cell--span-2-phone` cell, with Analytics connected.
* `AdminBarWidgets` renders the **Set up Google Analytics** call to action in a cell without `.mdc-layout-grid__cell--span-2-phone`.
* Update `assets/js/components/adminbar/AdminBarWidgets.stories.js`
* Give `Ready` a Backstop `scenario` with `readySelector: '.googlesitekit-data-block'`.
* Update any failing VRT.

## QA Brief

- Visit any post/page on the frontend as a logged-in user with the Site Kit admin bar enabled, then open it on a mobile viewport (e.g. iPhone 14 Pro Max, or resize the browser below 600px).
- Verify: the four Search Console/Analytics stat tiles (Impressions, Clicks, Total Users, Sessions) render in a 2×2 grid (two columns) instead of a single stacked column.
- Verify: with a long/translated title that wraps to two lines, the title wraps within its own column and does not get cut off or overlap the neighboring column.
- Verify: the small percentage-change value under each pair of tiles in a row stays vertically aligned across both columns, even when one tile's title wraps to more lines than the other.
- Verify (regression): on tablet and desktop viewports, the admin bar layout is unchanged from before.
- Verify (regression): with Analytics not connected, the "Set up Google Analytics" CTA still renders full-width (not affected by the two-column change).

## Changelog entry

* Improve layout of data on SK admin bar on smaller viewports.

Start with assets/js/components/adminbar/AdminBarWidgets.js and its tests to locate the four data-block cells and the Analytics CTA. Then inspect the two admin bar Sass files and run assets/js/components/adminbar/AdminBarWidgets.test.js. Done means the four connected-data blocks form a two-column mobile grid with wrapping and aligned values, while the CTA and tablet/desktop layouts remain unchanged; update the story and any failing VRT.

Written by the indexing model from the issue text.