/* ==========================================================================
   Human Advisory — brand tokens (v1, Nov 2026)
   One file every template links. Change a value here, every page follows.
   Fonts (Google Fonts, SIL Open Font License):
     Display  Archivo, expanded width (wdth 112–125)  -> wordmark, headings, numbers
     Text     Geist                                    -> body copy, UI
     Mono     Geist Mono                               -> references, labels, codes
   Load in <head>:
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@100..125,300..700&family=Geist:wght@300..700&family=Geist+Mono:wght@400;500&display=swap">
   ========================================================================== */

:root {
  /* Colour: black, white, two greys, one accent. Nothing else. */
  --ha-black:    #0A0A0A;   /* "Carbon"   - backgrounds, ink                */
  --ha-white:    #FFFFFF;   /* "Paper"    - backgrounds, ink on black       */
  --ha-graphite: #2B2B2B;   /* "Graphite" - surfaces on black, rules on black */
  --ha-grey:     #8C8C8C;   /* "Steel"    - secondary text, captions        */
  --ha-silver:   #E4E4E2;   /* "Silver"   - hairlines and fills on white    */
  --ha-mist:     #F4F4F2;   /* "Mist"     - quiet panels on white           */
  --ha-accent:   #C8102E;   /* "Signal"   - max one mark per view: a dot, a rule, a total */

  /* Type */
  --ha-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --ha-text:    "Geist", "Helvetica Neue", Arial, sans-serif;
  --ha-mono:    "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ha-wide:    125;        /* font-stretch % for display caps */

  /* Type scale (1.333 - perfect fourth), px */
  --ha-fs-xs: 11px;  --ha-fs-sm: 13px;  --ha-fs-base: 16px;  --ha-fs-md: 21px;
  --ha-fs-lg: 28px;  --ha-fs-xl: 38px;  --ha-fs-2xl: 50px;  --ha-fs-3xl: 67px;  --ha-fs-4xl: 89px;

  /* Tracking */
  --ha-track-caps:  0.18em;  /* small uppercase labels      */
  --ha-track-mark:  0.32em;  /* wordmark / eyebrow, generous */
  --ha-track-tight: -0.02em; /* large display headings      */

  /* Spacing: 4px base, use only these */
  --ha-s1: 4px;  --ha-s2: 8px;  --ha-s3: 12px; --ha-s4: 16px;  --ha-s5: 24px;
  --ha-s6: 32px; --ha-s7: 48px; --ha-s8: 64px; --ha-s9: 96px;  --ha-s10: 128px;

  /* Lines and corners: hairlines, sharp corners */
  --ha-hair: 1px;
  --ha-radius: 0px;          /* everything square; 2px max for inputs/buttons */
  --ha-ease: cubic-bezier(.2,.7,.2,1);
}

/* Theme helpers: put on any container */
.ha-dark  { background: var(--ha-black); color: var(--ha-white); --fg: var(--ha-white); --bg: var(--ha-black); --muted: var(--ha-grey); --rule: var(--ha-graphite); }
.ha-light { background: var(--ha-white); color: var(--ha-black); --fg: var(--ha-black); --bg: var(--ha-white); --muted: #6E6E6E; --rule: var(--ha-silver); }

/* Type roles */
.ha-eyebrow { font: 500 var(--ha-fs-xs)/1.2 var(--ha-mono); letter-spacing: var(--ha-track-caps); text-transform: uppercase; }
.ha-label   { font: 500 var(--ha-fs-xs)/1.3 var(--ha-text); letter-spacing: var(--ha-track-caps); text-transform: uppercase; }
.ha-display { font-family: var(--ha-display); font-stretch: 125%; font-variation-settings: "wdth" 125; font-weight: 500; letter-spacing: var(--ha-track-tight); line-height: 1.02; }
.ha-caps    { font-family: var(--ha-display); font-stretch: 125%; font-variation-settings: "wdth" 125; font-weight: 500; text-transform: uppercase; letter-spacing: var(--ha-track-mark); }
.ha-body    { font: 400 var(--ha-fs-base)/1.6 var(--ha-text); }
.ha-num     { font-variant-numeric: tabular-nums lining-nums; }
.ha-rule    { border: 0; border-top: var(--ha-hair) solid var(--rule, var(--ha-silver)); margin: 0; }
.ha-signal  { color: var(--ha-accent); }