diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 8a5dd6c54a..d8bc1b26fa 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -16,15 +16,15 @@
         "@emotion/react": "^11.7.1",
         "@emotion/styled": "^11.6.0",
         "@lingui/react": "^3.13.0",
-        "@visx/axis": "^2.4.0",
-        "@visx/event": "^2.1.2",
+        "@visx/axis": "^2.10.0",
+        "@visx/event": "^2.6.0",
         "@visx/grid": "^2.10.0",
         "@visx/group": "^2.1.0",
-        "@visx/legend": "^2.2.2",
-        "@visx/responsive": "^2.4.1",
+        "@visx/legend": "^2.10.0",
+        "@visx/responsive": "^2.10.0",
         "@visx/scale": "^2.2.2",
         "@visx/shape": "^2.4.0",
-        "@visx/tooltip": "^2.2.2",
+        "@visx/tooltip": "^2.10.0",
         "body-parser": "^1.19.1",
         "d3": "^6.7.0",
         "dotenv": "^16.0.1",
@@ -4100,6 +4100,11 @@
       "integrity": "sha512-CtzORUwWTTOTqfVtHaKRJ0I1kNQd1bpn3sUh8I3nJDVY+5/M/Oe1DnEWzPQvqq/xPIIkzzzIP7mfCoAjFRvDhg==",
       "dev": true
     },
+    "node_modules/@juggle/resize-observer": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.3.1.tgz",
+      "integrity": "sha512-zMM9Ds+SawiUkakS7y94Ymqx+S0ORzpG3frZirN3l+UlXUmSUR7hF4wxCVqW+ei94JzV5kt0uXBcoOEAuiydrw=="
+    },
     "node_modules/@leichtgewicht/ip-codec": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
@@ -5583,35 +5588,35 @@
       }
     },
     "node_modules/@visx/axis": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/@visx/axis/-/axis-2.4.0.tgz",
-      "integrity": "sha512-5QA1Std1HSfBjVObulMW6gi2ZlBg9zuP8jUpgs1LL5tLWritla4T6cheEGLNa6Yuuy/DKzpHJUmNGBtpBGFEGw==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/axis/-/axis-2.12.2.tgz",
+      "integrity": "sha512-nE+DGNwRzXOmp6ZwMQ1yUhbF7uR2wd3j6Xja/kVgGA7wSbqUeCZzqKZvhRsCqyay6PtHVlRRAhHP31Ob39+jtw==",
       "dependencies": {
         "@types/react": "*",
-        "@visx/group": "2.1.0",
-        "@visx/point": "2.1.0",
+        "@visx/group": "2.10.0",
+        "@visx/point": "2.6.0",
         "@visx/scale": "2.2.2",
-        "@visx/shape": "2.4.0",
-        "@visx/text": "2.3.0",
+        "@visx/shape": "2.12.2",
+        "@visx/text": "2.12.2",
         "classnames": "^2.3.1",
         "prop-types": "^15.6.0"
       },
       "peerDependencies": {
-        "react": "^16.3.0-0 || ^17.0.0-0"
+        "react": "^16.3.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/bounds": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/@visx/bounds/-/bounds-2.1.2.tgz",
-      "integrity": "sha512-O80K6PkDH//6xVDP3rSdd+9GNtBUMJKgVXh1ZjW8tAj/rtRq+GiyE17sB3uqV+btNkg0oJiVsFpmoLI50beJDQ==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/bounds/-/bounds-2.10.0.tgz",
+      "integrity": "sha512-rY7WFTIjQaXA8tFL45O2qbtSRkyF4yF75HiWz06F7BVmJ9UjF2qlomB3Y1z6gk6ZiFhwQ4zxABjOVjAQPLn7nQ==",
       "dependencies": {
         "@types/react": "*",
         "@types/react-dom": "*",
         "prop-types": "^15.5.10"
       },
       "peerDependencies": {
-        "react": "^16.0.0-0 || ^17.0.0-0",
-        "react-dom": "^16.0.0-0 || ^17.0.0-0"
+        "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0",
+        "react-dom": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/curve": {
@@ -5632,12 +5637,12 @@
       }
     },
     "node_modules/@visx/event": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/@visx/event/-/event-2.1.2.tgz",
