interface StatCardProps {
  number: string;
  label: string;
  className?: string;
}

export function StatCard({ number, label, className = '' }: StatCardProps) {
  return (
    <div
      className={className}
      style={{
        borderTop: '2px solid var(--ink)',
        paddingTop: '16px',
      }}
    >
      <div
        style={{
          fontSize: 'clamp(32px, 4vw, 44px)',
          fontWeight: 900,
          color: 'var(--ink)',
          lineHeight: 1,
          fontVariantNumeric: 'tabular-nums',
        }}
      >
        {number}
      </div>
      <div
        style={{
          fontSize: '11px',
          color: 'var(--ink-5)',
          marginTop: '4px',
          lineHeight: 1.4,
        }}
      >
        {label}
      </div>
    </div>
  );
}