encore

styles.css

@@ -960,10 +960,10 @@ h1, h2, h3, p, .markdown {
     padding: 30px 20px !important;
 }
 
-/* Historical view plot styling - increase text sizes */
+/* Historical view plot styling - increase all text sizes */
 .historical-view .plot-container svg text,
 .time-series-detail-view .plot-container svg text {
-    font-size: 16px !important;
+    font-size: 18px !important;
 }
 
 /* Historical view title styling */
@@ -971,22 +971,94 @@ h1, h2, h3, p, .markdown {
 .time-series-detail-view .plot-container svg text[class*="title"],
 .historical-view .plot-container svg g[class*="title"] text,
 .time-series-detail-view .plot-container svg g[class*="title"] text {
-    font-size: 20px !important;
+    font-size: 22px !important;
     font-weight: 600 !important;
 }
 
-/* Historical view axis labels */
+/* Historical view axis titles (x-axis and y-axis labels) */
+.historical-view .plot-container svg g[class*="xtitle"] text,
+.historical-view .plot-container svg g[class*="ytitle"] text,
+.time-series-detail-view .plot-container svg g[class*="xtitle"] text,
+.time-series-detail-view .plot-container svg g[class*="ytitle"] text,
+.historical-view .plot-container svg .xtitle text,
+.historical-view .plot-container svg .ytitle text,
+.time-series-detail-view .plot-container svg .xtitle text,
+.time-series-detail-view .plot-container svg .ytitle text {
+    font-size: 18px !important;
+    font-weight: 500 !important;
+}
+
+/* Historical view axis tick labels */
 .historical-view .plot-container svg g[class*="axis"] text,
-.time-series-detail-view .plot-container svg g[class*="axis"] text {
-    font-size: 15px !important;
+.time-series-detail-view .plot-container svg g[class*="axis"] text,
+.historical-view .plot-container svg .xaxis text,
+.historical-view .plot-container svg .yaxis text,
+.time-series-detail-view .plot-container svg .xaxis text,
+.time-series-detail-view .plot-container svg .yaxis text {
+    font-size: 16px !important;
 }
 
-/* Historical view legend styling */
+/* Historical view legend styling - make it much larger */
 .historical-view .plot-container svg g[class*="legend"] text,
-.time-series-detail-view .plot-container svg g[class*="legend"] text {
+.time-series-detail-view .plot-container svg g[class*="legend"] text,
+.historical-view .plot-container svg .legend text,
+.time-series-detail-view .plot-container svg .legend text,
+.historical-view .plot-container svg g.legend text,
+.time-series-detail-view .plot-container svg g.legend text,
+.historical-view .plot-container svg text.legend,
+.time-series-detail-view .plot-container svg text.legend {
+    font-size: 18px !important;
+    font-weight: 500 !important;
+}
+
+/* Target all plotly/gradio plot text elements */
+.historical-view .plot-container .js-plotly-plot text,
+.time-series-detail-view .plot-container .js-plotly-plot text {
+    font-size: 16px !important;
+}
+
+.historical-view .plot-container .js-plotly-plot .legendtext,
+.time-series-detail-view .plot-container .js-plotly-plot .legendtext {
+    font-size: 18px !important;
+}
+
+/* Target Altair/Vega-Lite charts used by Gradio */
+.historical-view .vega-embed text,
+.time-series-detail-view .vega-embed text,
+.historical-view .mark-text text,
+.time-series-detail-view .mark-text text {
+    font-size: 18px !important;
+}
+
+/* Vega-Lite legend text */
+.historical-view .vega-embed .role-legend-label,
+.time-series-detail-view .vega-embed .role-legend-label,
+.historical-view .vega-embed g[aria-label*="legend"] text,
+.time-series-detail-view .vega-embed g[aria-label*="legend"] text {
+    font-size: 18px !important;
+    font-weight: 500 !important;
+}
+
+/* Vega-Lite axis titles */
+.historical-view .vega-embed .role-axis-title,
+.time-series-detail-view .vega-embed .role-axis-title {
+    font-size: 18px !important;
+    font-weight: 500 !important;
+}
+
+/* Vega-Lite axis labels */
+.historical-view .vega-embed .role-axis-label,
+.time-series-detail-view .vega-embed .role-axis-label {
     font-size: 16px !important;
 }
 
+/* Vega-Lite chart title */
+.historical-view .vega-embed .role-title,
+.time-series-detail-view .vega-embed .role-title {
+    font-size: 22px !important;
+    font-weight: 600 !important;
+}
+
 /* Back button styling */
 .back-button {
     background: linear-gradient(135deg, #2a2a2a, #1e1e1e) !important;