Fix alignment of radio options; add tooltips

features.js

@@ -646,7 +646,6 @@ options = [
         "type": "radio",
         "id": "difficulty",
         "default": "0",
-        "tooltip": "Grow how you want, when you want.",
         "choices":
         [
           {
@@ -782,22 +781,26 @@ options = [
         [
           {
             "name": "Non-fatal",
-            "value": "0"
+            "value": "0",
+            "tooltip": "All actions are explicitly safe."
           },
           {
             "name": "Fatal",
             "value": "1",
-            "warning": "Fatal actions are enabled"
+            "warning": "Fatal actions are enabled",
+            "tooltip": "Actions can have fatal consequences, but don't go into detail."
           },
           {
             "name": "Gory",
             "value": "2",
-            "warning": "Gory actions are enabled"
+            "warning": "Gory actions are enabled",
+            "tooltip": "Descriptions are violent, but not excessively so."
           },
           {
             "name": "Sadistic",
             "value": "3",
-            "warning": "Brutal actions are enabled"
+            "warning": "Brutal actions are enabled",
+            "tooltip": "Cronch."
           },
         ]
       }

game.js

@@ -5578,6 +5578,13 @@ function render_radio_option(options_div, option) {
     label.setAttribute("for", option.id + "-" + choice.value);
     label.innerText = choice.name;
 
+    label.classList.add("solo")
+
+    if (choice.tooltip) {
+      label.classList.add("has-tooltip")
+      label.title = choice.tooltip;
+    }
+
     attach_form_data(input, choice);
 
     li.appendChild(input);

stroll.html

@@ -278,9 +278,9 @@
         <div class="custom-category">
           <p>Or export/import your character to text here. Copy and paste to share.</p>
           <div class>
-            <button type="button" class="option-button" id="button-export-clear">Clear Space</button>
-            <button type="button" class="option-button" id="button-export-preset">Export Your Character</button>
-            <button type="button" class="option-button" id="button-import-preset">Import Your Character</button>
+            <button type="button" class="option-button" id="button-export-clear">Clear</button>
+            <button type="button" class="option-button" id="button-export-preset">Export</button>
+            <button type="button" class="option-button" id="button-import-preset">Import</button>
 
             <p><input autocomplete="off" type="text" id="export-area" placeholder="Paste character data here..."></p>
           </div>