Add mascot to error boundary, make it mobile "friendly"

src/components/ErrorBoundary.tsx

@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { useNavigate, useRouteError } from 'react-router-dom';
 
+import ShokoMascot from '@/../images/shoko_mascot.png';
 import Button from '@/components/Input/Button';
 import { useGetInitVersionQuery } from '@/core/rtkQuery/splitV3Api/initApi';
 import { usePostWebuiUpdateMutation } from '@/core/rtkQuery/splitV3Api/webuiApi';
@@ -28,11 +29,11 @@ const ErrorBoundary = () => {
   };
 
   return (
-    <div className="flex grow items-center justify-center p-8">
-      <div className="flex max-w-[56.4375rem] flex-col items-center gap-y-8">
-        <div className="text-7xl text-panel-text">Congratulations!</div>
-        <div className="text-5xl text-panel-text">You Broke The Web UI!</div>
-        <pre className="flex max-h-[25rem] max-w-full flex-col overflow-y-auto whitespace-pre-wrap rounded-lg border border-panel-border bg-panel-input p-8">
+    <div className="relative flex grow items-center justify-center overflow-hidden p-8">
+      <div className="z-20 flex h-full max-w-[56.4375rem] flex-col items-center justify-center gap-y-4 overflow-y-auto md:gap-y-8">
+        <div className="text-4xl text-panel-text md:text-7xl">Congratulations!</div>
+        <div className="text-2xl text-panel-text md:text-5xl">You Broke The Web UI!</div>
+        <pre className="flex max-h-[25rem] max-w-full flex-col overflow-y-auto whitespace-pre-wrap rounded-lg border border-panel-border bg-panel-input p-4 md:p-8">
           The information below is absolutely (maybe) useless!
           <br />
           <br />
@@ -60,7 +61,7 @@ const ErrorBoundary = () => {
             &nbsp;server and provide the above error.
           </div>
         </div>
-        <div className="flex gap-x-4">
+        <div className="flex flex-col gap-y-2 md:flex-row md:gap-x-4">
           <Button
             onClick={() => handleWebUiUpdate('Stable')}
             className="px-4 py-2 drop-shadow-md"
@@ -90,6 +91,12 @@ const ErrorBoundary = () => {
           </Button>
         </div>
       </div>
+
+      <img
+        src={ShokoMascot}
+        alt="mascot"
+        className="absolute -bottom-40 -right-36 z-10 opacity-30"
+      />
     </div>
   );
 };