Sandboxels v1.9

[Version 1.9 - October 13, 2023 - Local Saves]
    + Local Saves
        + SAVES button
        + Save the scene to 1 of 12 slots
        + Save the scene to a file
        + Load a scene from a file
        + Saves include a ton of information, even your selected element!
        + Choose to include your settings or mods
        + Drag & Drop or Paste a save file
    + Pumpkin
        + Fireproof solid for carving activities
    + Pumpkin Seed
        + Will grow when planted on soil!
    ~ Thermal View now uses a more useful logarithmic scale
   [Changes]
    + Resetting now adjusts canvas size if needed
    + Dot appears in center of cursor
    + E-cloner can select an element while unpowered
    + E-cloner ignores Wires and E-walls
    + Grass can spread on Sand, Clay, and Mycelium
    + Tree roots can grow through Clay
    ~ Sap no longer mixes with Sawdust
    + Plant and Sauce remove Stench
    + Humans break Eggs, Grapes, and bugs when on top of them
    + Humans can trample Grass
    + Termites can eat Confetti, Straw, and Wheat
    + Fleas can eat Hair
    + Ants can eat Honey
    + Snails can eat Calcium, Limestone, and Paper
    + Worms can infect and swim in Blood
    + Worms are killed by Antibodies
    + Eggs die at high temperatures
    + Bugs will form Amber when touching Sap
    ~ Frogs and Fish burn slower
    + Uranium dirties Salt Water
    + Radiation can dirty Ice
    + Blood is infected by Rotten Meat and Rotten Cheese
    + Vinegar and Limestone reaction
    + Ketchup slowly deoxidizes Rust
    ~ Charcoal leaves behind Ash and less CO₂
    ~ C4 no longer explodes when burnt
    + C4 releases poisonous fumes when burnt
    + C4 burns longer, can be used as fuel
    + C4 explodes when broken
    + Fireworks ignite at high temperatures
    + Dye dissolves in Pool Water
    + Ink slowly dissolves in Water
    + Honey dissolves in Tea
    + Molten Salt conducts electricity
    + Hair can be made by radiating Skin
    + Skin can absorb Soap
    + Proton and Electric reaction generates heat
    + Positron and Electric reaction generates Light
    + Escape key resets to Normal View
    ~ Recolored Tuff
    ~ Recolored Blood
    ~ Selected element outline is more clear
    ~ Improved button readability
    ~ Improved canvas pixel sharpness
    + Pressing - or + button centers the cursor
    ~ Step button is now an arrow
    + Clear Saves setting
   [Bug Fixes]
    ~ Fixed: Fireworks and Flash don't transfer heat
    ~ Fixed: Flash from Heat Ray is not hot
    ~ Fixed: Alcohol Gas density too high
    ~ Fixed: Pistil and Mushroom Gill can be dragged
    ~ Fixed: Herb can't be mixed in Batter or Dough
    ~ Fixed: Amber spawns at high temperature
    ~ Fixed: Heads can detach if Body moves during reaction
    ~ Fixed: Many Flour reactions make Gingerbread instead of Dough
    ~ Fixed: Ghost pixels when burning Plague, other deleting gases
    ~ Fixed: Color picker always appears when toggling GUI on (F1)
    ~ Fixed: Cooldowned elements can't be placed before 8th tick
    ~ Fixed: Frozen Fish break into Slime
   [Technical]
    + logMessage() function
    + SOIL eList
    + generateSave() and loadSave() functions
    + resizeCanvas() and autoResizeCanvas() functions
    + sb1 save format
    ~ Browser dark color scheme for UI elements
    ~ Light, Laser, etc. use bx/by instead of vx/vy (velocity.js fix)

changelog.html

@@ -89,6 +89,10 @@
         #intro {
             font-family: Arial, Helvetica, sans-serif;
         }
+        .indent {
+            display: inline-block;
+            width: 1em;
+        }
     </style>
 </head>
 
