/* The one token set for the whole app. Willis Worxs design language: 8px grid, 24px inset,
   24px radius, Inter with Libre Baskerville as an accent, three sizes and three weights per
   component. Every page loads this first; a stylesheet after it may add colours but must not
   redefine a token here.

   Before this file the tokens were declared three times (site.css, results.css, landing.css)
   and not at all in the exam room, which ran on Segoe UI because css/exam-env.css set its own
   --font. Five of the ten pages never loaded Inter at all. */

:root {
    /* Space. Everything snaps to the 8px grid; --space is the inset inside a component. */
    --grid: 8px;
    --space: 24px;
    --s-1: 8px;
    --s-2: 16px;
    --s-3: 24px;
    --s-4: 32px;
    --s-6: 48px;
    --s-8: 64px;

    /* Shape. One radius. Pills are for chips and toggles only. */
    --radius: 24px;
    --pill: 999px;

    /* Type. Two families. The serif is an accent, never body copy. */
    --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-serif: "Libre Baskerville", "Playfair Display", Georgia, serif;
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

    /* Six sizes exist for the whole app; a single component may use at most three. */
    --t-xs: 12px;
    --t-sm: 14px;
    --t-md: 16px;
    --t-lg: 20px;
    --t-xl: 32px;
    --t-2xl: 48px;

    /* Three weights, and these are the three that are actually downloaded. 600 was used 51
       times and never fetched, so every semibold was silently rendering as 700 anyway. */
    --w-regular: 400;
    --w-medium: 500;
    --w-bold: 700;
}

/* No italics anywhere (design language). Emphasis is colour, weight or the serif face. */
em, i, cite, dfn, var, address { font-style: normal; }