.card { display: flex; flex-direction: column; justify-content: center; min-width: 140px; } .value { font-size: var(--font-size-2xl); line-height: 40px; min-height: 40px; font-weight: 600; white-space: nowrap; } .label { white-space: nowrap; display: flex; align-items: center; gap: 5px; } .change { font-size: 12px; padding: 0 5px; border-radius: 5px; margin-left: 4px; border: 1px solid var(--base200); color: var(--base500); } .change.positive { color: var(--green500); } .change.negative { color: var(--red500); } .change.plusSign::before { content: '+'; }