.kpi-card{gap:var(--spacing-3);padding:var(--spacing-5)var(--spacing-6);background-color:var(--bg-subtle);border:1px solid var(--border-default);border-radius:var(--radius-xl);transition:border-color var(--duration-base)var(--easing-default),box-shadow var(--duration-base)var(--easing-default);flex-direction:column;display:flex;position:relative;overflow:hidden}.kpi-card:hover{border-color:var(--border-subtle);box-shadow:0 0 0 1px var(--border-subtle)}.kpi-card__header{justify-content:space-between;align-items:center;gap:var(--spacing-2);display:flex}.kpi-card__title{font-family:var(--font-family-base);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-widest);color:var(--text-secondary);text-transform:uppercase;margin:0}.kpi-card__trend-badge{align-items:center;gap:var(--spacing-1);padding:2px var(--spacing-2);border-radius:var(--radius-full);font-family:var(--font-family-base);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);white-space:nowrap;display:inline-flex}.kpi-card__trend-badge--up{background-color:color-mix(in srgb,var(--color-success)15%,transparent);color:var(--color-success)}.kpi-card__trend-badge--down{background-color:color-mix(in srgb,var(--color-error)15%,transparent);color:var(--color-error)}.kpi-card__trend-badge--neutral{background-color:color-mix(in srgb,var(--text-secondary)15%,transparent);color:var(--text-secondary)}.kpi-card__trend-icon{flex-shrink:0;width:10px;height:10px}.kpi-card__body{justify-content:space-between;align-items:flex-end;gap:var(--spacing-4);display:flex}.kpi-card__value-wrapper{gap:var(--spacing-1);flex-direction:column;display:flex}.kpi-card__value{font-family:var(--font-family-base);font-size:var(--font-size-kpi);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary);margin:0}.kpi-card__unit{font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);color:var(--text-secondary);margin-left:var(--spacing-1)}.kpi-card__subtitle{font-family:var(--font-family-base);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--text-secondary);margin:0}.kpi-card__sparkline{flex-shrink:0;align-self:flex-end}.kpi-card__sparkline-line{fill:none;stroke:var(--color-primary);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.kpi-card__sparkline-line--up{stroke:var(--color-success)}.kpi-card__sparkline-line--down{stroke:var(--color-error)}.kpi-card__sparkline-area{opacity:.12}.kpi-card__sparkline-area--up{fill:var(--color-success)}.kpi-card__sparkline-area--down{fill:var(--color-error)}.kpi-card__sparkline-area--neutral{fill:var(--color-primary)}.kpi-card:before{content:"";background-color:var(--color-primary);border-radius:var(--radius-sm)0 0 var(--radius-sm);opacity:0;width:3px;height:100%;transition:opacity var(--duration-base)var(--easing-default);position:absolute;top:0;left:0}.kpi-card:hover:before{opacity:1}.kpi-card--accent-success:before{background-color:var(--color-success)}.kpi-card--accent-warning:before{background-color:var(--color-warning)}.kpi-card--accent-error:before{background-color:var(--color-error)}.kpi-card--loading .kpi-card__value,.kpi-card--loading .kpi-card__title,.kpi-card--loading .kpi-card__subtitle{background-color:var(--border-default);color:#0000;border-radius:var(--radius-sm);animation:kpi-card-pulse var(--duration-slow)var(--easing-default)infinite alternate}@keyframes kpi-card-pulse{0%{opacity:.4}to{opacity:.8}}