Build it

Line the price up with its unit label on the text baseline

EasyAlignment

The price and the 'per seat' label beside it are aligned at the top of their boxes, so the two lines of text sit at different heights. Centring them makes it look worse in a way nobody can name.

Align .amount and .unit in .price so their TEXT sits on one baseline. The unit's box carries a rule and 22px of padding above its text, so the amount has to drop 24px to meet it.

Hint

Every other cross-axis keyword aligns box edges. Which one aligns something inside the box instead?

Live preview1000×700

Your stylesheet

checked in a real browser, four ways

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="price"><div class="amount">49</div><div class="unit">per seat</div></div>

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #0b0b0f; color: #e8e8ef; font: 16px/1.4 system-ui, -apple-system, sans-serif; }
.price { width: 340px; height: 120px; background: #16161d; display: flex; align-items: flex-start; gap: 10px; font: 20px/24px system-ui, -apple-system, sans-serif; }
.amount { width: 90px; height: 48px; background: #ffd166; color: #0b0b0f; }
.unit { width: 120px; height: 48px; border-top: 2px solid #4a4a58; padding-top: 22px; background: #2a2a36; }