@@ -105,6 +109,92 @@
 <p>The original <a href="https://sandboxels.r74n.com/changelog.txt">plain text version</a> of this is still maintained.</p>
 </div>
 
+<h2 id="1.9">[Version 1.9 - October 13, 2023 - Local Saves]</h2>
+<ul>
+<li>+ Local Saves</li>
+<li>    + SAVES button</li>
+<li>    + Save the scene to 1 of 12 slots</li>
+<li>    + Save the scene to a file</li>
+<li>    + Load a scene from a file</li>
+<li>    + Saves include a ton of information, even your selected element!</li>
+<li>    + Choose to include your settings or mods</li>
+<li>    + Drag & Drop or Paste a save file</li>
+<li>+ Pumpkin</li>
+<li>    + Fireproof solid for carving activities</li>
+<li>+ Pumpkin Seed</li>
+<li>    + Will grow when planted on soil!</li>
+<li>~ Thermal View now uses a more useful logarithmic scale</li>
+<li>[Changes]</li>
+<li>+ Resetting now adjusts canvas size if needed</li>
+<li>+ Dot appears in center of cursor</li>
+<li>+ E-cloner can select an element while unpowered</li>
+<li>+ E-cloner ignores Wires and E-walls</li>
+<li>+ Grass can spread on Sand, Clay, and Mycelium</li>
+<li>+ Tree roots can grow through Clay</li>
+<li>~ Sap no longer mixes with Sawdust</li>
+<li>+ Plant and Sauce remove Stench</li>
+<li>+ Humans break Eggs, Grapes, and bugs when on top of them</li>
+<li>+ Humans can trample Grass</li>
+<li>+ Termites can eat Confetti, Straw, and Wheat</li>
+<li>+ Fleas can eat Hair</li>
+<li>+ Ants can eat Honey</li>
+<li>+ Snails can eat Calcium, Limestone, and Paper</li>
+<li>+ Worms can infect and swim in Blood</li>
+<li>+ Worms are killed by Antibodies</li>
+<li>+ Eggs die at high temperatures</li>
+<li>+ Bugs will form Amber when touching Sap</li>
+<li>~ Frogs and Fish burn slower</li>
+<li>+ Uranium dirties Salt Water</li>
+<li>+ Radiation can dirty Ice</li>
+<li>+ Blood is infected by Rotten Meat and Rotten Cheese</li>
+<li>+ Vinegar and Limestone reaction</li>
+<li>+ Ketchup slowly deoxidizes Rust</li>
+<li>~ Charcoal leaves behind Ash and less CO₂</li>
+<li>~ C4 no longer explodes when burnt</li>
+<li>+ C4 releases poisonous fumes when burnt</li>
+<li>+ C4 burns longer, can be used as fuel</li>
+<li>+ C4 explodes when broken</li>
+<li>+ Fireworks ignite at high temperatures</li>
+<li>+ Dye dissolves in Pool Water</li>
+<li>+ Ink slowly dissolves in Water</li>
+<li>+ Honey dissolves in Tea</li>
+<li>+ Molten Salt conducts electricity</li>
+<li>+ Hair can be made by radiating Skin</li>
+<li>+ Skin can absorb Soap</li>
+<li>+ Proton and Electric reaction generates heat</li>
+<li>+ Positron and Electric reaction generates Light</li>
+<li>+ Escape key resets to Normal View</li>
+<li>~ Recolored Tuff</li>
+<li>~ Recolored Blood</li>
+<li>~ Selected element outline is more clear</li>
+<li>~ Improved button readability</li>
+<li>~ Improved canvas pixel sharpness</li>
+<li>+ Pressing - or + button centers the cursor</li>
+<li>~ Step button is now an arrow</li>
+<li>+ Clear Saves setting</li>
+<li>[Bug Fixes]</li>
+<li>~ Fixed: Fireworks and Flash don't transfer heat</li>
+<li>~ Fixed: Flash from Heat Ray is not hot</li>
+<li>~ Fixed: Alcohol Gas density too high</li>
+<li>~ Fixed: Pistil and Mushroom Gill can be dragged</li>
+<li>~ Fixed: Herb can't be mixed in Batter or Dough</li>
+<li>~ Fixed: Amber spawns at high temperature</li>
+<li>~ Fixed: Heads can detach if Body moves during reaction</li>
+<li>~ Fixed: Many Flour reactions make Gingerbread instead of Dough</li>
+<li>~ Fixed: Ghost pixels when burning Plague, other deleting gases</li>
+<li>~ Fixed: Color picker always appears when toggling GUI on (F1)</li>
+<li>~ Fixed: Cooldowned elements can't be placed before 8th tick</li>
+<li>~ Fixed: Frozen Fish break into Slime</li>
+<li>[Technical]</li>
+<li>+ logMessage() function</li>
+<li>+ SOIL eList</li>
+<li>+ generateSave() and loadSave() functions</li>
+<li>+ resizeCanvas() and autoResizeCanvas() functions</li>
+<li>+ sb1 save format</li>
+<li>~ Browser dark color scheme for UI elements</li>
+<li>~ Light, Laser, etc. use bx/by instead of vx/vy (velocity.js fix)</li>
+</ul>
+
 <h2 id="1.8.6">[Version 1.8.6 - August 21, 2023 - Reaction Overload]</h2>
 <ul>
 <li>+ Tomato</li>