-      "integrity": "sha512-x3gAQ9DB4zDA6qqGpzlpGacGuOtmzFi/m5Zq7BJ0OJ7PjNfkIazCsznc9epCT/g9IIhwhs+UN/Ijww4YnFHqHw==",
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@visx/event/-/event-2.6.0.tgz",
+      "integrity": "sha512-WGp91g82s727g3NAnENF1ppC3ZAlvWg+Y+GG0WFg34NmmOZbvPI/PTOqTqZE3x6B8EUn8NJiMxRjxIMbi+IvRw==",
       "dependencies": {
         "@types/react": "*",
-        "@visx/point": "2.1.0"
+        "@visx/point": "2.6.0"
       }
     },
     "node_modules/@visx/grid": {
@@ -5658,24 +5663,6 @@
         "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
-    "node_modules/@visx/grid/node_modules/@visx/group": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.10.0.tgz",
-      "integrity": "sha512-DNJDX71f65Et1+UgQvYlZbE66owYUAfcxTkC96Db6TnxV221VKI3T5l23UWbnMzwFBP9dR3PWUjjqhhF12N5pA==",
-      "dependencies": {
-        "@types/react": "*",
-        "classnames": "^2.3.1",
-        "prop-types": "^15.6.2"
-      },
-      "peerDependencies": {
-        "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0"
-      }
-    },
-    "node_modules/@visx/grid/node_modules/@visx/point": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.6.0.tgz",
-      "integrity": "sha512-amBi7yMz4S2VSchlPdliznN41TuES64506ySI22DeKQ+mc1s1+BudlpnY90sM1EIw4xnqbKmrghTTGfy6SVqvQ=="
-    },
     "node_modules/@visx/grid/node_modules/@visx/shape": {
       "version": "2.10.0",
       "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.10.0.tgz",
@@ -5707,51 +5694,51 @@
       }
     },
     "node_modules/@visx/group": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.1.0.tgz",
