/* ============================================================ Ledger design-system layer (quick 260529-vxn) Light default + dark via Tailwind class-based dark mode (html.dark). Token source of truth: server/static/_mockup_system.html :root / [data-theme=dark]. Here the dark block is scoped to html.dark so it matches the live app's `` toggle (NOT [data-theme]). ADDITIVE only: this complements Tailwind utilities (it must not fight layout). It carries (a) CSS tokens, (b) the global system-font + 16px base + tabular-nums body rule, and (c) a small set of opt-in helper component classes (.ls-* / cell-input / tbtn / badge) actually used by the markup. Bulk table/badge polish is done via Tailwind class sweeps in app.js / journal.js. ============================================================ */ /* ---------- design tokens ---------- */ :root { --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; /* light theme (default) */ --bg: #eef1f5; --surface: #ffffff; --surface-2: #f7f9fb; --line: #e2e6ec; --line-soft: #eef1f5; --txt: #1f2937; --txt-soft: #4b5563; --label: #6b7280; --accent: #4f46e5; --accent-bg: rgba(79,70,229,0.10); --up: #15915b; --up-bg: rgba(21,145,91,0.12); --down: #d12d2d; --down-bg: rgba(209,45,45,0.12); --warn: #c2740a; --warn-bg: rgba(194,116,10,0.12); --shadow: 0 1px 3px rgba(16,24,40,0.06), 0 1px 2px rgba(16,24,40,0.04); --shadow-lg: 0 8px 24px rgba(16,24,40,0.12); } /* dark tokens — scoped to the live app's class-based toggle */ html.dark { --bg: #0d0f11; --surface: #16191d; --surface-2: #1b1f24; --line: #262b31; --line-soft: #1f242a; --txt: #d7dbe0; --txt-soft: #aeb4bd; --label: #7c848f; --accent: #e8b931; --accent-bg: rgba(232,185,49,0.13); --up: #34c270; --up-bg: rgba(52,194,112,0.14); --down: #f0564a; --down-bg: rgba(240,86,74,0.14); --warn: #f0a93b; --warn-bg: rgba(240,169,59,0.14); --shadow: 0 1px 3px rgba(0,0,0,0.4); --shadow-lg: 0 8px 24px rgba(0,0,0,0.5); } /* ---------- global type base ---------- */ html { font-size: 16px; } /* Global small-text bump (2026-05-30) lives in index.html: text-xs is remapped in tailwind.config.fontSize; text-[11px] (arbitrary value) is overridden in a post-CDN