/* ============================================================
   components/area-summary.css
   エリア概況ボックス（施設一覧・都道府県・市区町村ページ共通）
   ============================================================ */

.area-summary {
  margin: 0 0 var(--space-5);
  padding: var(--space-4) var(--space-5);
  background: var(--bg-soft);
  border-radius: var(--radius);
}
.area-summary__label {
  font-size: var(--font-sm);
  color: var(--text-mid);
  margin-bottom: var(--space-2);
}
.area-summary__stats {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-5);
  font-size: var(--font-base);
  color: var(--text-mid);
}
.area-summary__stats strong {
  color: var(--text);
  font-weight: 700;
  margin: 0 2px;
}
@media (max-width: 768px) {
  .area-summary { padding: var(--space-3) var(--space-4); }
  .area-summary__stats { gap: var(--space-1) var(--space-3); font-size: var(--font-sm); }
}