/* author-trends — theme tokens. * * Default is LIGHT mode (matches the user's stated preference). Dark mode * is opt-in via the `.dark` class on , toggled by the topbar button * (see src/ui/theme-toggle.js). User preference persists in localStorage. * * Add :root tokens for *colours and shadows only*. Sizing tokens * (--radius-*) stay theme-independent. */ :root { /* Sizing — not theme-dependent. */ --radius-sm: 6px; --radius-md: 10px; --radius-lg: 12px; /* ── Light mode (default) ──────────────────────────────────────────── */ --bg: #ffffff; --surface: #f6f8fa; --surface-2: #eaeef2; --border: #d0d7de; --grid: #d8dee4; --accent-border: #0969da; --text-strong: #1f2328; --text: #24292f; --text-body: #424a53; --text-muted: #6e7781; --text-dim: #8c959f; --link: #0969da; --link-strong: #0550ae; --danger: #cf222e; /* Metric / palette colours stay the same across modes so chart series * keep their identity when the user toggles. */ --tips-pct: #2ea8f5; --tips-vol: #45aaf2; --pps-pct: #fc5c65; --pps-vol: #fd9644; --inst-pct: #1a7f37; /* green tuned for light bg */ --inst-vol: #0fb9b1; --trend: #bf8700; /* amber tuned for light bg */ --remainder: #d0d7de; --c1: #2ea8f5; --c2: #bf8700; --c3: #cf222e; --c4: #1f6feb; --c5: #8250df; --c6: #1a7f37; --c7: #d4a72c; --c8: #b62324; --c9: #0a7361; --c10: #6e7781; --shadow-tooltip: 0 8px 28px rgba(140, 149, 159, 0.25); } /* ── Dark mode override ──────────────────────────────────────────────── */ body.dark { --bg: #0d1117; --surface: #161b22; --surface-2: #1c2128; --border: #30363d; --grid: rgba(255, 255, 255, 0.05); /* very subtle gridlines in dark mode */ --accent-border: #388bfd; --text-strong: #f0f6fc; --text: #e6edf3; --text-body: #c9d1d9; --text-muted: #8b949e; --text-dim: #484f58; --link: #58a6ff; --link-strong: #1f6feb; --danger: #f85149; /* Restore dark-tuned metric palette. */ --inst-pct: #26de81; --inst-vol: #0fb9b1; --trend: #f7b731; --remainder: #2a2f36; --c1: #2ea8f5; --c2: #f7b731; --c3: #fc5c65; --c4: #45aaf2; --c5: #a55eea; --c6: #26de81; --c7: #fd9644; --c8: #eb3b5a; --c9: #0fb9b1; --c10: #778ca3; --shadow-tooltip: 0 8px 28px rgba(0, 0, 0, 0.7); }