mobile buttons

client/assets/styles/instance.css

@@ -3,7 +3,7 @@
 */
 
 .instance {
-    overflow: hidden;
+    overflow-x: hidden;
     display: grid;
     grid-template-columns: 1fr 1fr 1fr;
     grid-template-rows: min-content min-content min-content 1fr;
@@ -441,5 +441,4 @@ button.equipping {
 }
 
 /* Mobile Nav*/
-#toggle-vbox { display: none; }
-#toggle-vbox-label { display: none; }
+.instance .nav-btn { display: none; }

client/assets/styles/instance.mobile.css

@@ -9,6 +9,9 @@
             "vbox"
             "constructs"
     }
+
+    .instance .nav-btn { display: initial; }
+
     /* Default view */
     .instance .equip { display: none; }
     .instance .info { display: none; }
@@ -24,37 +27,21 @@
             "combiner";
     }
 
-    .vbox-inventory {
-        margin-left: 0;
+    /* constructs toggled on */
+    .instance.constructs-visible .vbox {
+        display: none;
     }
 
-    .vbox-combiner {
-        margin-left: 0;
-    }
-    /* Toggled view (constructs)*/
-    #toggle-vbox-label {
-        text-align: center;
-        border: 2px solid #555;
-     }
-     #toggle-vbox-label:after{
-        content: "Constructs";
-    }
-
-    #toggle-vbox:checked ~ #toggle-vbox-label:after{
-        content: "Vbox";
-    }
-
-    #toggle-vbox:checked ~ .vbox { display: none; }
-    #toggle-vbox:checked ~ .equip {
+    .instance.constructs-visible .equip {
         display: initial;
         grid-area: vbox;
     }
 
-    #toggle-vbox:checked ~ .highlight {
+    .instance.constructs-visible .highlight {
         display: initial;
     }
 
-    #toggle-vbox:checked ~ .construct-list {
+    .instance.constructs-visible .construct-list {
         grid-area: constructs;
         display: grid;
         justify-content: center;
@@ -63,16 +50,13 @@
         grid-template-rows: 1fr 1fr;
     }
 
-    #toggle-vbox { display: none; }
 
-    #toggle-vbox-label {
-        grid-area: controls;
-        color: whitesmoke;
-        line-height: 1.75em;
-        font-size: 1.5em;
-        display: block;
-        cursor: pointer;
-        margin-right: 0.5em;
+    .vbox-inventory {
+        margin-left: 0;
+    }
+
+    .vbox-combiner {
+        margin-left: 0;
     }
 
     .construct-list .skills {