/* ============================================================ ANESTHEO DESIGN TOKENS · one identity, three surfaces ------------------------------------------------------------ WHY THIS FILE EXISTS The product's appearance used to be written down in 215 places. `--teal` was defined twenty times with four different values, so the brand colour depended on which page you were standing on. Corners drifted across eighteen values between 2px and 30px. Nothing was broken — it was simply impossible to change how Anestheo looks in one move. WHERE THE IDENTITY COMES FROM From the homepage as it RENDERS, measured in a browser, not from the values declared at the top of its stylesheet. Those two had diverged: index.html declares a warm paper palette at :root and then paints over it, so #FAFAF8 is real in the source and has never once reached a screen. The palette below is the one a visitor actually sees: ground #0B1620 deep bluish graphite, never pure black raised #0E1C27 ink #F2F6F8 · #93A6B4 · #6D8091 teal #2FA88C lifted for the dark ground, #7ECFC0 to read hairline rgba(255,255,255,.09) card rgba(255,255,255,.035) HOW IT IS ORGANISED 1. BRAND the teal family, the radius scale, the spacing rhythm, the type hierarchy, the motion. Identical everywhere. This shared half is what makes the public site and the clinical product read as one product rather than two. 2. GRAPHITE the default, and the identity above. The public site, the patient application, and anything that does not ask for something else. 3. CLINICAL . The same graphite identity, one step deeper and one step denser: a full-screen instrument read for hours needs more contrast between a row and its neighbour than a marketing page does, and it keeps the teal hairline that separates its panels. 4. LIGHT . A complete light surface, kept and maintained but assigned to no page. It exists for a surface that one day has a readability reason to be light — print, daylight, a shared screen. Assigning it is a design decision, not a default. HOW TO USE IT Write components against the SEMANTIC names — --ground, --surface, --line, --ink, --ink-muted, --brand — and the same rule renders correctly on every surface. The older names (--dark, --text, --muted, --accent …) are kept as aliases and redefined per surface, so a page that still speaks the old vocabulary follows whichever surface it is on. A page may still override any token locally; this file is loaded before any page's own