/* ════════════════════════════════════════════════════════════ Curated palettes — switchable via [data-palette="..."] on . Each is hand-tuned for financial UIs: dark-first, with light pair. ════════════════════════════════════════════════════════════ */ /* ───────────────────────────────────────────────────────── 1. MIDNIGHT INK (default new) — deep blue-black canvas, Bloomberg-warm amber accents, muted serum tones ───────────────────────────────────────────────────────── */ [data-palette="midnight"] { --bg-0: #0b0d12; --bg-1: #11141b; --bg-2: #161a22; --bg-3: #1d222c; --bg-4: #262d39; --border: #1f2632; --border-strong: #2d3645; --text-0: #f0f2f7; --text-1: #c8cdd8; --text-2: #8a92a3; --text-3: #5d6577; --text-4: #3f4658; --up: #e0444a; --up-strong: #f25e60; --up-soft: #2a1318; --up-soft-border: #4a1d24; --down: #4cb87a; --down-strong: #66d090; --down-soft: #0e1f15; --down-soft-border: #1d3a27; --accent: #e9b04c; --accent-strong: #f5c870; --accent-soft: #2a1f0d; --src-tech: #6cb6ff; --src-ai: #c79bff; --src-expert: #e9b04c; } [data-palette="midnight"][data-theme="light"] { --bg-0: #f7f8fc; --bg-1: #ffffff; --bg-2: #f1f3f9; --bg-3: #e7ebf3; --bg-4: #dde2ed; --border: #e2e6ee; --border-strong: #ccd2de; --text-0: #0e1320; --text-1: #2a3245; --text-2: #5a6580; --text-3: #7d8aa3; --text-4: #a5afc2; --up-soft: #fdf0f1; --up-soft-border: #f7cfd2; --down-soft: #ecf8f0; --down-soft-border: #c9e7d5; --accent-soft: #fdf5e2; } /* ───────────────────────────────────────────────────────── 2. GRAPHITE — pure neutral, FT/Bloomberg minimal, monochrome with razor red/green ───────────────────────────────────────────────────────── */ [data-palette="graphite"] { --bg-0: #0a0a0a; --bg-1: #131313; --bg-2: #1a1a1a; --bg-3: #232323; --bg-4: #2e2e2e; --border: #242424; --border-strong: #3a3a3a; --text-0: #f5f5f4; --text-1: #d4d4d2; --text-2: #9a9a98; --text-3: #6b6b69; --text-4: #44444a; --up: #d9434a; --up-strong: #ec5a60; --up-soft: #2a1417; --up-soft-border: #481d22; --down: #2ea876; --down-strong: #45c28e; --down-soft: #0e1f17; --down-soft-border: #1c3a2a; --accent: #d9b25c; --accent-strong: #ecc775; --accent-soft: #28200e; --src-tech: #5e9eff; --src-ai: #b48bff; --src-expert: #d9b25c; } [data-palette="graphite"][data-theme="light"] { --bg-0: #fafaf9; --bg-1: #ffffff; --bg-2: #f5f5f4; --bg-3: #ededec; --bg-4: #e5e5e4; --border: #e5e5e4; --border-strong: #d4d4d2; --text-0: #0c0c0c; --text-1: #262626; --text-2: #525250; --text-3: #737370; --text-4: #a3a3a0; --up-soft: #fdf0f1; --down-soft: #ecf8f3; --accent-soft: #fbf5e6; } /* ───────────────────────────────────────────────────────── 3. JADE TERMINAL — cool dark teal canvas, vintage CRT jade green numerics, copper highlight ───────────────────────────────────────────────────────── */ [data-palette="jade"] { --bg-0: #0a1014; --bg-1: #0f161c; --bg-2: #141d24; --bg-3: #1c262f; --bg-4: #26323d; --border: #1f2a34; --border-strong: #2d3a47; --text-0: #e8f0ee; --text-1: #c5d0cc; --text-2: #88968f; --text-3: #5a6862; --text-4: #3c4844; --up: #d94f4f; --up-strong: #ed6868; --up-soft: #281418; --up-soft-border: #441f25; --down: #3fb89a; --down-strong: #55d4b3; --down-soft: #0d1f1b; --down-soft-border: #1c3a32; --accent: #d68a4a; --accent-strong: #eaa468; --accent-soft: #2a1c0e; --src-tech: #5db8d6; --src-ai: #a989e6; --src-expert: #d68a4a; } [data-palette="jade"][data-theme="light"] { --bg-0: #f6faf8; --bg-1: #ffffff; --bg-2: #eef4f1; --bg-3: #e2ebe7; --bg-4: #d5e0db; --border: #dde7e2; --border-strong: #c4d2cb; --text-0: #0c1816; --text-1: #1f2e2a; --text-2: #4f5e58; --text-3: #738279; --text-4: #9aa9a1; --up-soft: #fdf0f1; --down-soft: #e8f6f0; --accent-soft: #fdf1e2; } /* ───────────────────────────────────────────────────────── 4. EMBER — warm charcoal, dossier paper feel, vermilion + sage, very editorial ───────────────────────────────────────────────────────── */ [data-palette="ember"] { --bg-0: #14110e; --bg-1: #1a1612; --bg-2: #211c17; --bg-3: #2a241d; --bg-4: #362e25; --border: #2a241e; --border-strong: #3d342a; --text-0: #f5ede0; --text-1: #d6cdb8; --text-2: #9a907c; --text-3: #6b6354; --text-4: #4a4438; --up: #cf4a3a; --up-strong: #e36450; --up-soft: #2a1411; --up-soft-border: #4a1f1a; --down: #6b9d5e; --down-strong: #85b67a; --down-soft: #161e12; --down-soft-border: #28361f; --accent: #d49a3a; --accent-strong: #e9b259; --accent-soft: #2a200c; --src-tech: #6098c4; --src-ai: #9d7fc4; --src-expert: #d49a3a; } [data-palette="ember"][data-theme="light"] { --bg-0: #faf6ee; --bg-1: #ffffff; --bg-2: #f3ede1; --bg-3: #ebe3d2; --bg-4: #ddd3bf; --border: #e8e0cf; --border-strong: #cfc4ad; --text-0: #1a1611; --text-1: #34291d; --text-2: #5e5240; --text-3: #7d715c; --text-4: #a59986; --up-soft: #fbeae5; --down-soft: #eef3e8; --accent-soft: #fbf0d5; } /* ───────────────────────────────────────────────────────── 5. NEON DESK — TradingView-style cool blue-black, saturated alerts, electric AI purple ───────────────────────────────────────────────────────── */ [data-palette="neon"] { --bg-0: #0b0e16; --bg-1: #10131c; --bg-2: #161a26; --bg-3: #1d2230; --bg-4: #272d3e; --border: #1c2233; --border-strong: #2a3247; --text-0: #eef1f8; --text-1: #c4cad8; --text-2: #828ba3; --text-3: #555e75; --text-4: #383f53; --up: #ec3f4d; --up-strong: #ff5a68; --up-soft: #2a1219; --up-soft-border: #4a1d27; --down: #1fc78c; --down-strong: #3fe0a3; --down-soft: #0c2018; --down-soft-border: #173a2b; --accent: #ffb340; --accent-strong: #ffc566; --accent-soft: #2a1d08; --src-tech: #4d9fff; --src-ai: #b56dff; --src-expert: #ffb340; } [data-palette="neon"][data-theme="light"] { --bg-0: #f6f8fc; --bg-1: #ffffff; --bg-2: #eef2f8; --bg-3: #e2e8f2; --bg-4: #d5deec; --border: #e0e7f0; --border-strong: #c4cee0; --text-0: #0b0f1c; --text-1: #1f263a; --text-2: #525c75; --text-3: #7681a0; --text-4: #a0a9c4; --up-soft: #fdebee; --down-soft: #e3f8ee; --accent-soft: #fff2da; } /* ───────────────────────────────────────────────────────── 6. PARCHMENT — warm paper light mode FIRST (newsprint feel), neutral dark pair ───────────────────────────────────────────────────────── */ [data-palette="parchment"] { --bg-0: #f8f4eb; --bg-1: #ffffff; --bg-2: #f0ebde; --bg-3: #e6dfcd; --bg-4: #d7ceb6; --border: #e6dfcd; --border-strong: #c8bea4; --text-0: #1a1610; --text-1: #2f2a20; --text-2: #5a5240; --text-3: #7d7561; --text-4: #a59c84; color-scheme: light; --up: #c63d3d; --up-strong: #d85050; --up-soft: #f7e7e7; --up-soft-border: #ecc8c8; --down: #3f8a5a; --down-strong: #4fa06f; --down-soft: #e7f1e9; --down-soft-border: #c5dccc; --accent: #b87a1e; --accent-strong: #c98e2c; --accent-soft: #f7eed6; --src-tech: #3a72b8; --src-ai: #7a4fb8; --src-expert: #b87a1e; } [data-palette="parchment"][data-theme="dark"] { /* fallback dark — warm-leaning */ --bg-0: #15120d; --bg-1: #1c1812; --bg-2: #241f18; --bg-3: #2c261e; --bg-4: #3a3328; --border: #2c261e; --border-strong: #3f3829; --text-0: #f5eed8; --text-1: #d6ceb4; --text-2: #9c9479; --text-3: #6e6855; --text-4: #4d4836; color-scheme: dark; --up-soft: #2a1612; --down-soft: #161e12; --accent-soft: #2a1f0a; }