@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

html {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    background: black;
    color: white;
}

h1 {
    margin-bottom: 5px;
}

.update {
    background: #5ECF60;
    background: linear-gradient(to right, #5ECF60 0%, #1ec3ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.update, h3 {
    margin: 0;
}

table {
    border-collapse: collapse;
    margin-top: 7px;
}

td, th, table {
    border: 1px solid darkslategray;
    padding: 2px 5px
}

td:nth-child(1), td:nth-child(2) {
    font-weight: bold;
}

td {
  /* Input: <td style="--val:-3">…</td> */

  /* |val| without abs() */
  --abs: max(var(--val), calc(-1 * var(--val)));

  /* opacity = 0.5 → 1 as |val| grows */
  --alpha: calc(0.5 + 0.5 * (var(--abs) / (var(--abs) + 1)));
  opacity: var(--alpha);

  /* sign detector: 0 for <=0, 1 for >0 (safe at 0) */
  --den: max(0.000001, calc(2 * var(--abs)));
  --pos: calc((var(--val) + var(--abs)) / var(--den));
  --neg: calc(1 - var(--pos));

  /* color by sign (exact red or limegreen) */
  --signColor: color-mix(in hsl,
    red calc(var(--neg) * 100%),
    limegreen calc(var(--pos) * 100%)
  );

  /* exact white at 0 (epsilon threshold) */
  --eps: 1e-12;
  --isZero: calc(1 - min(1, calc(var(--abs) / var(--eps))));

  color: color-mix(in hsl,
    white calc(var(--isZero) * 100%),
    var(--signColor) calc((1 - var(--isZero)) * 100%)
  );
}