/* Theme tokens. Resolution order: 1. light values on :root 2. the OS preference, unless the reader has explicitly chosen light 3. an explicit [data-theme] choice, which wins over the OS either way The page follows the operating system by default. The toggle stamps data-theme on to override it; clearing the attribute hands control back to the OS. */ :root { --paper: #FAFAF9; --paper-2: #FFFFFF; --ink: #0B0B0C; --ink-2: #3A3B3E; --ink-3: #6C6E73; --line: #E3E3E0; --line-strong: #C9C9C4; --accent: #1D4ED8; --accent-2: #1E40AF; --on-accent: #FFFFFF; --wash: #E7EDFC; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --paper: #0C0D0E; --paper-2: #141517; --ink: #F5F5F4; --ink-2: #B9BABD; --ink-3: #86888D; --line: #24262A; --line-strong: #35383D; --accent: #7FA9FF; --accent-2: #A0C0FF; --on-accent: #06122B; --wash: #131A29; } } :root[data-theme="dark"] { --paper: #0C0D0E; --paper-2: #141517; --ink: #F5F5F4; --ink-2: #B9BABD; --ink-3: #86888D; --line: #24262A; --line-strong: #35383D; --accent: #7FA9FF; --accent-2: #A0C0FF; --on-accent: #06122B; --wash: #131A29; }