@@ -1578,6 +1668,7 @@
     changelog.innerHTML = changelog.innerHTML.replaceAll("<li>+","<li class='ad'>");
     changelog.innerHTML = changelog.innerHTML.replaceAll("<li>-","<li class='rm'>");
     changelog.innerHTML = changelog.innerHTML.replaceAll("<li>~","<li class='ch'>");
+    changelog.innerHTML = changelog.innerHTML.replaceAll(">   ","><span class='indent'></span>");
     changelog.innerHTML = changelog.innerHTML.replaceAll("<li>[","<li class='update-section'>[");
 </script>
 

changelog.txt

@@ -7,6 +7,90 @@ See sneak peaks for upcoming updates on the Discord: https://discord.gg/ejUc6YPQ
 
 A fancier version of this changelog can be found here: https://sandboxels.R74n.com/changelog
 
+[Version 1.9 - October 13, 2023 - Local Saves]
+    + Local Saves
+        + SAVES button
+        + Save the scene to 1 of 12 slots
+        + Save the scene to a file
+        + Load a scene from a file
+        + Saves include a ton of information, even your selected element!
+        + Choose to include your settings or mods
+        + Drag & Drop or Paste a save file
+    + Pumpkin
+        + Fireproof solid for carving activities
+    + Pumpkin Seed
+        + Will grow when planted on soil!
+    ~ Thermal View now uses a more useful logarithmic scale
+   [Changes]
+    + Resetting now adjusts canvas size if needed
+    + Dot appears in center of cursor
+    + E-cloner can select an element while unpowered
+    + E-cloner ignores Wires and E-walls
+    + Grass can spread on Sand, Clay, and Mycelium
+    + Tree roots can grow through Clay
+    ~ Sap no longer mixes with Sawdust
+    + Plant and Sauce remove Stench
+    + Humans break Eggs, Grapes, and bugs when on top of them
+    + Humans can trample Grass
+    + Termites can eat Confetti, Straw, and Wheat
+    + Fleas can eat Hair
+    + Ants can eat Honey
+    + Snails can eat Calcium, Limestone, and Paper
+    + Worms can infect and swim in Blood
+    + Worms are killed by Antibodies
+    + Eggs die at high temperatures
+    + Bugs will form Amber when touching Sap
+    ~ Frogs and Fish burn slower
+    + Uranium dirties Salt Water
+    + Radiation can dirty Ice
+    + Blood is infected by Rotten Meat and Rotten Cheese
+    + Vinegar and Limestone reaction
+    + Ketchup slowly deoxidizes Rust
+    ~ Charcoal leaves behind Ash and less CO₂
+    ~ C4 no longer explodes when burnt
+    + C4 releases poisonous fumes when burnt
+    + C4 burns longer, can be used as fuel
+    + C4 explodes when broken
+    + Fireworks ignite at high temperatures
+    + Dye dissolves in Pool Water
+    + Ink slowly dissolves in Water
+    + Honey dissolves in Tea
+    + Molten Salt conducts electricity
+    + Hair can be made by radiating Skin
+    + Skin can absorb Soap
+    + Proton and Electric reaction generates heat
+    + Positron and Electric reaction generates Light
+    + Escape key resets to Normal View
+    ~ Recolored Tuff
+    ~ Recolored Blood
+    ~ Selected element outline is more clear
+    ~ Improved button readability
+    ~ Improved canvas pixel sharpness
+    + Pressing - or + button centers the cursor
+    ~ Step button is now an arrow
+    + Clear Saves setting
+   [Bug Fixes]
+    ~ Fixed: Fireworks and Flash don't transfer heat
+    ~ Fixed: Flash from Heat Ray is not hot
+    ~ Fixed: Alcohol Gas density too high
+    ~ Fixed: Pistil and Mushroom Gill can be dragged
+    ~ Fixed: Herb can't be mixed in Batter or Dough
+    ~ Fixed: Amber spawns at high temperature
+    ~ Fixed: Heads can detach if Body moves during reaction
+    ~ Fixed: Many Flour reactions make Gingerbread instead of Dough
+    ~ Fixed: Ghost pixels when burning Plague, other deleting gases
+    ~ Fixed: Color picker always appears when toggling GUI on (F1)
+    ~ Fixed: Cooldowned elements can't be placed before 8th tick
+    ~ Fixed: Frozen Fish break into Slime
+   [Technical]
+    + logMessage() function
+    + SOIL eList
+    + generateSave() and loadSave() functions
+    + resizeCanvas() and autoResizeCanvas() functions
+    + sb1 save format
+    ~ Browser dark color scheme for UI elements
+    ~ Light, Laser, etc. use bx/by instead of vx/vy (velocity.js fix)
+
 [Version 1.8.6 - August 21, 2023 - Reaction Overload]
     + Tomato
     + Sauce

