/* OWNS: PALETTE-TOKEN1
   Hyde Park Pharmacy - THE brand palette. One definition, sitewide.
   ============================================================================================
   WHAT THIS FILE IS: the single place the site's colours are declared. Every stylesheet and every
   page uses these names via var(--name) and none of them re-declares a value. Change a colour
   here and it changes everywhere, once.

   WHY IT EXISTS. Measured 2026-08-29: there was NO token stylesheet. The palette was re-typed in
   four stylesheets (wl-ds.css, account/account.css, pgds/_framework/consultation.css, and
   mega-nav.css under a parallel --hpp- naming scheme) and inline in 166 more pages - and TWO
   VERSIONS WERE LIVE. account/account.css had been hand-corrected toward the brand and its own
   comments named what it moved away from: text 1f2937 to 14202a, muted 6b7280 to 5b6470, border
   e5e7eb to ece7dd. Those old values were exactly what consultation.css still held - a stylesheet
   linked by 277 pages - so every PGD consultation page rendered cool grey body text while the
   account area rendered warm brand ink. Nothing caught it because check_no_duplicate_systems.py
   walked .html only: all 21 stylesheets sat outside every gate.

   WHICH VALUES WON. The warm set. It is the documented brand lock (wl-ds.css: "Brand-locked -
   teal, dark-teal, cream, terracotta") and the direction account.css had already moved in. The
   cool set is the Tailwind default grey ramp, which leaked in through generated pages and never
   belonged to this brand.

   TWO NAMING SCHEMES, ONE SET OF VALUES. Pages and older stylesheets use --text and --border; the
   design system uses --ink and --line. Rather than rename ~180 pages for no visual benefit, the
   older names are ALIASES of the canonical ones. Verified before aliasing: all three are consumed
   purely as colours - "color: var(--text)", "border: 1px solid var(--border)" - never as a
   shorthand, so aliasing cannot change layout.

   HOW IT REACHES EVERY PAGE: build_public.py links it LAST in the head (PALETTE-TOKEN1), so it
   wins over any older inline root block a generated page still carries. Custom properties resolve
   at computed-value time, so load order never leaves a var() undefined.

   TWO TRAPS THAT EACH COST A SILENT FAILURE HERE ON 2026-08-29, both found by measuring a
   rendered pixel rather than by reading the file:
     1. The first header quoted example declarations WITH their CSS comments. CSS comments do not
        nest, so the inner terminator closed this header early and everything after it parsed as
        declarations, which swallowed the block below. The file linked, returned 200, and defined
        NOTHING.
     2. The repair then sliced the file at the first occurrence of the word "root", which appeared
        in this very prose - leaving the old header's tail and a stray terminator behind, with the
        same result.
   Both times the stylesheet parsed to ZERO rules while looking perfectly healthy. Keep this header
   free of comment-terminator sequences, and never slice this file on prose.
   ============================================================================================ */
:root {
  /* Brand - the locked identity colours */
  --teal: #0f5257;
  --dark-teal: #0A2E36;
  --cream: #FAF7F2;
  --surface: #fff;
  --terracotta: #c47556;
  --terracotta-2: #a8542f;
  --terracotta-lt: #e9a986;
  --terracotta-ink: #a8542f;

  /* Text and rules - canonical names */
  --ink: #14202a;
  --muted: #5b6470;
  --line: #ece7dd;

  /* Aliases, so existing pages and stylesheets need no renaming */
  --text: var(--ink);
  --border: var(--line);

  /* Semantic state colours - identical in every stylesheet that had them */
  --ok: #2e7d32;
  --warn: #c17b00;
  --error: #c0392b;
  --nhs-blue: #005EB8;

  /* Spacing, radius, elevation, motion. account/account.css carried these under a comment saying,
     in its own words, that they mirrored assets/wl-ds.css - a copy that announced itself as one. */
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --s8: 72px;
  --r-card: 20px;
  --r-widget: 16px;
  --r-ctl: 12px;
  --e1: 0 2px 8px rgba(10,46,54,.05);
  --e2: 0 8px 28px rgba(10,46,54,.09);
  --e3: 0 20px 56px rgba(10,46,54,.16);
  --ease: cubic-bezier(.22,1,.36,1);

  /* The brand typeface, named once. proxima.css owns the @font-face declarations (FOUT1); this is
     the STACK those faces are used through. */
  --font-sans: 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* TYPE-BASE1 (2026-08-29) - the one safety net for the page typeface.
   ============================================================================================
   Measured in a real browser across all 460 built pages: ONE of them rendered its body text in
   "Times New Roman" - /nhs/contraception-service/. It styled individual selectors with Proxima but
   never set a font on `body`, so everything that merely inherited fell through to the browser's
   default serif. It shipped that way and only a person looking at it on a phone noticed.
   The cause is structural, not a typo: the body typeface was set PER PAGE, so a page can be created
   without it and nothing says a word.
   This rule is a BASE, exactly like the palette above: any page or stylesheet that sets its own body
   font still wins, so this changes NOTHING on the 459 pages that were already correct - it only
   catches the one that was not, and any future page that forgets. Enforced by TYPE-BASE1 in
   check_seo_invariants.py so it cannot silently regress.
   ============================================================================================ */
body {
  font-family: var(--font-sans);
}