-      "integrity": "sha512-bZKa54yVjGYPZZhzYHLz4AVlidSr4ET9B/xmSa7nnictMJWr7e/IuZThB/bMfDQlgdtvhcfTgs+ZluySc5SBUg==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.10.0.tgz",
+      "integrity": "sha512-DNJDX71f65Et1+UgQvYlZbE66owYUAfcxTkC96Db6TnxV221VKI3T5l23UWbnMzwFBP9dR3PWUjjqhhF12N5pA==",
       "dependencies": {
         "@types/react": "*",
         "classnames": "^2.3.1",
         "prop-types": "^15.6.2"
       },
       "peerDependencies": {
-        "react": "^16.0.0-0 || ^17.0.0-0"
+        "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/legend": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@visx/legend/-/legend-2.2.2.tgz",
-      "integrity": "sha512-Pf77v3h12P5W2w5Iw1z+hucJVk19GOg+2R3N+O0SODDeaWg3pyN4eJMcs2LdYSfNWGkcejGu4G9Q/UUgjv7ihw==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/legend/-/legend-2.10.0.tgz",
+      "integrity": "sha512-OI8BYE6QQI9eXAng/C7UzuVw7d0fwlzrth6RmrdhlyT1K+BA3WpExapV+pDfwxu/tkEik8Ps5cZRV6HjX1/Mww==",
       "dependencies": {
         "@types/react": "*",
-        "@visx/group": "2.1.0",
+        "@visx/group": "2.10.0",
         "@visx/scale": "2.2.2",
         "classnames": "^2.3.1",
         "prop-types": "^15.5.10"
       },
       "peerDependencies": {
-        "react": "^16.3.0-0 || ^17.0.0-0"
+        "react": "^16.3.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/point": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.1.0.tgz",
-      "integrity": "sha512-vVnfI7oqjjttkn05Xi/ooR0UqQRoGf68lyT3SOl0WPHvIQBGNh3XoVUBHDr15/NUkfErgK6TNlfXY763YncPWg=="
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.6.0.tgz",
+      "integrity": "sha512-amBi7yMz4S2VSchlPdliznN41TuES64506ySI22DeKQ+mc1s1+BudlpnY90sM1EIw4xnqbKmrghTTGfy6SVqvQ=="
     },
     "node_modules/@visx/responsive": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@visx/responsive/-/responsive-2.4.1.tgz",
-      "integrity": "sha512-x5zPUmmsdVX/QaeDj9rLg3mGtNuiomBWUvwBo5oQs2KOtAFiviHx0NpLfY09h+p5gvkmGfTM+8gHEtVtIwLXPg==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/responsive/-/responsive-2.10.0.tgz",
+      "integrity": "sha512-NssDPpuUYp7hqVISuYkKZ5zk6ob0++RdTIaUjRcUdyFEbvzb9+zIb8QToOkvI90L2EC/MY4Jx0NpDbEe79GpAw==",
       "dependencies": {
+        "@juggle/resize-observer": "^3.3.1",
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
         "lodash": "^4.17.21",
-        "prop-types": "^15.6.1",
-        "resize-observer-polyfill": "1.5.1"
+        "prop-types": "^15.6.1"
       },
       "peerDependencies": {
-        "react": "^16.0.0-0 || ^17.0.0-0"
+        "react": "^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/scale": {
@@ -5776,16 +5763,16 @@
       }
     },
     "node_modules/@visx/shape": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.4.0.tgz",
-      "integrity": "sha512-D6XdGCgWi0/0ZKJ5iK8W5gILCKdrbDwnR/e7o6n/favLU0o+ntiI4a9PZBZ5bYS0aFNG7r+miGMcWV/AQfODuA==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.12.2.tgz",
+      "integrity": "sha512-4gN0fyHWYXiJ+Ck8VAazXX0i8TOnLJvOc5jZBnaJDVxgnSIfCjJn0+Nsy96l9Dy/bCMTh4DBYUBv9k+YICBUOA==",
       "dependencies": {
         "@types/d3-path": "^1.0.8",
         "@types/d3-shape": "^1.3.1",
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
         "@visx/curve": "2.1.0",
-        "@visx/group": "2.1.0",
+        "@visx/group": "2.10.0",
         "@visx/scale": "2.2.2",
         "classnames": "^2.3.1",
         "d3-path": "^1.0.5",
@@ -5794,7 +5781,7 @@
         "prop-types": "^15.5.10"
       },
       "peerDependencies": {
-        "react": "^16.3.0-0 || ^17.0.0-0"
+        "react": "^16.3.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/shape/node_modules/d3-shape": {
@@ -5806,9 +5793,9 @@
       }
     },
     "node_modules/@visx/text": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@visx/text/-/text-2.3.0.tgz",
-      "integrity": "sha512-5mEcmzWZqbziz6Azv+H6BWrnUbnpygAw4SNzBqF+YiGik5gR/USaBRAs9aKjnoUg6qFe3NZWFOcGpR3BzDR/bQ==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/text/-/text-2.12.2.tgz",
+      "integrity": "sha512-Sv9YEolggfv2Nf6+l28ESG3VXVR1+s4u/Cz17QpgOxygcbOM8LfLtriWtBsBMKdMbYKeUpoUro0clx55TUwzew==",
       "dependencies": {
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
@@ -5818,23 +5805,23 @@
         "reduce-css-calc": "^1.3.0"
       },
       "peerDependencies": {
-        "react": "^16.3.0-0 || ^17.0.0-0"
+        "react": "^16.3.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@visx/tooltip": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@visx/tooltip/-/tooltip-2.2.2.tgz",
-      "integrity": "sha512-wI0t+hE+gp7euuqI8likKBDsx70I+WJ6UJ9YCra8/LyyuVSbOobnLZlqQw1QhIYbdmnDReIckZ0dq3sa6z2qbw==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/tooltip/-/tooltip-2.10.0.tgz",
+      "integrity": "sha512-6Zrd79MIEfyuLBcZ1ypSeAkpQc8oLRNB7FQnegzl3Lje4LK5lJtuf5ST0mwK6G2Uv+GlOW9REJ6VK4gfAGkq9A==",
       "dependencies": {
         "@types/react": "*",
-        "@visx/bounds": "2.1.2",
+        "@visx/bounds": "2.10.0",
         "classnames": "^2.3.1",
         "prop-types": "^15.5.10",
         "react-use-measure": "^2.0.4"
       },
       "peerDependencies": {
-        "react": "^16.8.0-0 || ^17.0.0-0",
-        "react-dom": "^16.8.0-0 || ^17.0.0-0"
+        "react": "^16.8.0-0 || ^17.0.0-0 || ^18.0.0-0",
+        "react-dom": "^16.8.0-0 || ^17.0.0-0 || ^18.0.0-0"
       }
     },
     "node_modules/@webassemblyjs/ast": {
@@ -14944,9 +14931,9 @@
       }
     },
     "node_modules/math-expression-evaluator": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.3.8.tgz",
