/* KpiHero */
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
@media (max-width: 700px) { .grid { grid-template-columns: 1fr; } }
.card { display: flex; flex-direction: column; gap: var(--space-2); }
.label { font-size: var(--text-xs); font-weight: var(--font-semibold); letter-spacing: var(--tracking-wider); text-transform: uppercase; color: var(--color-text-tertiary); }
.valueRow { display: flex; align-items: baseline; gap: var(--space-3); }
.value { font-size: var(--text-4xl); font-weight: var(--font-bold); color: var(--color-text-primary); letter-spacing: var(--tracking-tight); }
.delta { font-size: var(--text-sm); font-weight: var(--font-medium); }
.sublabel { font-size: var(--text-xs); color: var(--color-text-tertiary); }
.skeleton { height: 48px; width: 120px; border-radius: var(--radius-md); }
