Add media pesata page and corresponding styles

- Created a new page for calculating weighted averages and graduation votes (`media-pesata.astro`) with a layout and introductory text.
- Implemented a script to initialize the media pesata application.
- Added CSS styles for the media pesata page and its components.
- Updated existing media page (`media.astro`) to include similar structure and functionality.
- Introduced error handling for the application initialization script.
- Established a comprehensive CSS file for the media pesata application, including styles for various UI elements and responsive design.

src/pages/media-pesata.astro

@@ -0,0 +1,42 @@
+---
+import '@/styles/pages/media-pesata.css'
+import PageLayout from '../layouts/PageLayout.astro'
+---
+
+<PageLayout title="Voto Laurea" description="Calcola la tua media pesata e il voto di laurea seguendo le regole del dipartimento">
+    <div class="media-pesata-container">
+        <h1>Calcolo Media e Voto di Laurea</h1>
+        <p>Calcola la tua media pesata e il voto con cui ti siederai alla discussione di laurea, seguendo le regole del dipartimento di Matematica.</p>
+
+        <div id="media-pesata-app"></div>
+    </div>
+</PageLayout>
+
+<script>
+    // Importiamo e inizializziamo l'applicazione
+    import('../client/MediaPesataApp')
+        .then(module => {
+            const { initMediaPesataApp } = module
+            initMediaPesataApp()
+        })
+</script>
+
+<style>
+    .media-pesata-container {
+        max-width: 1200px;
+        margin: 0 auto;
+        padding: 2rem;
+    }
+
+    h1 {
+        text-align: center;
+        margin-bottom: 1rem;
+        color: var(--color-primary);
+    }
+
+    p {
+        text-align: center;
+        margin-bottom: 2rem;
+        color: var(--color-text-secondary);
+    }
+</style>

src/pages/media.astro

@@ -0,0 +1,49 @@
+---
+import '@/styles/pages/media-pesata.css'
+import PageLayout from '../layouts/PageLayout.astro'
+---
+
+<PageLayout title="Voto Laurea" description="Calcola la tua media pesata e il voto di laurea seguendo le regole del dipartimento">
+    <div class="media-pesata-container">
+        <h1>Voto Laurea</h1>
+        <p>Calcola la tua media pesata e il voto con cui ti siederai alla discussione di laurea, seguendo le regole del dipartimento di Matematica.</p>
+
+        <div id="media-pesata-app"></div>
+    </div>
+</PageLayout>
+
+<script>
+    // Importiamo e inizializziamo l'applicazione
+    import('../client/MediaPesataApp')
+        .then(module => {
+            const { initMediaPesataApp } = module
+            initMediaPesataApp()
+        })
+        .catch(error => {
+            console.error('Errore nel caricamento dell\'applicazione:', error)
+        })
+</script>
+
+<style>
+    .media-pesata-container {
+        max-width: 1200px;
+        margin: 0 auto;
+        padding: 2rem;
+    }
+
+    .media-pesata-container h1 {
+        text-align: center;
+        color: var(--palette-black);
+        margin-bottom: 1rem;
+        font-family: var(--font-display);
+        font-weight: 700;
+        font-size: 2.5rem;
+    }
+
+    .media-pesata-container p {
+        text-align: center;
+        color: #666;
+        margin-bottom: 2rem;
+        font-size: 1.1rem;
+    }
+</style>