:root{
/* The brand is square. Corners exist to soften a control, never to
   decorate a container. Tables, rules and page panels stay at 0. */
--radius-none:0;
--radius-xs:2px;
--radius-sm:3px;   /* buttons, inputs, badges */
--radius-md:4px;   /* cards */
--radius-lg:6px;   /* modals, the largest radius in the system */
--radius-pill:999px;  /* status dots and pill tags only */

--border-width-hairline:1px;
--border-width-rule:1.5px;   /* the terracotta header rule */
--border-width-strong:2px;
--border-width-bar:3px;       /* the short accent bar under cover titles */

--rule-accent-width:56px;     /* length of the short bar under a cover title */
}