.u2-width {
    max-width:var(--width);
    min-width:0;/* needed if used as flexbox-item */
    margin-left:auto;
    margin-right:auto;
    box-sizing:content-box;
    padding-left:1rem;
    padding-right:1rem;
    padding-left:calc(1rem + env(safe-area-inset-left)); /* todo: test, better: max(1rem, env(safe-area-inset-left)) */
    padding-right:calc(1rem + env(safe-area-inset-right));

    /* if used as flexbox-col-item */
    width: 100%;
    width: -webkit-fill-available;
    width: stretch;
}
/* remove padding on nested width-containers */
.u2-width .u2-width {
    padding-inline:0;
}