/* Design tokens — 宣纸水墨, palette lifted from the reference layout the user prefers. Light is default; dark follows the system unless the user forces a theme via . */ :root { --paper: #f5f1e8; --paper-deep: #ece5d6; --ink: #2b2b2b; --ink-soft: #6b6358; --accent: #1d3a5f; /* deep ink-blue: title, entries, selection */ --accent-soft:#6f8db3; --line: #cbbfa8; /* fine gridlines */ --line-bold: #8a7f68; /* box gridlines */ --error: #a8423a; /* vermillion: rejects only */ --error-wash: rgba(168, 66, 58, 0.16); --good: #3d6b4f; --highlight: #e6dcc4; /* same-digit wash */ --peer: #efe8d6; /* row/col/box of selection */ --given: #2b2b2b; --entry: #1d3a5f; --accent-wash:rgba(29, 58, 95, 0.13); /* selected-cell ink wash */ --vignette: rgba(60, 50, 30, 0.05); /* warm corner darkening */ --font-serif: "Charter", "Georgia", "Songti SC", "STSong", serif; --radius: 7px; --radius-pill: 999px; --radius-modal: 14px; --motion: 160ms cubic-bezier(0.22, 0.61, 0.36, 1); color-scheme: light; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --paper: #1a1714; --paper-deep: #25201a; --ink: #e8e0d0; --ink-soft: #9a9080; --accent: #84a9d6; --accent-soft:#5e7da3; --line: #3a342a; --line-bold: #5d5443; --error: #d9756c; --error-wash: rgba(217, 117, 108, 0.20); --good: #6fa580; --highlight: #3a3322; --peer: #2a251c; --given: #e8e0d0; --entry: #84a9d6; --accent-wash:rgba(132, 169, 214, 0.18); --vignette: rgba(0, 0, 0, 0.24); color-scheme: dark; } } :root[data-theme="dark"] { --paper: #1a1714; --paper-deep: #25201a; --ink: #e8e0d0; --ink-soft: #9a9080; --accent: #84a9d6; --accent-soft:#5e7da3; --line: #3a342a; --line-bold: #5d5443; --error: #d9756c; --error-wash: rgba(217, 117, 108, 0.20); --good: #6fa580; --highlight: #3a3322; --peer: #2a251c; --given: #e8e0d0; --entry: #84a9d6; --accent-wash:rgba(132, 169, 214, 0.18); --vignette: rgba(0, 0, 0, 0.24); color-scheme: dark; }