Container Queries

/* Define a container */
.card {
  container: --my-first-cq / inline-size;
}

/* Query Nearest Container */
@container (width < 40ch) {
	…
}

/* Query Container By Name */
@container --my-first-cq (width < 40ch) {
	…
}

.perfect-bento {
  container: --perfect-bento / size;

  > .bento-layout {
    @container --perfect-bento (orientation: landscape) {
      grid-auto-flow: column;
    }
  }
}

.container-units {
  inline-size: 50cqi;
	block-size: 50cqb;
}