/* BriefHub design tokens. * * Lifted verbatim from briefhub-prototype.html so the prototype's design is carried * across rather than re-derived once there are screens worth designing. Dark is the * default; data-page-theme="light" on swaps the whole set. * * If a value here and a value in the prototype disagree, the prototype is wrong -- * this file is the one that ships. */ :root{ /* Dark is the default palette. The switch in the header sets data-page-theme="light" on to swap the whole set. */ /* Tells the browser which palette is in force, so its own widgets -- scrollbars, form controls -- are drawn to match rather than left light on a dark page. */ color-scheme:dark; --bg:#0D0F13; --surface:#16191F; --surface-2:#1C2027; --surface-3:#242932; --ink:#E7E9EE; --ink-2:#A3A9B6; --ink-3:#767D8B; --line:#282D36; --line-2:#353B46; --accent:#E4677F; --accent-ink:#F08FA2; --accent-soft:#2C161C; --on-accent:#16090D; --ok:#74BB99; --ok-soft:#17251E; --warn:#D3A64E; --warn-soft:#26200F; --demobar-bg:#05070A; --demobar-fg:#E7E9EE; --demobar-well:rgba(255,255,255,.09); --toast-bg:#242932; --toast-fg:#E7E9EE; --toast-strong:#FFFFFF; --toast-line:#353B46; --scrim:rgba(2,3,5,.66); --shadow:0 1px 2px rgba(0,0,0,.5), 0 12px 28px -14px rgba(0,0,0,.8); --radius:6px; --sans:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; --serif:"Newsreader", ui-serif, Georgia, serif; --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace; } :root[data-page-theme="light"]{ color-scheme:light; --bg:#E9EAED; --surface:#FBFBFC; --surface-2:#F2F3F6; --surface-3:#E7E9ED; --ink:#14161B; --ink-2:#4B505B; --ink-3:#7A808C; --line:#D8DAE1; --line-2:#C6C9D2; --accent:#A81F3F; --accent-ink:#8E1B36; --accent-soft:#F7E6EA; --on-accent:#FFFFFF; --ok:#2C6A4F; --ok-soft:#E2EFE8; --warn:#8A6410; --warn-soft:#F6EEDA; --demobar-bg:#14161B; --demobar-fg:#FBFBFC; --demobar-well:rgba(255,255,255,.12); --toast-bg:#14161B; --toast-fg:#F2F3F6; --toast-strong:#FFFFFF; --toast-line:#14161B; --scrim:rgba(10,12,16,.55); --shadow:0 1px 2px rgba(20,22,27,.06), 0 8px 24px -12px rgba(20,22,27,.18); } *{box-sizing:border-box}