/* Huisstijl van Stantinel: de waarden die alle drie de diensten delen.
 *
 * Dit bestand is de BRON. De diensten hebben ieder hun eigen stijlblok (ze
 * draaien op verschillende machines en in verschillende talen), dus de waarden
 * staan daar gekopieerd. Wijzigt er hier iets, dan gaan ze alle drie mee:
 *   - de suite:  /root/stantinel/index.html
 *   - CMScan:    /root/waakhond/sjablonen.py
 *   - Score:     /root/vindscore/index.html (plus de kopie op VPS7)
 *   - Uptime:    /root/projects/uptime/frontend/tailwind.config.js
 */
:root{
  /* grond en papier */
  --grond:#F3F6F8;      /* de achtergrond van een pagina */
  --paneel:#FFFFFF;     /* kaarten en balken */
  --paneel2:#F8FAFB;    /* een vlak dat iets moet terugliggen */

  /* inkt en tekst */
  --inkt:#132430;       /* donkere koppen, donkere vlakken, knoppen */
  --zacht:#5A6B78;      /* bijschriften */
  --lijn:#E2E8EC;       /* randen */

  /* betekenis: alleen voor status, nooit als versiering */
  --op:#1C753E;         /* in orde */
  --let:#8A5700;        /* let op, traag */
  --neer:#B3261E;       /* storing */

  /* merk en accent */
  --merk:#2CBC87;       /* het groen uit het logo; voor het merkteken en het
                           kloppende stipje. NIET voor knoppen: groen betekent
                           in deze schermen "in orde". */
  --merk-donker:#177C58;/* hetzelfde groen, leesbaar op wit */
  --blauw:#0E7C9D;      /* accent voor verwijzingen en eyebrows */
}

/* Type: Archivo voor koppen, IBM Plex Sans voor tekst, IBM Plex Mono voor
   labels en cijfers. Alle drie zelf meegeleverd, niets bij Google. */
/* koppen        */ h1,h2,h3{font-family:Archivo,"Arial Narrow",Arial,sans-serif;letter-spacing:-.01em}
/* tekst         */ body{font-family:"IBM Plex Sans",-apple-system,system-ui,sans-serif;line-height:1.6}
/* label, cijfer */ .ey,.mono{font-family:"IBM Plex Mono",monospace;font-size:11px;
                      letter-spacing:.18em;text-transform:uppercase}

/* Vorm: hoeken van 4 pixels, randen van 1 pixel, schaduw spaarzaam. Een rand
   zegt "los onderdeel"; gebruik hem dus niet op alles tegelijk. */
.kaart{background:var(--paneel);border:1px solid var(--lijn);border-radius:4px}
.knop{background:var(--inkt);color:#fff;border:0;border-radius:4px;font-weight:600}