/* Percentile tinting — top-only sequential teal scale.
   Six buckets: p75 (faintest) → p99 (strongest).
   Below p75 = no tint (plain cell). */

:root {
  --p75: hsla(180, 40%, 85%, 0.4);
  --p80: hsla(180, 45%, 78%, 0.5);
  --p85: hsla(180, 50%, 70%, 0.5);
  --p90: hsla(180, 55%, 62%, 0.55);
  --p95: hsla(180, 60%, 52%, 0.55);
  --p99: hsla(180, 65%, 42%, 0.6);
}

[data-theme="dark"] {
  --p75: hsla(180, 30%, 30%, 0.3);
  --p80: hsla(180, 35%, 33%, 0.35);
  --p85: hsla(180, 40%, 36%, 0.4);
  --p90: hsla(180, 45%, 39%, 0.45);
  --p95: hsla(180, 50%, 42%, 0.5);
  --p99: hsla(180, 55%, 45%, 0.55);
}

/* No-JS dark fallback */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --p75: hsla(180, 30%, 30%, 0.3);
    --p80: hsla(180, 35%, 33%, 0.35);
    --p85: hsla(180, 40%, 36%, 0.4);
    --p90: hsla(180, 45%, 39%, 0.45);
    --p95: hsla(180, 50%, 42%, 0.5);
    --p99: hsla(180, 55%, 45%, 0.55);
  }
}