/* tokens.css — sistema d'estils propi, esperit Naturaki (tema clar únic).
   Validat sobre la pantalla d'exemple abans de propagar. */
:root {
  /* Marca */
  --brand:        #5f8d23;   /* verd marca (interactiu) */
  --brand-strong: #005329;   /* verd profund (títols/èmfasi) */
  --brand-bright: #8bc63f;   /* verd clar (accents puntuals) */
  --sage:         #9eae71;   /* vora sage */

  /* Neutres (biaix verd) */
  --page:      #f3f3f3;
  --surface:   #ffffff;
  --ink:       #132420;      /* text principal */
  --muted:     #5f6b60;      /* text secundari */
  --line:      #e4e5de;      /* vores */
  --line-soft: #eef0ea;

  /* Estat del sensor — text sempre AA sobre el seu fons */
  --ok-bg:   #eaf3dc; --ok-dot:   #5f8d23; --ok-ink:   #33520f;
  --warn-bg: #fbeecd; --warn-dot: #e79413; --warn-ink: #7a4d00;
  --crit-bg: #b3231f; --crit-dot: #ffffff; --crit-ink: #ffffff;   /* crític sòlid: ha de cridar */
  --crit-soft-bg: #f8dcdb; --crit-soft-ink: #8f1a17;
  --none-bg: #eeeeea; --none-dot: #9aa39a; --none-ink: #55605a;

  /* Gràfica (verds de marca, no els per defecte de Chart.js) */
  --chart-line: #5f8d23;
  --chart-fill: rgba(95, 141, 35, .14);
  --chart-grid: #e9ebe3;
  --chart-dot:  #005329;

  /* Geometria */
  --r-sm: 4px; --r-md: 8px; --r-lg: 12px;
}