/* Preserve native controls and type, but reflow the map toolbar when its
   document is narrower than the full app's usual property pane. */
.valtaic-property-spatial-quote { container: preview-map-header / inline-size; }
@container preview-map-header (max-width: 620px) {
  .valtaic-property-spatial-quote .valtaic-data-quote-top {
    grid-template-columns: minmax(0, 1fr) auto;
    row-gap: 12px;
  }
  .valtaic-property-spatial-quote .valtaic-data-quote-id { grid-area: 1 / 1; }
  .valtaic-property-spatial-quote .valtaic-data-quote-read { grid-area: 1 / 2; }
  .valtaic-property-spatial-switch {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    justify-content: center;
    flex-wrap: wrap;
  }
}

/* Demo-only composition: retain native type and all six action rows, but spend
   less height on metadata and spacing than the full working property file. */
.valtaic-property-detail .valtaic-overview {
  --va-overview-gap: .65rem;
  --va-overview-section-pad: .8rem;
  --va-overview-queue-row: 3.4rem;
  --va-overview-queue-floor: calc(2.3rem + .65rem + 3 * var(--va-overview-queue-row));
  min-height: 0;
  flex: 1 0 auto;
  justify-content: space-between;
}
.valtaic-property-detail .valtaic-property-page:has(> .valtaic-overview) { height: 100%; display: flex; flex-direction: column; }
.valtaic-property-detail .valtaic-overview > * { flex-shrink: 0; }
.valtaic-property-detail .valtaic-overview-queues { flex: 0 0 auto; }
.valtaic-property-detail .valtaic-overview[data-compact-sample="true"] {
  --va-overview-queue-floor: calc(2.3rem + .65rem + 2 * var(--va-overview-queue-row));
}
.valtaic-property-detail .valtaic-tile-scroll-pane:has(.valtaic-overview) { padding-bottom: 0; }
/* Statistic selection is outside the public example's bounded interactions. */
.valtaic-property-detail button[aria-label="Choose overview figures"] { display: none; }
.valtaic-property-detail .valtaic-overview-cover {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: start;
  gap: 1rem;
}
.valtaic-property-detail .valtaic-overview-meta {
  display: grid;
  grid-template-columns: auto max-content;
  gap: .4rem .65rem;
  width: auto;
  justify-self: end;
  text-align: right;
}
.valtaic-property-detail .valtaic-overview-meta > div {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  justify-content: normal;
  gap: inherit;
  text-align: right;
}
.valtaic-property-detail .valtaic-overview-meta :is(dt, dd) { white-space: nowrap; }
@container valtaic-overview (max-width: 650px) {
  .valtaic-property-detail .valtaic-overview-sections button { min-height: 2.4rem; padding-block: .4rem; gap: .5rem; }
  .valtaic-property-detail .valtaic-overview-sections__label { flex-basis: 8rem; }
  .valtaic-property-detail .valtaic-overview-sections__state { min-width: 2rem; }
  .valtaic-property-detail .valtaic-overview-sections__summary { display: block; }
  .valtaic-property-detail .valtaic-overview-heading { padding-bottom: .5rem; }
  .valtaic-property-detail .valtaic-overview-stats .valtaic-overview-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
  .valtaic-property-detail .valtaic-overview-strip > div { padding: .45rem .2rem; }
  .valtaic-property-detail .valtaic-overview-queues {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(var(--va-overview-queue-floor), auto);
    min-height: var(--va-overview-queue-floor);
    gap: 0 1rem;
  }
  .valtaic-property-detail .valtaic-overview-queue .valtaic-overview-heading { font-size: .875rem; gap: .35rem; }
  .valtaic-property-detail .valtaic-overview-queue__list button { padding-block: .4rem; }
  .valtaic-property-detail .valtaic-overview-queue + .valtaic-overview-queue { padding-top: 0; border-top: 0; }
}
@container valtaic-overview (max-width: 430px) {
  .valtaic-property-detail .valtaic-overview-cover { grid-template-columns: minmax(0, 1fr); }
  .valtaic-property-detail .valtaic-overview-meta { justify-self: stretch; grid-template-columns: 1fr max-content; }
  .valtaic-property-detail .valtaic-overview-meta dt { text-align: left; }
}