/* Regional statistics reuse the site's cards, typography, tables and palette. */
.regional-statistics { min-width: 0; }
.regional-statistics .ui-card, .regional-statistics .ui-card-body { min-width: 0; }
.regional-table-scroll { max-width: 100%; overflow-x: auto; }
.regional-table-scroll .ui-table { min-width: 32rem; }
.regional-statistics .ui-table td { overflow-wrap: anywhere; }
.regional-distribution-scroll { max-height: 28rem; overflow: auto; }
.regional-methodology { display: grid; gap: .85rem; }
/* One native disclosure per month: vertical columns, keyboard support, no chart JS. */
.regional-chart-scroll { max-width: 100%; overflow-x: auto; }
.regional-chart { position: relative; display: grid; grid-template-columns: repeat(var(--month-count, 12), minmax(42px, 1fr)); gap: .65rem; min-width: 660px; padding-top: 4rem; }
.regional-chart-month summary { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; padding: .25rem; cursor: pointer; text-align: center; font-size: .72rem; list-style: none; }
.regional-chart-month summary::-webkit-details-marker { display: none; }
.regional-chart-month summary:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.regional-chart-count { min-height: 1.2rem; white-space: nowrap; }
.regional-chart-tracks { display: flex; align-items: flex-end; justify-content: center; gap: .2rem; height: 170px; border-bottom: 1px solid var(--line); }
.regional-chart-bar { display: block; flex: 1; max-width: 1.2rem; height: var(--bar-height); background: var(--link); border-radius: .15rem .15rem 0 0; }
.regional-chart-month p { position: absolute; top: 0; left: 0; right: 0; padding: .6rem; border: 1px solid var(--line); border-radius: .4rem; background: var(--surface); }
.regional-chart-month[open] summary { background: var(--surface); border-radius: .4rem; }
@media (max-width: 640px) {
    .regional-chart { min-width: 0; grid-template-columns: repeat(var(--month-count, 12), minmax(0, 1fr)); gap: .25rem; padding-top: 5rem; }
    .regional-chart-month summary { padding: 0; font-size: .6rem; }
    .regional-chart-count { display: none; }
    .regional-chart-tracks { gap: 1px; }
    .regional-chart-month p { font-size: .75rem; }
}