-      "integrity": "sha512-9FbRY3i6U+CbHgrdNbAUaisjWTozkm1ZfupYQJiZ87NtYHk2Zh9DvxMgp/fifxVhqTLpd5fCCLossUbpZxGeKw=="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.4.0.tgz",
+      "integrity": "sha512-4vRUvPyxdO8cWULGTh9dZWL2tZK6LDBvj+OGHBER7poH9Qdt7kXEoj20wiz4lQUbUXQZFjPbe5mVDo9nutizCw=="
     },
     "node_modules/media-typer": {
       "version": "0.3.0",
@@ -16848,7 +16835,7 @@
     "node_modules/reduce-css-calc": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
-      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=",
+      "integrity": "sha512-0dVfwYVOlf/LBA2ec4OwQ6p3X9mYxn/wOl2xTcLwjnPYrkgEfPx3VI4eGCH3rQLlPISG5v9I9bkZosKsNRTRKA==",
       "dependencies": {
         "balanced-match": "^0.4.2",
         "math-expression-evaluator": "^1.2.14",
@@ -16858,7 +16845,7 @@
     "node_modules/reduce-css-calc/node_modules/balanced-match": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
-      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+      "integrity": "sha512-STw03mQKnGUYtoNjmowo4F2cRmIIxYEGiMsjjwla/u5P1lxadj/05WkNaFjNiKTgJkj8KiXbgAiRTmcQRwQNtg=="
     },
     "node_modules/reduce-function-call": {
       "version": "1.0.3",
@@ -17163,11 +17150,6 @@
       "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
       "dev": true
     },
-    "node_modules/resize-observer-polyfill": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
-      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
-    },
     "node_modules/resolve": {
       "version": "1.22.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.0.tgz",
@@ -23496,6 +23478,11 @@
       "integrity": "sha512-CtzORUwWTTOTqfVtHaKRJ0I1kNQd1bpn3sUh8I3nJDVY+5/M/Oe1DnEWzPQvqq/xPIIkzzzIP7mfCoAjFRvDhg==",
       "dev": true
     },
+    "@juggle/resize-observer": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.3.1.tgz",
+      "integrity": "sha512-zMM9Ds+SawiUkakS7y94Ymqx+S0ORzpG3frZirN3l+UlXUmSUR7hF4wxCVqW+ei94JzV5kt0uXBcoOEAuiydrw=="
+    },
     "@leichtgewicht/ip-codec": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
@@ -24783,24 +24770,24 @@
       }
     },
     "@visx/axis": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/@visx/axis/-/axis-2.4.0.tgz",
-      "integrity": "sha512-5QA1Std1HSfBjVObulMW6gi2ZlBg9zuP8jUpgs1LL5tLWritla4T6cheEGLNa6Yuuy/DKzpHJUmNGBtpBGFEGw==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/axis/-/axis-2.12.2.tgz",
+      "integrity": "sha512-nE+DGNwRzXOmp6ZwMQ1yUhbF7uR2wd3j6Xja/kVgGA7wSbqUeCZzqKZvhRsCqyay6PtHVlRRAhHP31Ob39+jtw==",
       "requires": {
         "@types/react": "*",
-        "@visx/group": "2.1.0",
-        "@visx/point": "2.1.0",
+        "@visx/group": "2.10.0",
+        "@visx/point": "2.6.0",
         "@visx/scale": "2.2.2",
-        "@visx/shape": "2.4.0",
-        "@visx/text": "2.3.0",
+        "@visx/shape": "2.12.2",
+        "@visx/text": "2.12.2",
         "classnames": "^2.3.1",
         "prop-types": "^15.6.0"
       }
     },
     "@visx/bounds": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/@visx/bounds/-/bounds-2.1.2.tgz",
