:root { --chrome: #06121c; --chrome2: #0e2434; --lime: #c1fb13; /* --accent defaults to lime; per-base accent overrides it on */ --accent: var(--lime); --accent-border: #a8dc0f; --ink: #0b1722; --mut: #5e6e7e; --faint: #8c99a6; --bg: #f6f7f9; --paper: #ffffff; --line: #e5e9ee; --line2: #d5dce3; --sel: #0b1722; --sel-tx: #ffffff; --hover: #f2f5f8; --head-bg: #fbfcfd; --head-hover: #f2f5f8; --group-bg: #eff2f5; --group-hover: #e0e5ea; --pop-bg: #ffffff; --field-bg: #ffffff; --linkpill-bg: #edf2f8; --linkpill-tx: #23425f; --linkpill-bd: #d8e2ec; --link-tx: #1a5fd0; --danger-tx: #b3261e; --danger-bg: #fbeae9; --ok-tx: #16683b; --meter-track: #e5e9ee; --tint-filter-bg: #e8f4ec; --tint-filter-tx: #16683b; --tint-sort-bg: #fcefe0; --tint-sort-tx: #9a5b07; --tint-group-bg: #e2f0f2; --tint-group-tx: #0e6470; --tint-hide-bg: #edf0f4; --tint-hide-tx: #3e4c5b; --tint-color-bg: #f3e8fb; --tint-color-tx: #6326a8; --summary-bg: #fbfcfd; --range-fill: rgba(26, 95, 208, 0.12); --range-bd: #1a5fd0; --r: 6px; --shadow: 0 6px 24px rgba(10, 23, 34, 0.14), 0 1px 3px rgba(10, 23, 34, 0.1); } /* ---------- dark palette ---------- */ [data-theme="dark"] { --chrome: #04090f; --chrome2: #0c1a26; --ink: #e7edf2; --mut: #9aa9b6; --faint: #76828f; --bg: #11161b; --paper: #181f26; --line: #2a333c; --line2: #3a444e; --sel: #e7edf2; --sel-tx: #0b1722; --hover: #212a32; --head-bg: #1d252d; --head-hover: #262f38; --group-bg: #1d252d; --group-hover: #2a333c; --pop-bg: #1e262e; --field-bg: #232c34; --linkpill-bg: #233140; --linkpill-tx: #b9cee2; --linkpill-bd: #33475a; --link-tx: #79aef0; --danger-tx: #f1837b; --danger-bg: #3a201e; --ok-tx: #5fcf8e; --meter-track: #2a333c; --tint-filter-bg: #13301f; --tint-filter-tx: #7fd6a3; --tint-sort-bg: #352617; --tint-sort-tx: #e0a868; --tint-group-bg: #173034; --tint-group-tx: #6cc6d2; --tint-hide-bg: #232b33; --tint-hide-tx: #b6c2cf; --tint-color-bg: #2a1f3a; --tint-color-tx: #c9a8ef; --summary-bg: #1d252d; --range-fill: rgba(121, 174, 240, 0.18); --range-bd: #79aef0; --shadow: 0 6px 24px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.4); } @media (prefers-color-scheme: dark) { [data-theme="system"] { --chrome: #04090f; --chrome2: #0c1a26; --ink: #e7edf2; --mut: #9aa9b6; --faint: #76828f; --bg: #11161b; --paper: #181f26; --line: #2a333c; --line2: #3a444e; --sel: #e7edf2; --sel-tx: #0b1722; --hover: #212a32; --head-bg: #1d252d; --head-hover: #262f38; --group-bg: #1d252d; --group-hover: #2a333c; --pop-bg: #1e262e; --field-bg: #232c34; --linkpill-bg: #233140; --linkpill-tx: #b9cee2; --linkpill-bd: #33475a; --link-tx: #79aef0; --danger-tx: #f1837b; --danger-bg: #3a201e; --ok-tx: #5fcf8e; --meter-track: #2a333c; --tint-filter-bg: #13301f; --tint-filter-tx: #7fd6a3; --tint-sort-bg: #352617; --tint-sort-tx: #e0a868; --tint-group-bg: #173034; --tint-group-tx: #6cc6d2; --tint-hide-bg: #232b33; --tint-hide-tx: #b6c2cf; --tint-color-bg: #2a1f3a; --tint-color-tx: #c9a8ef; --summary-bg: #1d252d; --range-fill: rgba(121, 174, 240, 0.18); --range-bd: #79aef0; --shadow: 0 6px 24px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.4); } } * { box-sizing: border-box; margin: 0; padding: 0; } html, body { height: 100%; } body { font: 13px/1.45 Inter, system-ui, -apple-system, sans-serif; color: var(--ink); background: var(--bg); display: flex; flex-direction: column; overflow: hidden; -webkit-font-smoothing: antialiased; } button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; } input, select, textarea { font: inherit; color: inherit; } input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible { outline: 2px solid #2e5aac; outline-offset: 1px; } ::selection { background: #cfe3ff; }