refactor(frontend): complete BEM design system

frontend/src/components/TimeseriesChart.tsx

@@ -39,7 +39,7 @@ export function TimeseriesChart({ data }: Props) {
   return (
     <ResponsiveContainer width="100%" height={chartHeight}>
       <BarChart data={chartData}>
-        <CartesianGrid strokeDasharray="3 3" stroke="#e7ded2" vertical={false} />
+        <CartesianGrid strokeDasharray="3 3" stroke="var(--color-border)" vertical={false} />
         <XAxis
           dataKey="period"
           tickFormatter={(v: string) => {
@@ -47,7 +47,7 @@ export function TimeseriesChart({ data }: Props) {
             return `${d.getDate()}.${String(d.getMonth() + 1).padStart(2, '0')}`;
           }}
           fontSize={12}
-          stroke="#7d7164"
+          stroke="var(--color-text-secondary)"
           tickLine={false}
           axisLine={false}
         />
@@ -56,33 +56,33 @@ export function TimeseriesChart({ data }: Props) {
             v >= 1000 ? `${(v / 1000).toFixed(0)}к` : String(v)
           }
           fontSize={12}
-          stroke="#7d7164"
+          stroke="var(--color-text-secondary)"
           tickLine={false}
           axisLine={false}
         />
         <Tooltip
           formatter={(value: number) => rubFormatter.format(value)}
-          cursor={{ fill: 'rgba(129, 93, 58, 0.08)' }}
+          cursor={{ fill: 'var(--color-chart-cursor)' }}
           contentStyle={{
-            border: '1px solid #e7ded2',
+            border: '1px solid var(--color-border)',
             borderRadius: 8,
-            boxShadow: '0 16px 36px rgba(54, 42, 30, 0.14)',
+            boxShadow: 'var(--shadow-lg)',
           }}
         />
         <Legend />
         <Bar
           dataKey="Расходы"
-          fill="#e85d3f"
+          fill="var(--color-danger)"
           radius={[4, 4, 0, 0]}
         />
         <Bar
           dataKey="Доходы"
-          fill="#0f9f7f"
+          fill="var(--color-success)"
           radius={[4, 4, 0, 0]}
         />
         <Bar
           dataKey="Инвестиции"
-          fill="#d89b17"
+          fill="var(--color-warning)"
           radius={[4, 4, 0, 0]}
         />
       </BarChart>