feat: implement automated data scraping and history generation pipeline for PVL reservoir levels

src/components/KpiCards.tsx

@@ -6,8 +6,10 @@ interface KpiData {
   level: number;
   inflow: number;
   outflow: number;
+  outflow: number;
   volume: number;
   fullness: number;
+  storageDiff?: number;
 }
 
 interface Props {
@@ -105,12 +107,12 @@ const KpiCards = ({ data, language, lakeName = 'Lipno 1' }: Props) => {
                 lineHeight: 1.4,
                 cursor: 'pointer'
               }}>
-              {language === 'cs' ? "Odhad vypočítaný z aktuální výšky hladiny (mezi min. a max. kótou)." : "Estimate calculated from current water level (between min and max levels)."}
+              {language === 'cs' ? "Rozdíl mezi aktuální hladinou a hladinou zásobního prostoru (důležité pro jachtaře a rekreaci)." : "Difference between current water level and storage space level (important for sailing and recreation)."}
             </div>
           )}
         </div>
-        <div style={{ fontSize: '2rem', fontWeight: 'bold', lineHeight: 1, marginBottom: '0.5rem' }}>
-          {data.fullness > 0 ? `${data.fullness.toFixed(1)}%` : 'N/A'}
+        <div style={{ fontSize: '2rem', fontWeight: 'bold', lineHeight: 1, marginBottom: '0.5rem', color: data.storageDiff && data.storageDiff < 0 ? 'var(--color-red)' : 'var(--color-cyan)' }}>
+          {data.storageDiff !== undefined && data.storageDiff !== 0 ? (data.storageDiff > 0 ? `+${data.storageDiff.toFixed(2)} m` : `${data.storageDiff.toFixed(2)} m`) : (data.fullness > 0 ? `${data.fullness.toFixed(1)}%` : 'N/A')}
         </div>
         <div style={{ fontSize: '0.85rem', color: 'var(--text-muted)' }}>
           {dict.volume}: {data.volume.toFixed(1)} mil. m³