/* Compact dashboard chrome only. Keep the original SVG drawing height and fonts. */
.test-grid .market-card {
  container-type: inline-size;
  aspect-ratio: auto;
}
.test-grid .card-content {
  --card-trim: min(6.5cqw, 20px);
  /* Original outer width / .92, less the two border pixels and compact spacing. */
  height: calc(108.695652cqw + .173913px - var(--card-trim));
  padding-bottom: calc(5px - var(--card-trim) * .25);
}
.test-grid .card-titlebar {
  min-height: calc(29px - var(--card-trim) * .4);
  padding-block: calc(4px - var(--card-trim) * .15);
}
.test-grid .card-change {
  padding-top: calc(4px - var(--card-trim) * .2);
}
.test-grid .card-quote {
  padding-top: calc(3px - var(--card-trim) * .15);
}
/* Stretch the add/drop tile to the same row, without changing its controls. */
.test-grid > .add-chart-card,
.test-grid > .layout-drop-placeholder {
  /* Retain a full tile even when the trailing add button occupies its own row. */
  aspect-ratio: .978724 / 1;
  align-self: stretch;
  min-height: 150px;
}
/* Preserve the existing layout on engines without container width units. */
@supports not (height: 1cqw) {
  .test-grid > .add-chart-card,
  .test-grid > .layout-drop-placeholder { aspect-ratio: .92 / 1; }
  .test-grid .market-card { aspect-ratio: .92 / 1; }
  .test-grid .card-content { height: 100%; padding-bottom: 5px; }
  .test-grid .card-titlebar { min-height: 29px; padding-block: 4px; }
  .test-grid .card-change { padding-top: 4px; }
  .test-grid .card-quote { padding-top: 3px; }
}

/* Reserve the same content box before data and while off-screen. */
.test-grid > .initial-loading-card {
  container-type: inline-size;
  aspect-ratio: auto;
  min-height: 0;
}
.test-grid .market-card {
  contain-intrinsic-size: auto var(--reserved-card-height, 220px);
}
@supports not (height: 1cqw) {
  .test-grid > .initial-loading-card { aspect-ratio: .92 / 1; }
}