controls.html

@@ -91,6 +91,7 @@
     <tr><td>Select by name</td>   <td><kbd>E</kbd></td></tr>
     <tr><td>Element info</td>   <td><kbd>I</kbd> or <kbd>/</kbd></td></tr>
     <tr><td>Open settings</td>   <td><kbd>\</kbd></td></tr>
+    <tr><td>Open saves</td>   <td><kbd>L</kbd></td></tr>
     <tr><td>Open Mod Manager</td>   <td><kbd>M</kbd></td></tr>
     <tr><td>Reset canvas</td>   <td><kbd>R</kbd></td></tr>
     <tr><td>Single step</td>   <td><kbd>&gt;</kbd></td></tr>
@@ -101,14 +102,14 @@
     <tr><td>Smooth view (Low performance)</td>   <td><kbd>4</kbd></td></tr>
     <tr><td>Toggle GUI</td>   <td><kbd>F1</kbd></td></tr>
     <tr><td>Capture screenshot</td>   <td><kbd>C</kbd> or <kbd>F2</kbd></td></tr>
-    <tr><td>Paste Image</td>   <td><kbd>Ctrl</kbd> + <kbd>V</kbd> or Drag and Drop</td></tr>
+    <tr><td>Paste Image or Load Save File</td>   <td><kbd>Ctrl</kbd> + <kbd>V</kbd> or <kbd>Drag & Drop</kbd></td></tr>
 </table>
 
 <h2>Button Info</h2>
 <table>
     <thead><tr><th>Button</th><th>Function</th></tr></thead>
     <tr><td>Pause</td>   <td>Pause/play the simulation</tr>
