Branding v3: homepage-canonical palette; green vector logo (white-plate variant was invisible on cream); green favicon/PWA icons; branded loading flash

assets/custom.css

@@ -1,43 +1,56 @@
 /* ============================================================
-   Inference Co-op branding — LibreChat overlay (v2, DOM-verified)
-   LibreChat's Tailwind theme resolves every color through CSS
-   variables set on html.light / html.dark (space-separated RGB).
-   Overriding those variables rebrands the WHOLE app — login page,
-   chat UI, dialogs — through the existing theme system.
+   Inference Co-op branding — LibreChat overlay (v3)
+   Colors are pulled from the co-op homepage's own CSS variables
+   (inference.coop): --cream #faf8f5, --wash #eef4ea, --green-deep
+   #5b8c5a, --green-mid #6ba86b, --green-light #7ab87a, --ink
+   #2d3327, --muted #6b7a62, --border #e8e2d8, font Figtree.
+   LibreChat resolves its Tailwind colors through CSS variables on
+   html.light / html.dark (space-separated RGB) — overriding them
+   rebrands the WHOLE app through the existing theme system.
    ============================================================ */
 
 html.light {
-  --surface-primary: 250 248 245;   /* cream background */
-  --surface-secondary: 241 237 230;
-  --surface-tertiary: 232 227 217;
-  --surface-hover: 236 234 217;
-  --surface-submit: 91 140 90;      /* co-op green */
-  --surface-submit-hover: 74 122 74;
-  --accent-primary: 91 140 90;
-  --accent-primary-hover: 74 122 74;
-  --ring-primary: 91 140 90;
-  --link: 74 122 74;
-  --text-primary: 36 48 32;
-  --text-secondary: 90 107 82;
-  --border-light: 213 221 208;
+  --surface-primary: 250 248 245;   /* --cream #faf8f5 */
+  --surface-secondary: 238 244 234; /* --wash #eef4ea */
+  --surface-tertiary: 232 226 216;  /* --border #e8e2d8 */
+  --surface-hover: 232 245 232;     /* #e8f5e8 (homepage wash hover) */
+  --surface-submit: 91 140 90;      /* --green-deep #5b8c5a */
+  --surface-submit-hover: 107 168 107; /* --green-mid #6ba86b */
+  --accent-primary: 91 140 90;      /* --green-deep */
+  --accent-primary-hover: 107 168 107; /* --green-mid */
+  --ring-primary: 91 140 90;        /* --green-deep */
+  --link: 91 140 90;                /* --green-deep */
+  --text-primary: 45 51 39;         /* --ink #2d3327 */
+  --text-secondary: 107 122 98;     /* --muted #6b7a62 */
+  --border-light: 232 226 216;      /* --border #e8e2d8 */
 }
 
 html.dark {
-  --surface-primary: 31 36 27;
-  --surface-secondary: 38 45 34;
-  --surface-tertiary: 46 54 40;
-  --surface-hover: 49 57 45;
-  --surface-submit: 122 184 122;
+  --surface-primary: 34 39 31;      /* deep pine */
+  --surface-secondary: 42 48 39;
+  --surface-tertiary: 52 59 48;
+  --surface-hover: 45 51 39;        /* --ink */
+  --surface-submit: 122 184 122;    /* --green-light #7ab87a */
   --surface-submit-hover: 142 200 142;
   --accent-primary: 122 184 122;
   --accent-primary-hover: 142 200 142;
   --ring-primary: 142 200 142;
   --link: 142 200 142;
-  --text-primary: 236 233 226;
-  --text-secondary: 168 173 158;
+  --text-primary: 232 245 232;      /* #e8f5e8 */
+  --text-secondary: 148 160 140;
   --border-light: 74 82 64;
 }
 
+/* ---- Loading screen: brand the pre-React flash instead of white/black ---- */
+#loading-container {
+  background-color: rgb(250, 248, 245); /* cream */
+}
+@media (prefers-color-scheme: dark) {
+  #loading-container {
+    background-color: rgb(34, 39, 31);  /* deep pine */
+  }
+}
+
 /* ---- Remove the "Don't have an account? Sign up" line ----
    The <p> wraps the register link on auth pages. :has() hides the
    whole paragraph (custom2.js is the MutationObserver fallback). */