I want to pin evaluation of a CSS custom property to the element it’s defined on

As an example, if I need to know the width of a container element to calculate the width of a deeply nested element:

.container {
  --container-width: 100%; 
}

.container__deeply-nested-element {
  /* what I need is the actual container width to be able to correctly
     calculate the desired width of the nested element...
     but 100% is evaluated here to the element's parent :( */
  width: calc(var(--container-width, 0) / 3); 
}

Update

This is addressed by the cqi unit, which is part of the CSS Containment Module Level 3:

.container {
  container-type: inline-size;
}
.container__deeply-nested-element {
  width: calc(100cqi / 3);
}

You can view a demo on Codepen.