/* Responsive datasette-vega chart on the data tables (paired with vega_responsive.js, which makes the SVG
   scale to its box). datasette-vega has no size option and renders a fixed-width, inline-block widget, so
   we size its container instead. Mobile-first: the chart panel fills the content width (so it never
   overflows a phone); on wider screens it takes about half the page. */
.datasette-vega {
  display: block;
  width: 100%;
  box-sizing: border-box;
}
.datasette-vega .vega-embed {
  display: block;
  width: 100%;
}
@media (min-width: 900px) {
  .datasette-vega {
    width: 52%;          /* ~half the page on desktop */
    min-width: 22rem;    /* but never so narrow the form controls get cramped */
  }
}
