@layer cavalree {
  :where(.c-box) {
    --c-box--background--blend-mode: normal;
    --c-box--background--image: none;
    --c-box--background--position: 50%;
    --c-box--background--position--x: var(--c-box--background--position);
    --c-box--background--position--y: var(--c-box--background--position);
    --c-box--border--size: 0px;
    --c-box--color--border: var(--c--color--border, currentcolor);
    --c-box--color--canvas: var(--c--color--canvas, transparent);
    --c-box--color--text: var(--c--color--text, inherit);
    --c-box--flow: row;
    --c-box--gap: 0px;
    --c-box--gap--column: var(--c-box--gap);
    --c-box--gap--row: var(--c-box--gap);
    --c-box--padding: 0px;
    --c-box--padding--block: var(--c-box--padding);
    --c-box--padding--block--end: var(--c-box--padding--block);
    --c-box--padding--block--start: var(--c-box--padding--block);
    --c-box--padding--inline: var(--c-box--padding);
    --c-box--padding--inline--end: var(--c-box--padding--inline);
    --c-box--padding--inline--start: var(--c-box--padding--inline);
    --c-box--place: normal;
    --c-box--place--block: var(--c-box--place);
    --c-box--place--inline: var(--c-box--place);
    --c-box--size--block--min: 0px;
    --c-box--size--inline--max: none;
  }

  .c-box {
    align-items: var(--c-box--place--block);
    background-blend-mode: var(--c-box--background--blend-mode);
    background-color: var(--c-box--color--canvas);
    background-image: var(--c-box--background--image);
    background-position-x: var(--c-box--background--position--x);
    background-position-y: var(--c-box--background--position--y);
    background-size: cover;
    border-color: var(--c-box--color--border);
    border-width: var(--c-box--border--size);
    color: var(--c-box--color--text);
    column-gap: var(--c-box--gap--column);
    display: grid; /* TODO: and_chr >= 115, chrome >= 115, edge >= 115 */
    display: block grid;
    grid-auto-flow: var(--c-box--flow);
    justify-items: var(--c-box--place--inline);
    min-block-size: var(--c-box--size--block--min);
    padding-block-end: var(--c-box--padding--block--end);
    padding-block-start: var(--c-box--padding--block--start);
    padding-inline-end: var(--c-box--padding--inline--end);
    padding-inline-start: var(--c-box--padding--inline--start);
    row-gap: var(--c-box--gap--row);
  }

  .c-box_item {
    column-gap: inherit;
    display: flex; /* TODO: and_chr >= 115, chrome >= 115, edge >= 115 */
    display: block flex;
    flex-direction: column;
    inline-size: 100%;
    max-inline-size: var(--c-box--size--inline--max);
    row-gap: inherit;
  }
}