-      "integrity": "sha512-O80K6PkDH//6xVDP3rSdd+9GNtBUMJKgVXh1ZjW8tAj/rtRq+GiyE17sB3uqV+btNkg0oJiVsFpmoLI50beJDQ==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/bounds/-/bounds-2.10.0.tgz",
+      "integrity": "sha512-rY7WFTIjQaXA8tFL45O2qbtSRkyF4yF75HiWz06F7BVmJ9UjF2qlomB3Y1z6gk6ZiFhwQ4zxABjOVjAQPLn7nQ==",
       "requires": {
         "@types/react": "*",
         "@types/react-dom": "*",
@@ -24827,12 +24814,12 @@
       }
     },
     "@visx/event": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/@visx/event/-/event-2.1.2.tgz",
-      "integrity": "sha512-x3gAQ9DB4zDA6qqGpzlpGacGuOtmzFi/m5Zq7BJ0OJ7PjNfkIazCsznc9epCT/g9IIhwhs+UN/Ijww4YnFHqHw==",
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@visx/event/-/event-2.6.0.tgz",
+      "integrity": "sha512-WGp91g82s727g3NAnENF1ppC3ZAlvWg+Y+GG0WFg34NmmOZbvPI/PTOqTqZE3x6B8EUn8NJiMxRjxIMbi+IvRw==",
       "requires": {
         "@types/react": "*",
-        "@visx/point": "2.1.0"
+        "@visx/point": "2.6.0"
       }
     },
     "@visx/grid": {
@@ -24850,21 +24837,6 @@
         "prop-types": "^15.6.2"
       },
       "dependencies": {
-        "@visx/group": {
-          "version": "2.10.0",
-          "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.10.0.tgz",
-          "integrity": "sha512-DNJDX71f65Et1+UgQvYlZbE66owYUAfcxTkC96Db6TnxV221VKI3T5l23UWbnMzwFBP9dR3PWUjjqhhF12N5pA==",
-          "requires": {
-            "@types/react": "*",
-            "classnames": "^2.3.1",
-            "prop-types": "^15.6.2"
-          }
-        },
-        "@visx/point": {
-          "version": "2.6.0",
-          "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.6.0.tgz",
-          "integrity": "sha512-amBi7yMz4S2VSchlPdliznN41TuES64506ySI22DeKQ+mc1s1+BudlpnY90sM1EIw4xnqbKmrghTTGfy6SVqvQ=="
-        },
         "@visx/shape": {
           "version": "2.10.0",
           "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.10.0.tgz",
@@ -24895,9 +24867,9 @@
       }
     },
     "@visx/group": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.1.0.tgz",
-      "integrity": "sha512-bZKa54yVjGYPZZhzYHLz4AVlidSr4ET9B/xmSa7nnictMJWr7e/IuZThB/bMfDQlgdtvhcfTgs+ZluySc5SBUg==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/group/-/group-2.10.0.tgz",
+      "integrity": "sha512-DNJDX71f65Et1+UgQvYlZbE66owYUAfcxTkC96Db6TnxV221VKI3T5l23UWbnMzwFBP9dR3PWUjjqhhF12N5pA==",
       "requires": {
         "@types/react": "*",
         "classnames": "^2.3.1",
@@ -24905,32 +24877,32 @@
       }
     },
     "@visx/legend": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@visx/legend/-/legend-2.2.2.tgz",
-      "integrity": "sha512-Pf77v3h12P5W2w5Iw1z+hucJVk19GOg+2R3N+O0SODDeaWg3pyN4eJMcs2LdYSfNWGkcejGu4G9Q/UUgjv7ihw==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/legend/-/legend-2.10.0.tgz",
+      "integrity": "sha512-OI8BYE6QQI9eXAng/C7UzuVw7d0fwlzrth6RmrdhlyT1K+BA3WpExapV+pDfwxu/tkEik8Ps5cZRV6HjX1/Mww==",
       "requires": {
         "@types/react": "*",
-        "@visx/group": "2.1.0",
+        "@visx/group": "2.10.0",
         "@visx/scale": "2.2.2",
         "classnames": "^2.3.1",
         "prop-types": "^15.5.10"
       }
     },
     "@visx/point": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.1.0.tgz",
