Fix build error: Remove unused Paper import from ControlPanel

Author: bloo-berries

src/components/AboutPage.tsx

@@ -9,6 +9,7 @@ import NavigationBar from './NavigationBar';
 import Footer from './Footer';
 
 const AboutPage: React.FC = () => {
+
   return (
     <>
       <NavigationBar />
@@ -90,27 +91,19 @@ const AboutPage: React.FC = () => {
               }}>
                 {/* Wistia Video Player */}
                 <Box 
+                  dangerouslySetInnerHTML={{
+                    __html: '<wistia-player media-id="qjdv24o4kb" aspect="2.6373626373626373"></wistia-player>'
+                  }}
                   sx={{ 
                     width: '100%',
                     borderRadius: '8px',
                     boxShadow: '0 4px 12px rgba(0, 0, 0, 0.15)',
                     overflow: 'hidden',
                     position: 'relative',
                     backgroundColor: '#000',
-                    minHeight: '300px',
-                    '& wistia-player': {
-                      width: '100%',
-                      height: '100%',
-                      display: 'block'
-                    }
+                    minHeight: '300px'
                   }}
-                >
-                  <wistia-player 
-                    media-id="qjdv24o4kb" 
-                    aspect="2.6373626373626373"
-                    style={{ width: '100%', height: '100%', display: 'block' }}
-                  />
-                </Box>
+                />
 
                 <Typography variant="body2" sx={{ 
                   textAlign: 'center', 

src/components/ControlPanel/ControlPanel.tsx

@@ -2,8 +2,7 @@ import React, { useState, useMemo, useCallback } from 'react';
 import {
   Box,
   Typography,
-  Button,
-  Paper
+  Button
 } from '@mui/material';
 import { VisualEffect } from '../../types/visualEffects';
 import { ControlPanelStyles } from './ControlPanelStyles';