diff --git a/client/src/scenes/specsheet.js b/client/src/scenes/specsheet.js
index e8b09162..5112b193 100644
--- a/client/src/scenes/specsheet.js
+++ b/client/src/scenes/specsheet.js
@@ -12,9 +12,7 @@ const menuY = HEIGHT * 0.8;
 const menuWidth = WIDTH / 10;
 const menuHeight = HEIGHT * 0.2;
 
-const X_LEARN = WIDTH * 2 / 4;
-const Y_SKILLS = HEIGHT * 0.5;
-
+const X_MARGIN= WIDTH * 1 / 4;
 
 function addButton(scene, x, y, cback, name) {
     const button = scene.add
@@ -32,106 +30,69 @@ class StatSheet extends Phaser.Scene {
     }
 
     create(cryp) {
+        console.log(cryp);
         this.cameras.main.setViewport(X, Y, WIDTH, HEIGHT);
         this.registry.events.on('changedata', this.updateData, this);
         this.cryp = cryp;
         this.forget = false;
         this.add.text(WIDTH / 10, 0, cryp.name, TEXT.HEADER);
-
-        this.addStats(cryp);
-        this.addKnownSkills(cryp);
-        this.addLearnableSkills(cryp);
+        this.addCommonSpecs(cryp);
         addButton(this, menuX, menuY, () => this.registry.set('crypStats', cryp), 'Stats');
-
     }
 
     updateData(parent, key, data) {
         if (key === 'cryps') {
             const cryp = data.find(c => c.id === this.cryp.id);
             this.cryp = cryp;
-            this.addKnownSkills(cryp);
             this.addStats(cryp);
         }
     }
 
-    addStats(cryp) {
-        if (this.stats) this.stats.destroy(true);
-        this.stats = this.add.group();
+    addCommonSpecs(cryp) {
+        if (this.specs) this.specs.destroy(true);
+        this.specs = this.add.group();
+        const listSpecs = (list, specInfo, i) => {
+            const SPEC_X = X_MARGIN * list;
+            const SPEC_Y = (i + 1) * TEXT_MARGIN;
 
-        const crypStat = (stat, i) => {
-            const STAT_X = WIDTH / 10;
-            const STAT_Y = (i + 1) * TEXT_MARGIN;
-            this.stats.add(this.add
-                .text(STAT_X, STAT_Y, `${stat.stat}: ${stat.base}`, TEXT.NORMAL));
-        };
-
-        const CRYP_STATS = [
-            // cryp.stamina,
-            // cryp.spell_dmg,
-            // cryp.speed,
-        ];
-
-        CRYP_STATS.forEach(crypStat);
-    }
-
-    addKnownSkills(cryp) {
-        if (this.knownSkills) this.knownSkills.destroy(true);
-        this.knownSkills = this.add.group();
-
-        this.add.text(menuX, Y_SKILLS, 'Skills', TEXT.HEADER);
-        const knownSkill = (skill, i) => {
-            const SKILL_X = menuX;
-            const SKILL_Y = (i * TEXT_MARGIN) + Y_SKILLS + TEXT_MARGIN;
-
-            const color = this.forget ? '#ff0000' : '#ffffff';
-            const style = { fontFamily: 'monospace', fontSize: 16, color };
-            this.knownSkills.add(this.add.text(menuX, SKILL_Y, skill.skill, style)
+            this.specs.add(this.add.text(SPEC_X, SPEC_Y, specInfo.spec, TEXT.NORMAL)
                 .setInteractive()
-                .on('pointerdown', () => {
-                    this.registry.get('ws').sendCrypForget(cryp.id, skill.skill);
-                }));
-        };
-        // cryp.skills.forEach(knownSkill);
-    }
-
-    addLearnableSkills(cryp) {
-        if (this.learnSkills) this.learnSkills.destroy(true);
-        this.learnSkills = this.add.group();
-        const learnable = (skill, i) => {
-            const SKILL_X = i <= 10 ? X_LEARN : X_LEARN + WIDTH / 5;
-            const SKILL_Y = i <= 10 ? (i + 1) * TEXT_MARGIN : (i - 10) * TEXT_MARGIN;
-
-            this.learnSkills.add(this.add.text(SKILL_X, SKILL_Y, skill.name, TEXT.NORMAL)
-                .setInteractive()
-                .on('pointerdown', () => {
-                    this.registry.get('ws').sendCrypLearn(cryp.id, skill.name);
-                })
+                // .on('pointerdown', () => {
+                // this.registry.get('ws').sendCrypLearn(cryp.id, skill.name);
+                // })
                 .on('pointerover', (pointer) => {
                     if (!this.forget) {
-                        this.displaySkillText(SKILL_X, SKILL_Y, skill.description, pointer);
+                        this.displayText(SPEC_X, SPEC_Y, `Affects ${specInfo.affects} - level ${specInfo.level}`, pointer);
                     }
                 })
                 .on('pointerout', () => {
-                    if (this.skillText) this.skillText.destroy();
+                    if (this.hoverText) this.hoverText.destroy();
                 }));
         };
 
-        this.learnSkills.add(this.add.text(X_LEARN, 0, 'Learnable', TEXT.HEADER));
-        // SKILLS.LEARNABLE.forEach(learnable);
+        this.specs.add(this.add.text(X_MARGIN, 0, 'Common Specs', TEXT.HEADER));
+        cryp.specs.common.forEach((specInfo, i) => listSpecs(1, specInfo, i));
+
+        this.specs.add(this.add.text(X_MARGIN * 2, 0, 'Uncommon Specs', TEXT.HEADER));
+        cryp.specs.uncommon.forEach((specInfo, i) => listSpecs(2, specInfo, i));
+
+        this.specs.add(this.add.text(X_MARGIN * 3, 0, 'Rare Specs', TEXT.HEADER));
+        cryp.specs.rare.forEach((specInfo, i) => listSpecs(3, specInfo, i));
+
     }
 
-    displaySkillText(x, y, description, pointer) {
-        if (this.skillText) this.skillText.destroy();
-        this.skillText = this.add.text(x, y, description, {
+    displayText(x, y, description, pointer) {
+        if (this.hoverText) this.hoverText.destroy();
+        this.hoverText = this.add.text(x, y, description, {
             fontSize: '16px',
             fontFamily: 'Arial',
             color: '#ffffff',
             backgroundColor: '#222222',
         }).setPadding(32);
-        this.skillText.setAlpha(0.8);
-        this.skillText.setOrigin(pointer.x >= WIDTH * 0.65 ? 1 : 0,
+        this.hoverText.setAlpha(0.8);
+        this.hoverText.setOrigin(pointer.x >= WIDTH * 0.65 ? 0 : 1,
             pointer.y >= HEIGHT * 0.25 ? 1 : 0);
-        this.skillText.setWordWrapWidth(450);
+        this.hoverText.setWordWrapWidth(450);
     }