message: Minor tweaks and tidy up.
diff: $arrow-size: 16px; // ensure this stays in sync with 'popperArrowSize' in 'usePopper.ts'
  $border-color: #5d5970;
  -// $border-color: #403f52;
  -$horizontal-padding: 12px;
  +$horizontal-padding: 11px;
  $half-arrow-size: $arrow-size * 0.5;
  .arrow {
  @@ -27,15 +26,13 @@ $half-arrow-size: $arrow-size * 0.5;
  position: absolute;
  background-color: #151523;
  - // background-color: #262535;
  color: #dadaea;
  width: fit-content;
  - max-width: 320px;
  + max-width: 308px;
  border: 1px solid $border-color;
  border-top: 5px solid var(--ribbon-color);
  border-radius: 8px;
  - // box-shadow: 0 0 16px 8px #080811a1;
  - box-shadow: 0 0 24px 4px #080811;
  + box-shadow: 0 0 24px 6px #080811;
  text-align: left;
  z-index: 99999;
  white-space: pre-wrap;
  @@ -56,8 +53,8 @@ $half-arrow-size: $arrow-size * 0.5;
  .header {
  background-color: #0a0a0f;
  - padding: 8px $horizontal-padding;
  - border-radius: 8px 8px 0 0;
  + padding: 6px $horizontal-padding;
  + border-radius: 4px 4px 0 0;
  h2 {
  font-size: 14px;
  @@ -124,7 +121,7 @@ $half-arrow-size: $arrow-size * 0.5;
  .section:not(:empty) {
  margin: 8px #{-$horizontal-padding} -8px #{-$horizontal-padding};
  - padding: 6px $horizontal-padding 8px $horizontal-padding;
  + padding: 5px $horizontal-padding 7px $horizontal-padding;
  border-top: 1px solid rgba($border-color, 0.5);
  > :first-child {
  @@ -136,7 +133,7 @@ $half-arrow-size: $arrow-size * 0.5;
  }
  &:first-child {
  - margin-top: -8px;
  + margin-top: -7px;
  border-top: none;
  }
  }
  @@ -149,10 +146,8 @@ $half-arrow-size: $arrow-size * 0.5;
  @mixin tooltip-section-color($color) {
  &:not(:empty) {
  color: color.mix(white, $color, 80%);
  - background-color: rgba($color, 0.2);
  + background-color: rgba($color, 0.175);
  border-top-color: rgba($color, 0.5);
  - border-top-width: 1px;
  - // border-top-width: 0;
  border-top-color: #151523;
  }
  }
  