-      "integrity": "sha512-vVnfI7oqjjttkn05Xi/ooR0UqQRoGf68lyT3SOl0WPHvIQBGNh3XoVUBHDr15/NUkfErgK6TNlfXY763YncPWg=="
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@visx/point/-/point-2.6.0.tgz",
+      "integrity": "sha512-amBi7yMz4S2VSchlPdliznN41TuES64506ySI22DeKQ+mc1s1+BudlpnY90sM1EIw4xnqbKmrghTTGfy6SVqvQ=="
     },
     "@visx/responsive": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@visx/responsive/-/responsive-2.4.1.tgz",
-      "integrity": "sha512-x5zPUmmsdVX/QaeDj9rLg3mGtNuiomBWUvwBo5oQs2KOtAFiviHx0NpLfY09h+p5gvkmGfTM+8gHEtVtIwLXPg==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/responsive/-/responsive-2.10.0.tgz",
+      "integrity": "sha512-NssDPpuUYp7hqVISuYkKZ5zk6ob0++RdTIaUjRcUdyFEbvzb9+zIb8QToOkvI90L2EC/MY4Jx0NpDbEe79GpAw==",
       "requires": {
+        "@juggle/resize-observer": "^3.3.1",
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
         "lodash": "^4.17.21",
-        "prop-types": "^15.6.1",
-        "resize-observer-polyfill": "1.5.1"
+        "prop-types": "^15.6.1"
       }
     },
     "@visx/scale": {
@@ -24957,16 +24929,16 @@
       }
     },
     "@visx/shape": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.4.0.tgz",
-      "integrity": "sha512-D6XdGCgWi0/0ZKJ5iK8W5gILCKdrbDwnR/e7o6n/favLU0o+ntiI4a9PZBZ5bYS0aFNG7r+miGMcWV/AQfODuA==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/shape/-/shape-2.12.2.tgz",
+      "integrity": "sha512-4gN0fyHWYXiJ+Ck8VAazXX0i8TOnLJvOc5jZBnaJDVxgnSIfCjJn0+Nsy96l9Dy/bCMTh4DBYUBv9k+YICBUOA==",
       "requires": {
         "@types/d3-path": "^1.0.8",
         "@types/d3-shape": "^1.3.1",
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
         "@visx/curve": "2.1.0",
-        "@visx/group": "2.1.0",
+        "@visx/group": "2.10.0",
         "@visx/scale": "2.2.2",
         "classnames": "^2.3.1",
         "d3-path": "^1.0.5",
@@ -24986,9 +24958,9 @@
       }
     },
     "@visx/text": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@visx/text/-/text-2.3.0.tgz",
-      "integrity": "sha512-5mEcmzWZqbziz6Azv+H6BWrnUbnpygAw4SNzBqF+YiGik5gR/USaBRAs9aKjnoUg6qFe3NZWFOcGpR3BzDR/bQ==",
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/@visx/text/-/text-2.12.2.tgz",
+      "integrity": "sha512-Sv9YEolggfv2Nf6+l28ESG3VXVR1+s4u/Cz17QpgOxygcbOM8LfLtriWtBsBMKdMbYKeUpoUro0clx55TUwzew==",
       "requires": {
         "@types/lodash": "^4.14.172",
         "@types/react": "*",
@@ -24999,12 +24971,12 @@
       }
     },
     "@visx/tooltip": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@visx/tooltip/-/tooltip-2.2.2.tgz",
