JSFiddle - React, Tailwind, and code Playground

HTML

<html>

  <body>
    KoLmafia r20534 side panel in Dark Mode:
    <div class="container before">
      <div class="panel status-good">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
      <div class="panel status-neutral">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
      <div class="panel status-bad">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
    </div>  
    Proposed changes:
    <div class="container after">
      <div class="panel status-good">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
      <div class="panel status-neutral">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
      <div class="panel status-bad">
        <span class="under">256</span> (512)
        <br>
        250 (250)
        <br>
        <span class="over">300</span> (200)
      </div>
    </div>

  </body>

</html>

CSS

body {
  background-color: black;
  color: #cccccc;
}

.container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  font-size: 12px;
  margin: 1em 0;
}

.panel {
  width: 33%;
  box-sizing: border-box;
  padding: 1em;
  margin-bottom: 5px;
}

/* KoLmafia r20534, dark mode */

.before {
  color: #ffffff;
}

.before .status-good {
  background-color: #196717;
}

.before .status-neutral {
  background-color: #595959;
}

.before .status-bad {
  background-color: #641719;
}

.before .under {
  color: #ff0000;
}

.before .over {
  color: #0000ff;
}

/* These are my suggestions */

.after {
  color: #dddddd;
}

.after .status-good {
  background-color: #184f17;
}

.after .status-neutral {
  background-color: #404040;
}

.after .status-bad {
  background-color: #4f1719;
}

.after .under {
  color: #ff8a93;
}

.after .over {
  color: #00d4ff;
}