/*
 * The brand's tokens, and nothing else: values on :root, no rules. Shared by
 * static/css/landing.css (the landing and legal pages, which alias them as --lp-*) and
 * static/css/app.css (app screens on the brand: the sign-in page so far).
 *
 * - Linked from templates/landing/base.html ahead of either stylesheet, never pulled in by
 *   an import at-rule: no CSS url function and no import at-rule here, comments
 *   included, because the production collectstatic rewrites both wherever they appear.
 * - A new text colour joins the contrast tables in tests/test_landing_preview.py or
 *   tests/test_sign_in_page.py, on every ground it sits on.
 */

:root {
  /* Brand: ink ground and type, chalk light ground, one lime, white cards. */
  --sp-ink: #121316;
  --sp-chalk: #F3F0E8;
  --sp-lime: #D4F542;
  --sp-paper: #FFFFFF;

  /* The design's neutrals: tints of ink on the dark ground, of chalk on the light. */
  --sp-ink-raised: #1B1C21;  /* a card on ink */
  --sp-ink-mark: #2A2C34;    /* a highlighted phrase on ink */
  --sp-ink-rule: #2E3038;    /* card borders and rules on ink */
  --sp-ink-line: #3A3D46;    /* pill and ghost-button borders on ink */
  --sp-ink-faint: #7E818B;   /* the faintest text on ink, still 4.5:1 on it */
  --sp-ink-dim: #8E919B;     /* quoted outline text on ink; placeholders on chalk */
  --sp-ink-muted: #A9ACB5;   /* secondary text on ink */
  --sp-ink-soft: #C9CBD2;    /* body text on ink */
  --sp-chalk-muted: #5B5E66; /* secondary text on chalk and paper */
  --sp-chalk-line: #DAD6CB;  /* rules and placeholders on chalk */
  --sp-hover: #4B4E57;       /* link hover on chalk */
  --sp-today-tint: #FBFAF5;  /* today's column on the Schedule, a breath off paper */

  /* Error and warning: the one colour outside the brand three. */
  --sp-error: #C2410C;       /* its text, border and icon */
  --sp-error-wash: #FFF4EE;  /* the ground behind it */

  /* A course's dot, by its colour_key (apps/courses/utils.py::COLOUR_KEYS), on screen and
     on the What's coming PDF: five of the design README's six course colours, coral as its
     orange and amber as its yellow. */
  --sp-course-amber: #FDE68A;
  --sp-course-mint: #86EFAC;
  --sp-course-sky: #8FE3FF;
  --sp-course-coral: #FDBA74;
  --sp-course-lilac: #C4B5FD;

  --sp-font-display: Syne, system-ui, sans-serif;
  --sp-font-body: Manrope, system-ui, sans-serif;
}