-      "integrity": "sha512-wI0t+hE+gp7euuqI8likKBDsx70I+WJ6UJ9YCra8/LyyuVSbOobnLZlqQw1QhIYbdmnDReIckZ0dq3sa6z2qbw==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/@visx/tooltip/-/tooltip-2.10.0.tgz",
+      "integrity": "sha512-6Zrd79MIEfyuLBcZ1ypSeAkpQc8oLRNB7FQnegzl3Lje4LK5lJtuf5ST0mwK6G2Uv+GlOW9REJ6VK4gfAGkq9A==",
       "requires": {
         "@types/react": "*",
-        "@visx/bounds": "2.1.2",
+        "@visx/bounds": "2.10.0",
         "classnames": "^2.3.1",
         "prop-types": "^15.5.10",
         "react-use-measure": "^2.0.4"
@@ -32310,9 +32282,9 @@
       }
     },
     "math-expression-evaluator": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.3.8.tgz",
-      "integrity": "sha512-9FbRY3i6U+CbHgrdNbAUaisjWTozkm1ZfupYQJiZ87NtYHk2Zh9DvxMgp/fifxVhqTLpd5fCCLossUbpZxGeKw=="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.4.0.tgz",
+      "integrity": "sha512-4vRUvPyxdO8cWULGTh9dZWL2tZK6LDBvj+OGHBER7poH9Qdt7kXEoj20wiz4lQUbUXQZFjPbe5mVDo9nutizCw=="
     },
     "media-typer": {
       "version": "0.3.0",
@@ -33809,7 +33781,7 @@
     "reduce-css-calc": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
-      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=",
+      "integrity": "sha512-0dVfwYVOlf/LBA2ec4OwQ6p3X9mYxn/wOl2xTcLwjnPYrkgEfPx3VI4eGCH3rQLlPISG5v9I9bkZosKsNRTRKA==",
       "requires": {
         "balanced-match": "^0.4.2",
         "math-expression-evaluator": "^1.2.14",
@@ -33819,7 +33791,7 @@
         "balanced-match": {
           "version": "0.4.2",
           "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
-          "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+          "integrity": "sha512-STw03mQKnGUYtoNjmowo4F2cRmIIxYEGiMsjjwla/u5P1lxadj/05WkNaFjNiKTgJkj8KiXbgAiRTmcQRwQNtg=="
         }
       }
     },
@@ -34069,11 +34041,6 @@
       "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
       "dev": true
     },
-    "resize-observer-polyfill": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
-      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
-    },
     "resolve": {
       "version": "1.22.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 2659a72497..e49b1651f8 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -22,15 +22,15 @@
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.6.0",
     "@lingui/react": "^3.13.0",
-    "@visx/axis": "^2.4.0",
-    "@visx/event": "^2.1.2",
+    "@visx/axis": "^2.10.0",
+    "@visx/event": "^2.6.0",
     "@visx/grid": "^2.10.0",
     "@visx/group": "^2.1.0",
-    "@visx/legend": "^2.2.2",
-    "@visx/responsive": "^2.4.1",
+    "@visx/legend": "^2.10.0",
+    "@visx/responsive": "^2.10.0",
     "@visx/scale": "^2.2.2",
     "@visx/shape": "^2.4.0",
-    "@visx/tooltip": "^2.2.2",
+    "@visx/tooltip": "^2.10.0",
     "body-parser": "^1.19.1",
     "d3": "^6.7.0",
     "dotenv": "^16.0.1",
diff --git a/frontend/src/dmarc/DmarcReportSummaryGraph.js b/frontend/src/dmarc/DmarcReportSummaryGraph.js
index b495024089..a0889d4dab 100644
--- a/frontend/src/dmarc/DmarcReportSummaryGraph.js
+++ b/frontend/src/dmarc/DmarcReportSummaryGraph.js
@@ -503,12 +503,17 @@ function HorizontalGraph({
                 isInline
                 align="center"
                 justifyContent="space-between"
+                bg={colorScale(label)}
+                px="2"
+                py="1"
               >
-                <Box color={colorScale(label)}>
-                  <Text fontWeight="bold">{strengths[label]}:</Text>
+                <Box color="white">
+                  <Text fontWeight="bold" variant="shadow">
+                    {strengths[label]}:
+                  </Text>
                 </Box>
-                <Box color={colorScale(label)}>
-                  <Text>
+                <Box color="white">
+                  <Text variant="shadow">
                     {formatLargeInt(tooltipData.bar.data[label])}
                     {keys[0] === percentageKeys[0] && <>%</>}
                   </Text>