-    <tr><td>Step</td>   <td>Run a single frame of simulation</tr>
+    <tr><td>Step (>)</td>   <td>Run a single frame of simulation</tr>
     <tr><td>Minus (-)</td>   <td>Decrease the cursor size</tr>
     <tr><td>Plus (+)</td>   <td>Increase the cursor size</tr>
     <tr><td>Reset</td>   <td>Clear the entire canvas</tr>

controls.txt

@@ -19,6 +19,7 @@ Left/Right Arrow  =  Change Category
 E                 =  Element Selection
 / or I            =  Element Info Screen
 \                 =  Settings Menu
+L                 =  Save & Load Menu
 M                 =  Mod Manager
 R                 =  Reset Canvas
 >                 =  Step
@@ -29,12 +30,14 @@ F or F11          =  Toggle Fullscreen
 4                 =  Smooth View
 F1                =  Toggle GUI / HUD
 F2 or C           =  Capture Screenshot
+Drag & Drop       =  Insert an image or load save file
+Paste             =  Insert an image or load save file
 
 (Alt/Option can be used in place of Shift)
 
 [Button Info]
 Pause           =  Pause/play the simulation
-Step            =  Run a single frame of simulation
+>               =  Run a single frame of simulation
 Minus           =  Decrease the cursor size
 Plus            =  Increase the cursor size
 Reset           =  Clear the entire simulation

mods/classic_textures.js

@@ -137,3 +137,7 @@ if (elements.mushroom_gill) {
 if (elements.slaked_lime) {elements.slaked_lime.color = "#adb8b5";}
 if (elements.lead) {elements.lead.color = "#6c6c6a";}
 if (elements.drag) {elements.drag.color = "#ffffff";}
+if (elements.tuff) {elements.tuff.color = ["#A16A49","#C98256","#C7834F","#BF7640","#DB8641","#D1732C","#AF5D30","#A55E35","#8B5B4C"];}
+if (elements.blood) {elements.blood.color = "#ff0000";}
+if (elements.antibody) {elements.antibody.color = "#ff4040";}
+if (elements.infection) {elements.infection.color = "#cf005d";}

mods/velocity.js

@@ -20,7 +20,7 @@ doVelocity = function(pixel) {
                     pixel.vx = 0;
                 }
             }
-            if (pixel.vx) { pixel.vx -= Math.sign(pixel.vx); }
+            if (pixel.vx) { pixel.vx = Math.floor(Math.abs(pixel.vx)/1.25)*Math.sign(pixel.vx) }
         }
         if (pixel.vy) {
             // move the pixel vy times
@@ -41,7 +41,7 @@ doVelocity = function(pixel) {
                     return;
                 }
             }
-            if (pixel.vy) { pixel.vy -= Math.sign(pixel.vy); }
+            if (pixel.vy) { pixel.vy = Math.floor(Math.abs(pixel.vy)/1.25)*Math.sign(pixel.vy) }
         }
     }
 }
@@ -72,25 +72,16 @@ drawPixels = function(forceTick=false) {
                 pixelTick(pixel);
             }
         };
-        if (elements[pixel.element].isGas) {
+        if (elements[pixel.element].isGas || elements[pixel.element].glow) {
             pixelsLast.push(pixel);
         }
         else {
             pixelsFirst.push(pixel);
         }
     }
-    adjacentCoords = [
-        [0,1],
-        [0,-1],
-        [1,0],
-        [-1,0]
-    ];
-    biCoords = [
-        [0,1],
-        [1,0]
-    ];
     // Draw the current pixels
     var canvas = document.getElementById("game");
