/* tekstschaal.css — de tekstgroottes en -gewichten, en verder niets.

   Bewust een eigen bestand, los van sem-editor.css. Die laatste brengt een
   volledige indeling mee (tree links, lijst midden, inspecteur rechts) en is
   dus niet te laden op de canvassen, de landingspagina of het startscherm.
   Terwijl juist die schermen de tokens nodig hebben: modeller.html alleen al
   verwijst er 454 keer naar.

   Dat is geen theoretisch onderscheid. Een `font-size: var(--tekst-s)` op een
   pagina die het token niet kent, is niet "iets kleiner": de declaratie is dan
   ongeldig op het moment van berekenen en de tekst valt terug op wat hij erft.
   Eén ontbrekende regel had zo drie canvassen en het startscherm onleesbaar
   gemaakt. `tests/test_tekstschaal.py` bewaakt daarom dat elke pagina die een
   token gebruikt hem ook kan vinden.

   Waarom deze acht stappen: zie de toelichting in sem-editor.css en
   docs/UX-En-Design-Review.md. Kort: er stonden 2.498 losse
   font-size-declaraties over 35 groottes, waarvan tachtig procent tussen 10,5
   en 13 pixels. Vijf stappen van een halve pixel die vrijwel hetzelfde doen is
   precies wat een interface willekeurig laat ogen. */

:root {
  --tekst-xs:   11px;   /* labels, kolomkoppen, merktekens */
  --tekst-s:  12.5px;   /* tabellen en lijsten: het meeste werk */
  --tekst-m:    14px;   /* lopende tekst */
  --tekst-l:    16px;   /* nadruk, kleine koppen */
  --tekst-xl:   18px;   /* paginakop */
  --tekst-2xl:  22px;   /* kerncijfer */
  --tekst-3xl:  28px;   /* groot kerncijfer */
  --tekst-4xl:  40px;   /* alleen de landingspagina */

  /* Twee gewichten. Meer heeft dit gereedschap niet nodig, en drie of vier is
     precies hoe een interface rommelig wordt: het verschil tussen 600 en 700
     leest niet als hiërarchie maar als slordigheid. Hiërarchie maak je met
     grootte en kleur. */
  --gewicht-normaal: 400;
  --gewicht-nadruk:  600;
}
