diff --git a/src/components/Nav/index.css b/src/components/Nav/index.css
deleted file mode 100644
index 6b35bc3..0000000
--- a/src/components/Nav/index.css
+++ /dev/null
@@ -1,46 +0,0 @@
-.nav {
-  align-self: stretch;
-  justify-content: center;
-  background-image: linear-gradient(
-    to bottom,
-    hsla(0, 0%, 0%, 0.5) 0%,
-    hsla(0, 0%, 0%, 0.494) 8.1%,
-    hsla(0, 0%, 0%, 0.476) 15.5%,
-    hsla(0, 0%, 0%, 0.448) 22.5%,
-    hsla(0, 0%, 0%, 0.412) 29%,
-    hsla(0, 0%, 0%, 0.37) 35.3%,
-    hsla(0, 0%, 0%, 0.324) 41.2%,
-    hsla(0, 0%, 0%, 0.275) 47.1%,
-    hsla(0, 0%, 0%, 0.225) 52.9%,
-    hsla(0, 0%, 0%, 0.176) 58.8%,
-    hsla(0, 0%, 0%, 0.13) 64.7%,
-    hsla(0, 0%, 0%, 0.088) 71%,
-    hsla(0, 0%, 0%, 0.052) 77.5%,
-    hsla(0, 0%, 0%, 0.024) 84.5%,
-    hsla(0, 0%, 0%, 0.006) 91.9%,
-    hsla(0, 0%, 0%, 0) 100%
-  );
-}
-
-.links {
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  list-style: none;
-}
-
-.link {
-  color: inherit;
-  background-color: hsla(0, 0%, 0%, 0.25);
-}
-
-.link > a {
-  display: inline-block;
-  text-decoration: none;
-  padding: 0.5em;
-}
-
-.current, .link:hover, .link:focus {
-  background-color: #FED600;
-  color: black;
-}
diff --git a/src/components/Nav/index.js b/src/components/Nav/index.js
index 0189dcd..42f3985 100644
--- a/src/components/Nav/index.js
+++ b/src/components/Nav/index.js
@@ -1,5 +1,4 @@
 import { Link } from 'preact-router';
-import style from './index.css';
 
 export default function Nav ({ path }) {
   const pages = [
@@ -9,14 +8,12 @@ export default function Nav ({ path }) {
     { name: 'Moze', path: '/bot-jock' },
   ];
   return (
-    <nav class={style.nav}>
-      <ul class={style.links}>
-        { pages.map(page => {
-          return (<li class={`${style.link} ${path === page.path ? style.current : ''}`}>
-            <Link href={page.path}>{page.name}</Link>
-          </li>);
-        }) }
-      </ul>
+    <nav>
+      {
+        pages.map(page => (
+          path === page.path ? null : <Link href={page.path}>{page.name}</Link>
+        ))
+      }
     </nav>
   );
 }
diff --git a/src/components/Skill/index.css b/src/components/Skill/index.css
index cb85107..c4745db 100644
--- a/src/components/Skill/index.css
+++ b/src/components/Skill/index.css
@@ -139,6 +139,7 @@
   display: none;
   z-index: 10;
   text-align: left;
+  font-size: 0.9rem;
 }
 
 .effect {
@@ -154,7 +155,7 @@
   padding: 0.5rem;
   display: block;
   position: absolute;
-  bottom: 110%;
+  bottom: 100%;
   width: 20rem;
   transform: translateX(calc((1 - var(--treeindex)) * 40%));
 }
