The box does not grow for you
A fixed-width card with one long word in it. The word runs straight out through the right-hand border and keeps going. No overflow is set, nothing is positioned, and the box just sits there at the width it was given.
A 220px card with a word in it that is wider than 220px. The word runs out through the border and over whatever is next to it. Make the word fit inside the card. The card stays 220px wide — it is one of a row of identical cards — and the type stays 44px, because so does every other card's. You may not hide the overflow. Clipping it is not fitting it.
Hint
The browser had two options — make the box bigger or let the content spill — and it picked spilling. Which of those two did you actually tell it to do?
The fixture — markup and base stylesheet
You cannot change either of these. They are what your selectors have to reach, and they are the same ones the judge renders.
<div class="page"><div class="box"><span class="word">UNBREAKABLE</span></div></div>
*, *::before, *::after { box-sizing: border-box; } html, body { margin: 0; padding: 0; } body { background: #0b0b0f; color: #e8e8ef; font-family: system-ui, -apple-system, sans-serif; } .page { width: 600px; } .box { width: 220px; border: 4px solid #7bdff2; font-size: 44px; font-weight: 700; line-height: 1.1; background: #16161d; }