+    if (canvas === null) {return}
     var ctx = canvas.getContext("2d");
     var pixelDrawList = pixelsFirst.concat(pixelsLast);
     for (var i = 0; i < pixelDrawList.length; i++) {
@@ -100,11 +91,11 @@ drawPixels = function(forceTick=false) {
             ctx.fillStyle = pixel.color;
         }
         else if (view === 2) { // thermal view
-            // set the color to pixel.temp, from hottest at 0 hue to coldest 225 hue, with the minimum being -273, max being 6000
             var temp = pixel.temp;
-            if (temp < -273) {temp = -273}
+            if (temp < -50) {temp = -50}
             if (temp > 6000) {temp = 6000}
-            var hue = 225 - (temp/6000)*225;
+            // logarithmic scale, with coldest being 225 (-50 degrees) and hottest being 0 (6000 degrees)
+            var hue = Math.round(225 - (Math.log(temp+50)/Math.log(6000+50))*225);
             if (hue < 0) {hue = 0}
             if (hue > 225) {hue = 225}
             ctx.fillStyle = "hsl("+hue+",100%,50%)";
@@ -128,11 +119,13 @@ drawPixels = function(forceTick=false) {
                 ctx.fillStyle = averageRGB(colorlist);
             }
         }
-        if ((view === null || view === 4) && elements[pixel.element].state === "gas") {
+        if (ctx.globalAlpha < 1 && !(elements[pixel.element].isGas || elements[pixel.element].glow)) {
-            ctx.globalAlpha = 0.5;
+            ctx.globalAlpha = 1;
+        }
+        if ((view === null || view === 4) && (elements[pixel.element].isGas || elements[pixel.element].glow)) {
+            if (ctx.globalAlpha!==0.5) { ctx.globalAlpha = 0.5; }
             ctx.fillRect((pixel.x-1)*pixelSize, (pixel.y)*pixelSize, pixelSize*3, pixelSize);
             ctx.fillRect((pixel.x)*pixelSize, (pixel.y-1)*pixelSize, pixelSize, pixelSize*3);
-            ctx.globalAlpha = 1;
         }
         else { // draw the pixel (default)
             ctx.fillRect(pixel.x*pixelSize, pixel.y*pixelSize, pixelSize, pixelSize);
@@ -144,6 +137,9 @@ drawPixels = function(forceTick=false) {
             }
         }
     }
+    if (ctx.globalAlpha < 1) {
+        ctx.globalAlpha = 1;
+    }
     if ((!paused) || forceTick) {pixelTicks++};
 }
 

style.css

@@ -22,14 +22,12 @@ body {
     top: 0;
     left: 0;
 }
-a {color: rgb(255, 0, 255);text-decoration: none;}
+a, .saveOption {color: rgb(255, 0, 255);text-decoration: none;}
-a:hover {filter: brightness(200%);}
+a:hover, .saveOption:hover {filter: brightness(200%);}
-a:active, a:hover:active {filter: brightness(275%);}
+a:active, a:hover:active, .saveOption:active, .saveOption:hover:active {filter: brightness(275%);}
 #gameDiv { /*game canvas*/
     border: 1px solid #ffffff;
     position: relative;
-    left: 50%;
-    transform: translate(-50%, -0%);
     -webkit-touch-callout: none; /* iOS Safari */
     -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
@@ -38,6 +36,9 @@ a:active, a:hover:active {filter: brightness(275%);}
     user-select: none;
     margin-top: 15px;
 }
+#game {
+    image-rendering: pixelated;
+}
 #bottomInfoBox { /* place under the game canvas */
     margin: 1.5em 50px 0px 50px;
     font-family: 'Arial';
@@ -106,7 +107,7 @@ kbd {
 #settingsMenu {
     height: 75%;
 }
-#infoSearch, #modManagerUrl {
+#infoSearch, #modManagerUrl, #saveButtons {
     position: absolute;
     bottom: 59.4%;
     width: 95%;
@@ -188,6 +189,54 @@ kbd {
     cursor: pointer;
     text-decoration: underline;
 }
