cryp names are back

client/assets/styles/game.css

@@ -36,14 +36,20 @@
 
 .opponent .game-cryp {
     align-items: flex-start;
-    grid-template-rows: min-content min-content 2fr;
+    grid-template-rows: min-content min-content min-content 2fr;
     grid-template-columns: 1fr 1fr;
     grid-template-areas:
         "stats  stats"
+        "name   ."
         "effects effects"
         "avatar target";
 }
 
+.opponent .game-cryp .name {
+    margin-bottom: 0;
+    margin-top: 0.25em;
+}
+
 .game-cryp {
     display: grid;
 
@@ -54,10 +60,11 @@
     grid-template-rows: 1fr 2fr 1fr min-content;
     grid-template-columns: 1fr 1fr;
     grid-template-areas:
-        "skills ."
-        "avatar target"
-        "effects effects"
-        "stats  stats ";
+        "skills     ."
+        "avatar     target"
+        "effects    effects"
+        "name       ."
+        "stats      stats ";
 
     transition-property: all;
     transition-duration: 0.5s;
@@ -79,6 +86,13 @@
     grid-area: avatar;
 }
 
+.game-cryp .name {
+    width: 100%;
+    margin-bottom: 0.25em;
+    text-align: center;
+    grid-area: name;
+}
+
 .game-cryp .stats {
     grid-area: stats;
     display: flex;