2 lines of text. 1st line can have max 2 lines. Bottom needs to ALWAYS be on second line, wrapped behind line 1. CSS only solution please

I have this HTML

<div class="link">
   <i class="icon" />
   <div class="text-wrapper">
       <span class="label">Some label which can span at most 2 lines</span>
       <span class="subtext">(optional)</span>
   </div>
</div>

One way of displaying is:

Notice how the label wraps to the second line while the subtext is trailing behind it.

The other way of display is:

Notice how the label here is not long enough to wrap, but the subtext is still on the second line.

Can anyone suggest how I can achieve the above with HTML/CSS only? Feel free to ignore the icon in the solution. I have that already. Thanks in advance.