classe et espece

src/pages/creation.astro

@@ -9,7 +9,7 @@ const personnages = await getCollection("personnages");
 const SPECTRUM = {
     // Encres (Classes) - Opacité 1.0
     martial: "rgba(230, 57, 70, 1)",
-    arcane: "rgba(0, 112, 255, 1)",
+    arcane: "rgba(147, 72, 255, 1)",
     divin: "rgba(200, 155, 60, 1)",
     primal: "rgba(42, 157, 143, 1)",
     hybride: "rgba(100, 100, 100, 1)",
@@ -220,6 +220,11 @@ const especeData = personnages.reduce((acc, p) => {
         flex-direction: column;
         justify-content: space-between;
         transition: all 0.3s ease;
+        box-shadow:
+            0 10px 25px -5px
+                color-mix(in srgb, var(--accent-color), transparent 80%),
+            0 8px 10px -6px
+                color-mix(in srgb, var(--accent-color), transparent 85%);
     }
     .dynamic-title {
         color: var(--accent-color) !important;
@@ -273,8 +278,8 @@ const especeData = personnages.reduce((acc, p) => {
         font-family: "Cinzel", serif;
         text-decoration: none;
         padding: 0.5rem 1rem;
-        border: 1px solid var(--accent-color);
         color: var(--accent-color);
+        background: color-mix(in srgb, var(--accent-color), transparent 50%);
         transition: all 0.3s;
     }
     .select-button:hover {