diff --git a/src/components/Skill/index.js b/src/components/Skill/index.js
index 57fa73e..c0b33f2 100644
--- a/src/components/Skill/index.js
+++ b/src/components/Skill/index.js
@@ -78,7 +78,7 @@ export default function Skill ({
         { type == null && invested < ranks &&
           <div class={style.effect}>
             Next Rank:<br />
-            {effect(invested, level)}
+            {effect(invested + 1, level)}
           </div>
         }
       </div>
diff --git a/src/components/VaultHunter/index.css b/src/components/VaultHunter/index.css
index 1406381..af5aa36 100644
--- a/src/components/VaultHunter/index.css
+++ b/src/components/VaultHunter/index.css
@@ -5,6 +5,12 @@
   cursor: default;
 }
 
+.header {
+  display: flex;
+  align-items: stretch;
+  margin: 1rem auto;
+}
+
 .title {
   display: block;
   margin: 0 auto;
@@ -13,8 +19,6 @@
   text-align: center;
   font-size: 3rem;
   color: hsl(51, 100%, 50%);
-  background-color: black;
-  padding: 0.2em;
   line-height: 1;
 }
 .subtitle {
@@ -22,6 +26,51 @@
   font-size: 0.4em;
 }
 
+.sidepanel {
+  margin-left: 0.5rem;
+  display: flex;
+  flex-direction: column;
+  width: 5em;
+}
+.title, .level, .reset, .header > nav > a {
+  background-color: black;
+  padding: 0.5rem;
+}
+.level, .reset {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex: 1;
+}
+.reset {
+  margin-top: 0.5rem;
+  cursor: pointer;
+  font-size: 0.8em;
+}
+.reset:hover {
+  color: white;
+  background-color: red;
+}
+
+.header > nav {
+  display: flex;
+  align-items: stretch;
+}
+
+.header > nav > a {
+  margin-left: 0.5rem;
+  writing-mode: vertical-rl;
+  text-orientation: mixed;
+  text-decoration: none;
+  color: hsl(51, 100%, 50%);
+  text-transform: uppercase;
+  font-weight: bold;
+}
+.header > nav > a:hover {
+  background-color: hsl(51, 100%, 50%);
+  color: black;
+}
+
 .trees, .tier {
   display: flex;
 }
diff --git a/src/components/VaultHunter/index.js b/src/components/VaultHunter/index.js
index f88a7c1..a2b9b9e 100644
--- a/src/components/VaultHunter/index.js
+++ b/src/components/VaultHunter/index.js
@@ -3,7 +3,7 @@ import { Component } from 'preact';
 import Skill from '@components/Skill';
 import Nav from '@components/Nav';
 import Footer from '@components/Footer';
-import { getHash } from './hashHandler';
+import { getHash, setHash } from './hashHandler';
 import reducer from './reducer';
 import { getLevel } from './selectors';
 import style from './index.css';
@@ -32,7 +32,8 @@ export default class VaultHunter extends Component {
   render ({
     name = 'Unnamed',
     discipline = 'Classless',
-    path
+    path,
+    skills: initialSkills,
   }) {
     const skillChangeListenerFactory = (skillName, treeIndex, treeName, tierIndex) => {
       return (oldValue, newValue) => {
@@ -48,6 +49,14 @@ export default class VaultHunter extends Component {
       };
     };
 
+    const resetSkills = () => {
+      setHash(initialSkills);
+      this.setState({
+        invested: [0, 0, 0],
+        skills: initialSkills || {},
+      });
+    };
+
     const trees =
       Object.keys(this.state.skills).map((treeName, treeIndex) => {
         return (
@@ -62,6 +71,7 @@ export default class VaultHunter extends Component {
                       {...this.state.skills[treeName][tier][skillName]}
                       name={skillName}
                       enabled={this.state.invested[treeIndex] >= 5 * tierIndex - 5}
+                      level={getLevel(this.state)}
                       onChange={skillChangeListenerFactory(skillName, treeIndex, treeName, tierIndex)}
                     />
                   ) }
@@ -74,12 +84,18 @@ export default class VaultHunter extends Component {
 
     return (
       <div>
-        <Nav path={path} />
+        <div class={style.header}>
+          <h1 class={style.title}>{ name }
+            <div class={style.subtitle}>the { discipline }</div>
+          </h1>
+          <div class={style.sidepanel}>
+            <div class={style.level}>Level { getLevel(this.state) + 2 }</div>
+            <div class={style.reset}><a onClick={resetSkills}>Reset</a></div>
+          </div>
+          <Nav path={path} />
+        </div>
         <main>
           <div class={style.VaultHunter} onContextMenu={contextKiller}>
-            <h1 class={style.title}>{ name }
-              <div class={style.subtitle}>the { discipline }</div>
-            </h1>
             <div class={style.trees}>
               { trees }
             </div>
diff --git a/src/pages/Operative/skills.js b/src/pages/Operative/skills.js
index bb7c82e..4e85cab 100644
--- a/src/pages/Operative/skills.js
+++ b/src/pages/Operative/skills.js
@@ -4,7 +4,7 @@ function percent (rank, unit) {
   return Math.round(rank * unit * 10) / 10;
 }
 function flat (rank, level, unit) {
-  return Math.round(rank * unit * (level ** 1.09));
+  return Math.floor(rank * unit * (1.09 ** level));
 }
 
 /* eslint-disable quotes */
@@ -12,7 +12,7 @@ const skills = {
   "Under Cover": {
     "0": {
       "Barrier": {
-        text: "Drop a deployable Barrier that blocks incoming projectiles. Zane and his allies can shooter through the Barrier, dealing increased Gun Damage. Pressing LB or RB (controller) while Barrier is active picks up and holds the Barrier, but the size and bonuses are decreased.",
+        text: "Drop a deployable Barrier that blocks incoming projectiles. Zane and his allies can shoot through the Barrier, dealing increased Gun Damage. Pressing LB or RB (controller) while Barrier is active picks up and holds the Barrier, but the size and bonuses are decreased.",
         effect: (rank, level) => `Duration 9 sec, Cooldown 18 sec, Damage Amp +20%`,
         type: SKILLS.ACTION_SKILL,
         ranks: 0,
@@ -182,7 +182,7 @@ const skills = {
       "Bad Dose": {
         text: "SNTNL occasionally shoots out a beam of Radiation that weakens enemies and buffs Zane.",
         ranks: 0,
-        effect: (rank, level) => `Fire Rate +3% per enemy, Movement Speed +6% per enemy, Damage 2, Duration 12 sec, Cooldown 8 sec`,
+        effect: (rank, level) => `Fire Rate +3% per enemy, Movement Speed +6% per enemy, Damage ${flat(rank, level, 2)}, Duration 12 sec, Cooldown 8 sec`,
         type: SKILLS.AUGMENT_CHEVRON,
       },
       "Seein' Red": {
@@ -192,7 +192,7 @@ const skills = {
       "Static Field": {
         text: "SNTNL emits a static field that sends a Shock beam to nearby enemies, draining their shields and replenishing Zane's.",
         ranks: 0,
-        effect: (rank, level) => `Shield Damage 2 per sec, Cooldown 2 sec`,
+        effect: (rank, level) => `Shield Damage ${flat(rank, level, 2)} per sec, Cooldown 2 sec`,
         type: SKILLS.AUGMENT_CHEVRON,
       },
     },
@@ -200,7 +200,7 @@ const skills = {
       "Boomsday": {
         text: "SNTNL adds a rocket pod to its primary weapons, allowing it to shoot rockets as well as machine guns.",
         ranks: 0,
-        effect: (rank, level) => `Rocket Damage 50`,
+        effect: (rank, level) => `Rocket Damage ${flat(rank, level, 50)}`,
         type: SKILLS.AUGMENT_CHEVRON,
       },
       "Violent Violence": {
@@ -216,7 +216,7 @@ const skills = {
       "Almighty Ordnance": {
         text: "Hold down LB or RB (controller) while SNTNL is deployed to paint a target area. SNTNL fires a missile barrage at that area, and if an enemy is killed, Almighty Ordnance's duration is reset. This can only be used once per Action Skill use.",
         ranks: 0,
-        effect: (rank, level) => `Missile Damage 25, 5 Missiles per Barrage`,
+        effect: (rank, level) => `Missile Damage ${flat(rank, level, 25)}, 5 Missiles per Barrage`,
         type: SKILLS.AUGMENT_CHEVRON,
       },
     },
diff --git a/src/pages/Siren/skills.js b/src/pages/Siren/skills.js
index d3635f3..d2b2bdb 100644
--- a/src/pages/Siren/skills.js
+++ b/src/pages/Siren/skills.js
@@ -4,7 +4,7 @@ function percent (rank, unit) {
   return Math.round(rank * unit * 10) / 10;
 }
 function flat (rank, level, unit) {
-  return Math.round(rank * unit * (level ** 1.09));
+  return Math.floor(rank * unit * (1.09 ** level));
 }
 
 /* eslint-disable quotes */
@@ -62,7 +62,7 @@ const skills = {
       "Fracture": {
         ranks: 0,
         text: "Amara summons a Handful of Fists that erupt from the ground, dealing damage in front of Amara.",
-        effect: (rank, level) => `Damage 124, Cooldown 26 sec`,
+        effect: (rank, level) => `Damage ${flat(rank, level, 124)}, Cooldown 26 sec`,
         type: SKILLS.ACTION_SKILL,
       },
       "Mindfulness": {
@@ -83,7 +83,7 @@ const skills = {
       "Revelation": {
         ranks: 0,
         text: "Amara's Action Skill now creates a Nova when it damages enemies, dealing damage to all nearby enemies.",
-        effect: (rank, level) => `Nova Damage 41, Action Skill Damage -15%`,
+        effect: (rank, level) => `Nova Damage ${flat(rank, level, 41)}, Action Skill Damage -15%`,
         type: SKILLS.AUGMENT_CHEVRON,
       },
     },
@@ -91,7 +91,7 @@ const skills = {
       "Downfall": {
         ranks: 0,
         text: "Amara leaps into the air and shoots an Elemental Beam below her, followed by a Slam.",
-        effect: (rank, level) => `Damage 141, Beam Damage 21 per sec, Cooldown 36 sec`,
+        effect: (rank, level) => `Damage ${flat(rank, level, 141)}, Beam Damage ${flat(rank, level, 21)} per sec, Cooldown 36 sec`,
         type: SKILLS.ACTION_SKILL,
       },
       "Samsara": {
@@ -104,7 +104,7 @@ const skills = {
       "Do Unto Others": {
         ranks: 1,
         text: "Upon taking damage, automatically throw an Energy Orb back at enemy, dealing Action Skill Elemental Damage.",
-        effect: (rank, level) => `Projectile Damage 17, Cooldown 8 sec`,
+        effect: (rank, level) => `Projectile Damage ${flat(rank, level, 17)}, Cooldown 8 sec`,
       },
       "Jab Cross": {
         ranks: 5,
@@ -203,7 +203,7 @@ const skills = {
       "Deliverance": {
         ranks: 0,
         text: "Amara sends forward an Astral Projection of herself that deals damage to everything in its path. Upon hitting enemies, it releases homing Elemental Projectiles that trigger Action Skill Elemental Effect on enemies.",
-        effect: (rank, level) => `Damage 124, Elemental Projectiles 3 per enemy hit, Cooldown 24 sec`,
+        effect: (rank, level) => `Damage ${flat(rank, level, 124)}, Elemental Projectiles 3 per enemy hit, Cooldown 24 sec`,
         type: SKILLS.ACTION_SKILL,
       },
       "From Rest": {
@@ -236,7 +236,7 @@ const skills = {
       "Tandava": {
         ranks: 0,
         text: "Amara sends forward an Astral Projection of herself that explodes when it hits a target, damaging all nearby enemies.",
-        effect: (rank, level) => `Damage: 166, Cooldown 28 sec`,
+        effect: (rank, level) => `Damage: ${flat(rank, level, 166)}, Cooldown 28 sec`,
         type: SKILLS.ACTION_SKILL,
       },
     },
@@ -300,7 +300,7 @@ const skills = {
       "The Eternal Fist": {
         ranks: 0,
         text: "Amara summons a giant fist that bursts into the ground and locks targeted enemy in place. If Grasped enemy is killed, up to 3 new targets can be Grasped as well.",
-        effect: (rank, level) => `Bonus Targets up to +4, Cooldown 23 sec, Grasp Immune Damage 66`,
+        effect: (rank, level) => `Bonus Targets up to +4, Cooldown 23 sec, Grasp Immune Damage ${flat(rank, level, 66)}`,
         type: SKILLS.ACTION_SKILL,
       },
       "Dread": {
@@ -334,7 +334,7 @@ const skills = {
       "Ties That Bind": {
         ranks: 0,
         text: "Amara summons a giant fist that bursts from the ground and locks targeted enemy in place. Enemies near Grasped target are linked, and any damage dealt to a linked target is shared between all links.",
-        effect: (rank, level) => `Link Damage 35% of damage dealt, Cooldown 17 sec, Grasp Immune Damage 80`,
+        effect: (rank, level) => `Link Damage 35% of damage dealt, Cooldown 17 sec, Grasp Immune Damage ${flat(rank, level, 80)}`,
         type: SKILLS.ACTION_SKILL,
       },
     },
@@ -342,7 +342,7 @@ const skills = {
       "Fist Over Matter": {
         ranks: 0,
         text: "Amara summons a giant fist that bursts from the ground and locks targeted enemy in place. After Grasping, large fists appear to smash the area, dealing damage to nearby enemies.",
-        effect: (rank, level) => `Damage 21, Cooldown 31 sec, Grasp Immune Damage 93`,
+        effect: (rank, level) => `Damage ${flat(rank, level, 21)}, Cooldown 31 sec, Grasp Immune Damage ${flat(rank, level, 93)}`,
         type: SKILLS.ACTION_SKILL,
       },
       "Sustainment": {