+.saveSlot {
+    display: block;
+    border-top: solid gray;
+    padding-top: 1em;
+    padding-bottom: 1em;
+    padding-left: 1em;
+}
+.saveSlot:last-child {
+    border-bottom: solid gray;
+}
+.saveOption {
+    float: right;
+    padding-left: 2em;
+    padding-right: 1em;
+    color: #ff00ff;
+    cursor: pointer;
+}
+.saveOption:first-child {
+    padding-right: 2em;
+}
+.saveOption[disabled="true"] {
+    color: gray;
+    cursor: not-allowed;
+}
+#saveFile, #loadFile, #saveConfirm {
+    background-color: black;
+    text-align: center;
+    vertical-align: middle;
+    height: 3em;
+    line-height: 3em;
+    position:absolute;
+    bottom: 0;
+    cursor: pointer;
+    border-top: solid white;
+}
+#saveFile {
+    left: 0;
+    width: 50%;
+}
+#loadFile {
+    right: 0;
+    width: 50%;
+    border-left: solid white;
+}
+#saveConfirm {
+    left: 0;
+    width: 100%;
+}
 button, input[type="submit"], input[type="reset"] {
     background: none;
     color: inherit;
@@ -212,14 +261,14 @@ button, input[type="submit"], input[type="reset"] {
     border-radius: 5px;
     font-size: 1em;
     text-shadow: 0.5px 1px 4px #000000;
-    color: rgba(255, 255, 255, 0.75);
+    color: rgba(255, 255, 255, 0.85);
     border: 1px solid #797979;
     margin: 0px 5px 5px 5px;
     font-variant: small-caps;
 }
 #controls button.bright {
     text-shadow: 0.5px 1px 4px #ffffff;
-    color: rgba(0, 0, 0, 0.75);   
+    color: rgba(0, 0, 0, 0.85);   
 }
 /*Darken when active*/
 #controls button:active, #controls button:active:hover {
@@ -237,6 +286,10 @@ button, input[type="submit"], input[type="reset"] {
     box-shadow: 0 5px 15px rgba(255, 255, 255, .4);
     color: rgba(255, 255, 255, 1);
 }
+#controls .elementButton[current="true"] {
+    border: 1px solid #00ff00;
+    box-shadow: 0px 1px 15px rgba(0, 255, 0, .75);
+}
 #controls button.bright[current="true"] {
     color: rgba(0, 0, 0, 1);
 }
@@ -303,7 +356,11 @@ button, input[type="submit"], input[type="reset"] {
     }
 }
 @media screen and (min-width: 800px) { /* Desktop-Only Styles */
-    #gameDiv { width:800px }
+    #gameDiv {
+        width:800px;
+        left: 50%;
+        transform: translate(-50%, -0%);
+    }
 }
 /* screen size > 1325px, h1::after {content:" Sandboxels"} */
 @media screen and (min-width: 1325px) {
@@ -408,8 +465,9 @@ button, input[type="submit"], input[type="reset"] {
 }
 button, input { /*Disable double tap zoom on mobile devices*/
     touch-action: manipulation;
+    color-scheme: dark;
 }
-select, .toggleInput, #settingsMenu input[type="number"], #settingsMenu input[type="text"] {
+select, .toggleInput, #settingsMenu input[type="number"], #settingsMenu input[type="text"], #savePromptMenu input {
     background-color: black;
     vertical-align: middle;
     margin-left: 5px;
@@ -421,14 +479,14 @@ select, .toggleInput, #settingsMenu input[type="number"], #settingsMenu input[ty
     font-size: 1em;
     font-family: Arial, Helvetica, sans-serif;
 }
-.toggleInput {
+#settingsMenu .toggleInput {
     display: inline-block;
     width: 4em;
     text-align: center;
-    cursor: pointer;
 }
-.toggleInput[state="1"] {color: lime;}
+.toggleInput { cursor: pointer; }
-.toggleInput[state="0"] {color: red;}
+.toggleInput[state="1"] {color: lime!important;}
+.toggleInput[state="0"] {color: red!important;}
 #settingsMenu input[type="number"] {
     width: 3em;
 }
@@ -484,3 +542,11 @@ select, .toggleInput, #settingsMenu input[type="number"], #settingsMenu input[ty
     margin-right:10px;
     padding-bottom: 10px;
 }
+#logDiv {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    pointer-events: none;
+    padding: 5px;
+    white-space: pre-wrap;
+}