UI update

app.py

@@ -310,11 +310,11 @@ Answer:"""
         :root {
             --primary-color: #FF8C00; /* Darker Orange for buttons/accents */
             --primary-hover: #E07B00; /* Slightly darker orange for hover */
-            --background-primary: #FFFFFF; /* Pure White for main cards, inputs, output area - NO GREY */
-            --background-secondary: #FFFBF5; /* Very light, warm cream for overall app background, table headers, placeholder */
+            --background-primary: hsl(30, 100%, 99.5%); /* Very bright, almost white, but distinctly warm cream */
+            --background-secondary: hsl(30, 100%, 97%); /* Slightly deeper, yet still very light, warm cream/peach */
             --text-primary: #4A3C32; /* Dark warm brown/charcoal for main text */
             --text-secondary: #8C7B6F; /* Muted warm gray/brown for secondary text */
-            --border-color: #DDC6AF; /* Light, desaturated orange-brown for borders */
+            --border-color: hsl(30, 70%, 88%); /* Light, warm orange-brown for borders */
             --border-focus: #FF8C00; /* Focus color matches primary */
             --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
             --shadow-md: 0 4px 10px rgba(0,0,0,0.1);
@@ -355,12 +355,12 @@ Answer:"""
         }
         /* Ensure all main content sections have primary background */
         .main-dashboard-container > * {
-            background-color: var(--background-primary) !important;
+            /* Background will be set by .dashboard-card-section with a gradient */
         }
 
         /* Header styling - centered and prominent */
         .app-header-wrapper {
-            background-color: var(--background-primary) !important; /* Solid primary background, removed gradient */
+            background: linear-gradient(145deg, var(--background-primary) 0%, var(--background-secondary) 100%) !important; /* Gradient background */
             border: 2px solid var(--border-color) !important;
             border-radius: 16px !important;
             padding: 2.5rem 1.5rem !important; /* More vertical padding */
@@ -378,15 +378,15 @@ Answer:"""
             left: 0;
             width: 100%;
             height: 100%;
-            background: radial-gradient(circle at top left, rgba(255,140,0,0.15) 0%, transparent 50%), /* More vibrant orange tint */
-                        radial-gradient(circle at bottom right, rgba(255,140,0,0.15) 0%, transparent 50%);
+            background: radial-gradient(circle at top left, rgba(255,140,0,0.2) 0%, transparent 60%), /* More vibrant orange tint */
+                        radial-gradient(circle at bottom right, rgba(255,140,0,0.2) 0%, transparent 60%);
             z-index: 0;
             opacity: 0.8;
             pointer-events: none;
         }
 
         .app-header-logo {
-            font-size: 6.5rem !important; /* Significantly larger icon */
+            font-size: 7rem !important; /* Significantly larger icon */
             margin-bottom: 0.75rem !important;
             display: block !important; 
             color: var(--primary-color) !important; /* Theme color */
@@ -433,7 +433,7 @@ Answer:"""
         }
         /* Card sections with clear boundaries and subtle dynamic effects */
         .dashboard-card-section {
-            background-color: var(--background-primary) !important; /* Explicitly set background */
+            background: linear-gradient(145deg, var(--background-primary) 0%, var(--background-secondary) 100%) !important; /* Gentle gradient */
             border: 2px solid var(--border-color) !important; /* Distinct border */
             border-radius: 12px !important;
             padding: 1.75rem !important; /* Consistent padding */