/* Optitoo toolbox — design tokens, taken from OptiChart as they were. Every tool links this first. Light by default; `data-theme="dark"` on switches (see theme.js). Tool-specific sizes stay in each tool. */ :root { color-scheme: light; --bg: #f2f4f7; --surface: #ffffff; --surface-2: #f7f9fc; --surface-sunken: #eceff4; --border: #dbe1ea; --border-strong: #c3ccd9; --text: #16212e; --text-dim: #5b6b7f; --text-faint: #8494a6; --accent: #3b6fb0; --accent-soft: #e8f0fe; --accent-text: #ffffff; --danger: #c0392b; --danger-soft: #fdecea; --ok: #1f8a5b; --warn: #b7791f; --radius: 8px; --radius-sm: 6px; --shadow: 0 1px 2px rgb(16 33 46 / 8%), 0 6px 20px rgb(16 33 46 / 8%); --shadow-sm: 0 1px 2px rgb(16 33 46 / 10%); --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; } :root[data-theme="dark"] { color-scheme: dark; --bg: #10151c; --surface: #181f29; --surface-2: #1e2733; --surface-sunken: #131a23; --border: #2b3644; --border-strong: #3b4859; --text: #e6ecf3; --text-dim: #9fb0c3; --text-faint: #6f8298; --accent: #5b9bd8; --accent-soft: #1c2c3e; --accent-text: #0d1319; --danger: #e8756a; --danger-soft: #33201e; --ok: #4ec48c; --warn: #d9a441; --shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 8px 24px rgb(0 0 0 / 35%); --shadow-sm: 0 1px 2px rgb(0 0 0 / 40%); }