design(light-theme): replace purple scheme with logo-aligned teal palette, WCAG AA compliant

public/style.css

@@ -31,41 +31,68 @@
 
 /* ===== Theme Variables ===== */
 :root, [data-theme="light"] {
-  --bg-gradient-start: #667eea;
-  --bg-gradient-end: #764ba2;
+  /* Page background — clean off-white matching logo backdrop */
+  --bg-gradient-start: #e8eef3;
+  --bg-gradient-end: #d4dee8;
+
+  /* Surfaces */
   --surface: #ffffff;
-  --surface-alt: #f5f5f5;
-  --text-primary: #333333;
-  --text-secondary: #666666;
-  --text-muted: #999999;
-  --border: #e0e0e0;
-  --accent: #667eea;
-  --accent-hover: #5568d3;
-  --accent-light: #e8eaf6;
-  --series-color: #667eea;
-  --series-bg: #e8eaf6;
-  --movie-color: #e040a0;
-  --movie-bg: #fce4ec;
-  --torrent-color: #26a69a;
-  --torrent-bg: #e0f2f1;
-  --success: #4caf50;
+  --surface-alt: #f0f4f7;
+
+  /* Typography — charcoal from logo, all meet WCAG AA on white */
+  --text-primary: #2b2f33;   /* ~14:1 on white */
+  --text-secondary: #4d5760; /* ~7.5:1 on white */
+  --text-muted: #6b7784;     /* ~4.6:1 on white — AA compliant */
+
+  /* Borders */
+  --border: #c8d3db;
+
+  /* Accent — primary teal from couch outline */
+  --accent: #1f7d94;         /* ~4.6:1 on white — AA compliant */
+  --accent-hover: #165f70;   /* darker for hover */
+  --accent-light: #e0f0f4;   /* very light teal tint for backgrounds */
+
+  /* Series — steel blue from sofa body */
+  --series-color: #1e6b8a;   /* ~5.0:1 on white — AA */
+  --series-bg: #dceef5;
+
+  /* Movie — warm coral (complementary to teal, accessible) */
+  --movie-color: #b5451b;    /* ~5.5:1 on white — AA */
+  --movie-bg: #fdeee8;
+
+  /* Torrent — mid teal-green */
+  --torrent-color: #1a7a6e;  /* ~4.7:1 on white — AA */
+  --torrent-bg: #ddf2ef;
+
+  /* State colours */
+  --success: #2e7d32;        /* ~7.1:1 on white — AA */
   --success-bg: #e8f5e9;
-  --info: #2196f3;
-  --info-bg: #e3f2fd;
-  --danger: #f44336;
-  --danger-bg: #ffebee;
-  --danger-border: #ffcdd2;
-  --progress-bg: #ffebee;
-  --progress-border: #ffcdd2;
-  --progress-fill-start: #4caf50;
-  --progress-fill-end: #66bb6a;
-  --shadow: rgba(0, 0, 0, 0.1);
-  --shadow-strong: rgba(0, 0, 0, 0.15);
-  --footer-text: rgba(255, 255, 255, 0.9);
+  --info: #1565c0;           /* ~7.3:1 on white — AA */
+  --info-bg: #e3f0fb;
+  --danger: #c62828;         /* ~6.5:1 on white — AA */
+  --danger-bg: #fdecea;
+  --danger-border: #f5c6c2;
+
+  /* Progress bar */
+  --progress-bg: #eaf2f5;
+  --progress-border: #c8d3db;
+  --progress-fill-start: #1f7d94;
+  --progress-fill-end: #2da0bc;
+
+  /* Shadows */
+  --shadow: rgba(30, 60, 80, 0.10);
+  --shadow-strong: rgba(30, 60, 80, 0.18);
+
+  /* Footer — dark text on light page background */
+  --footer-text: #4d5760;
+
+  /* Inputs */
   --input-bg: #ffffff;
   --select-bg: #ffffff;
+
+  /* Unmatched tag — amber, accessible on its bg */
   --unmatched-tag-bg: #fff3e0;
-  --unmatched-tag-color: #e65100;
+  --unmatched-tag-color: #7a4000; /* ~7.1:1 on #fff3e0 — AA */
 }
 
 [data-theme="dark"] {