/* Snake River Headwaters dashboard — shared design tokens.
   Loaded by style-guide.html AND wireframe-styled.html so the guide governs the mockups.
   Mirrors the dashboard's own --sr-fs-* scale in site.css (same rem steps). */

:root, body {
  /* (Declared on body as well as :root: calc() tokens resolve where they are DECLARED, so the
     desktop base override on body would otherwise never reach them.) */
  /* Root size. The dashboard runs two bases: 15px on phones/tablets (<992px), 13px on desktop.
     The wireframe switches on its viewport toggle; the guide shows both px values per step. */
  --fs-base: 15px;

  /* Type scale — nine named steps. (The former "display" 2.2rem step is retired: the condition
     verdict uses title, as the drawer's mobile rule already does.) */
  --fs-micro:   calc(var(--fs-base) * .62);   /* 9.3 / 8.1px   · 600 · uppercase, tracking — badges, HIGH/LOW tags */
  --fs-tiny:    calc(var(--fs-base) * .70);   /* 10.5 / 9.1px  · 500 — small labels, timestamps */
  --fs-caption: calc(var(--fs-base) * .78);   /* 11.7 / 10.1px · 500 — chart captions, nav labels */
  --fs-small:   calc(var(--fs-base) * .85);   /* 12.75 / 11px  · 600 — section titles, buttons */
  --fs-body-s:  calc(var(--fs-base) * .90);   /* 13.5 / 11.7px · 400 — detail-panel text, pills */
  --fs-body:    calc(var(--fs-base) * 1);     /* 15 / 13px     · 400 — regular text, subtitles */
  --fs-lead:    calc(var(--fs-base) * 1.1);   /* 16.5 / 14.3px · 700 — highlighted readings */
  --fs-title:   calc(var(--fs-base) * 1.4);   /* 21 / 18.2px   · 600 — summary numbers, verdict, panel titles */
  --fs-heading: calc(var(--fs-base) * 1.75);  /* 26.25 / 22.75px · 600 — station names */
}
body[data-vp="desktop"] { --fs-base: 13px; }