/* ═══════════════════════════════════════════════════════════════════
   HFG DESIGN TOKENS (styles/hfg-tokens.css) — v2
   The single source of truth for color and type across every HFG tool,
   on BOTH the input screen and the printed client report.

   Load FIRST, right after the Adobe Fonts kit. Never redefine a --rp-*
   or --iv-* value in a tool stylesheet; if a tool needs a new color it
   gets added here first.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  /* ── type ──────────────────────────────────────────────────────
     Adobe Fonts kit pon7ryr. There is NO italic face — use weight,
     never font-style:italic (print drops it). Weight scale in use:
     700 body emphasis, 800 everything structural. */
  --sans:"dunbartext","Helvetica Neue",Arial,sans-serif;
  --mono:"dunbartext","Helvetica Neue",Arial,sans-serif;

  /* ── brand ─────────────────────────────────────────────────────
     Navy is the voice, lime is the accent. Never tint the lime for
     large fills — it is a rule, a chip, a callout border, a bar. */
  --rp-navy:#103a5c;        /* headers, rules, step chips, avatars   */
  --rp-grad1:#1d5c84;       /* gradient light end (hero, hero card)  */
  --rp-grad2:#0e2f4c;       /* gradient dark end                     */
  --rp-footnavy:#0f2a3d;    /* report footer bar                     */
  --rp-pill:#bcd64a;        /* lime on navy — accent text, buttons   */
  --rp-pill-ink:#16290a;    /* ink ON a lime fill                    */
  --rp-lime:#7f9a16;        /* lime on white — bars, left borders    */
  --rp-lime-ink:#5f7414;    /* lime text on white (AA on white)      */
  --rp-limebg:#f2f6df;      /* callout / chip fill                   */
  --rp-limeline:#d6e29a;    /* callout border                        */

  /* ── ink ───────────────────────────────────────────────────────── */
  --rp-ink:#10324f;         /* primary text                          */
  --rp-ink2:#41607a;        /* body / secondary                      */
  --rp-mut:#7a8a98;         /* labels, eyebrows, axis                */
  --rp-comp:#92a0ab;        /* compliance fine print                 */
  --rp-bestsub:#aecade;     /* secondary text ON navy                */

  /* ── surfaces ──────────────────────────────────────────────────── */
  --white:#fff;
  --rp-card:#fbfaf7;        /* cream — inset panels, field fills     */
  --rp-line:#e4e0d6;        /* warm hairline (report + card borders) */
  --rp-backdrop:#cfd6dd;    /* desk behind report pages              */

  /* ── the one red: binding limit, negative delta, validation ────── */
  --rp-red:#c4503e;
  --rp-redink:#9a5448;
  --rp-redline:#e6c4bd;
  --rp-redpale1:#fbeeea;
  --rp-redpale2:#f6e2dc;

  /* ── charts ────────────────────────────────────────────────────── */
  --rp-chart-own:#4d8aa8;
  --af-bar:#7fa7c4;         /* neutral bar                           */
  --af-track:#eef0ec;       /* gauge / meter track                   */
  --af-p1:#103a5c;          /* stacked bar, darkest → lightest       */
  --af-p2:#2e6c8c;
  --af-p3:#79aac2;
  --af-p4:#a9c6d9;

  /* ── input screen only ─────────────────────────────────────────── */
  --iv-page:#eef1f4;        /* app background                        */
  --iv-line:#dfe4e9;        /* cool control border                   */
  --iv-line2:#eceff2;       /* inner divider                         */
  --iv-fill:var(--rp-card); /* field fill = report cream             */
  --iv-wrap:1184px;         /* content width, hero and cards align   */
  --iv-focus:rgba(29,92,132,.14);
}

/* Type scale — reference, not classes. Report sizes are absolute px
   because the page is a fixed 8.5×11in box; never use rem or vw there.

   REPORT               INPUT SCREEN
   page title    25px   hero title      34px
   hero number   31px   card title      15px
   KPI number    26px   field value     14px
   facts value   14px   field label     10px  (uppercase, .9px tracking)
   body          10.5px hint            10px
   section label 9.5px  section rule    10px  (uppercase, 1.4px tracking)
   compliance    8.2px  eyebrow         9px   (uppercase, 1.7px tracking)

   Floor: nothing on a report page below 8px. Nothing interactive on the
   mobile screen below a 44px hit target. */