/* =========================================================
   STADIUM DAYLIGHT — Flag images
   Used by Groups (/groups), Match cards, and any future surface
   that renders a country flag via ApplicationHelper#flag_img.
   The design-system reference page (/design-system) carries its
   own inline copy of these rules for sandbox isolation; this is
   the production source of truth.
   ========================================================= */

.flag {
  width: 40px;
  aspect-ratio: 3 / 2;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-soft);
  object-fit: cover;
  flex-shrink: 0;
}

.flag-sm {
  width: 24px;
  aspect-ratio: 3 / 2;
  border-radius: 3px;
  border: 1px solid var(--border-soft);
  object-fit: cover;
  flex-shrink: 0;
}

/* Hero size — team detail page header. */
.flag-hero {
  width: clamp(96px, 18vw, 120px);
  aspect-ratio: 3 / 2;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  object-fit: cover;
  flex-shrink: 0;
}