Implemented plastic

src/data/Scene.vue

@@ -20,16 +20,12 @@
             class="scene-item"
             style="left: 72%; bottom: 8%; width: 40px; height: 40px"
         />
-        <img
+        <img v-if="day >= 8" :src="oil" class="scene-item" style="left: 80%; bottom: 6%" />
-            v-if="(day >= 8)"
-            :src="oil"
-            class="scene-item"
-            style="left: 80%; bottom: 6%"
-        />
         <img v-if="day >= 3" :src="elves" class="scene-item" style="left: 52%; bottom: 12%" />
         <div v-if="day >= 4" class="scene-bubble" style="left: 50%; bottom: 38%">
             <img v-if="day >= 4" :src="paper" class="scene-item" />
             <img v-if="day >= 5" :src="boxes" class="scene-item" />
+            <img v-if="day >= 9" :src="plastic" class="scene-item" />
         </div>
     </div>
 </template>
@@ -44,6 +40,7 @@ import boxes from "./symbols/cardboardBox.png";
 import metal from "./symbols/metal.png";
 import cloth from "./symbols/cloth.png";
 import oil from "./symbols/oil.png";
+import plastic from "./symbols/plastic.png";
 
 defineProps<{
     day: number;

src/data/layers/boxes.tsx

@@ -10,13 +10,16 @@ import { createClickable } from "features/clickables/clickable";
 import { createCumulativeConversion, createPolynomialScaling } from "features/conversion";
 import { jsx, showIf } from "features/feature";
 import MainDisplay from "features/resources/MainDisplay.vue";
-import { createResource, displayResource } from "features/resources/resource";
+import { createResource, displayResource, Resource } from "features/resources/resource";
 import { createUpgrade } from "features/upgrades/upgrade";
+import { globalBus } from "game/events";
 import { BaseLayer, createLayer } from "game/layers";
 import { noPersist } from "game/persistence";
 import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
 import { render, renderRow } from "util/vue";
 import { unref } from "vue";
+import paper from "./paper";
+import plastic from "./plastic";
 import trees from "./trees";
 
 const id = "boxes";
@@ -100,6 +103,35 @@ const layer = createLayer(id, function (this: BaseLayer) {
     }));
     const upgrades = { logsUpgrade, ashUpgrade, coalUpgrade };
 
+    const oreUpgrade = createUpgrade(() => ({
+        resource: noPersist(boxes),
+        cost: 1e8,
+        visibility: () => showIf(plastic.upgrades.boxTools.bought.value),
+        display: {
+            title: "Carry ore in boxes",
+            description: "Double ore per mining op"
+        }
+    }));
+    const metalUpgrade = createUpgrade(() => ({
+        resource: noPersist(boxes),
+        cost: 1e9,
+        visibility: () => showIf(plastic.upgrades.boxTools.bought.value),
+        display: {
+            title: "Carry metal in boxes",
+            description: "Double ore purity"
+        }
+    }));
+    const plasticUpgrade = createUpgrade(() => ({
+        resource: noPersist(boxes),
+        cost: 1e10,
+        visibility: () => showIf(plastic.upgrades.boxTools.bought.value),
+        display: {
+            title: "Carry plastic in boxes",
+            description: "Double plastic gain"
+        }
+    }));
+    const row2Upgrades = { oreUpgrade, metalUpgrade, plasticUpgrade };
+
     const logBoxesBuyable = createBuyable(() => ({
         display: {
             title: "Carry more logs",
@@ -110,10 +142,12 @@ const layer = createLayer(id, function (this: BaseLayer) {
         },
         resource: noPersist(boxes),
         cost() {
-            return Decimal.pow(3, logBoxesBuyable.amount.value).times(100);
+            let v = this.amount.value;
+            v = Decimal.pow(0.95, paper.books.boxBook.amount.value).times(v);
+            return Decimal.pow(3, v).times(100);
         },
         visibility: () => showIf(logsUpgrade.bought.value)
-    })) as GenericBuyable;
+    })) as GenericBuyable & { resource: Resource };
     const ashBoxesBuyable = createBuyable(() => ({
         display: {
             title: "Carry more ash",
@@ -124,10 +158,12 @@ const layer = createLayer(id, function (this: BaseLayer) {
         },
         resource: noPersist(boxes),
         cost() {
-            return Decimal.pow(5, ashBoxesBuyable.amount.value).times(1000);
+            let v = this.amount.value;
+            v = Decimal.pow(0.95, paper.books.boxBook.amount.value).times(v);
+            return Decimal.pow(5, v).times(1000);
         },
         visibility: () => showIf(ashUpgrade.bought.value)
-    })) as GenericBuyable;
+    })) as GenericBuyable & { resource: Resource };
     const coalBoxesBuyable = createBuyable(() => ({
         display: {
             title: "Carry more coal",
@@ -138,12 +174,25 @@ const layer = createLayer(id, function (this: BaseLayer) {
         },
         resource: noPersist(boxes),
         cost() {
-            return Decimal.pow(7, coalBoxesBuyable.amount.value).times(1000);
+            let v = this.amount.value;
+            v = Decimal.pow(0.95, paper.books.boxBook.amount.value).times(v);
+            return Decimal.pow(7, v).times(1000);
         },
         visibility: () => showIf(coalUpgrade.bought.value)
-    })) as GenericBuyable;
+    })) as GenericBuyable & { resource: Resource };
     const buyables = { logBoxesBuyable, ashBoxesBuyable, coalBoxesBuyable };
 
+    globalBus.on("update", diff => {
+        if (Decimal.lt(main.day.value, day)) {
+            return;
+        }
+
+        boxes.value = Decimal.times(diff, plastic.buyables.passiveBoxes.amount.value)
+            .times(boxesConversion.currentGain.value)
+            .div(100)
+            .add(boxes.value);
+    });
+
     const { total: totalBoxes, trackerDisplay } = setUpDailyProgressTracker({
         resource: boxes,
         goal: 5e4,
@@ -160,6 +209,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
         totalBoxes,
         boxesConversion,
         upgrades,
+        row2Upgrades,
         buyables,
         minWidth: 700,
         display: jsx(() => (
@@ -171,6 +221,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 {render(makeBoxes)}
                 <Spacer />
                 {renderRow(...Object.values(upgrades))}
+                {renderRow(...Object.values(row2Upgrades))}
                 {renderRow(...Object.values(buyables))}
             </>
         ))

src/data/layers/cloth.tsx

@@ -8,16 +8,20 @@ import Modal from "components/Modal.vue";
 import { createCollapsibleModifierSections, setUpDailyProgressTracker } from "data/common";
 import { main } from "data/projEntry";
 import { createBar } from "features/bars/bar";
-import { createBuyable } from "features/buyable";
+import { createBuyable, GenericBuyable } from "features/buyable";
 import { createClickable } from "features/clickables/clickable";
 import { jsx, showIf } from "features/feature";
 import { createHotkey } from "features/hotkey";
 import MainDisplay from "features/resources/MainDisplay.vue";
-import { createResource } from "features/resources/resource";
+import { createResource, Resource } from "features/resources/resource";
 import { createUpgrade } from "features/upgrades/upgrade";
 import { globalBus } from "game/events";
 import { BaseLayer, createLayer } from "game/layers";
-import { createAdditiveModifier, createSequentialModifier } from "game/modifiers";
+import {
+    createAdditiveModifier,
+    createMultiplicativeModifier,
+    createSequentialModifier
+} from "game/modifiers";
 import { noPersist, persistent } from "game/persistence";
 import Decimal, { DecimalSource } from "util/bignum";
 import { formatWhole } from "util/break_eternity";
@@ -26,6 +30,7 @@ import { render, renderCol, renderRow } from "util/vue";
 import { computed, ref } from "vue";
 import metal from "./metal";
 import paper from "./paper";
+import plastic from "./plastic";
 import trees from "./trees";
 
 const id = "cloth";
@@ -176,39 +181,42 @@ const layer = createLayer(id, function (this: BaseLayer) {
         cost() {
             let v = this.amount.value;
             if (Decimal.gte(v, 100)) v = Decimal.pow(v, 2).div(100);
+            v = Decimal.pow(0.95, paper.books.clothBook.amount.value).times(v);
             return Decimal.pow(1.5, v).times(1e14);
         },
         display: {
             title: "Build more pens",
             description: "Breed +1 sheep at once"
         }
-    }));
+    })) as GenericBuyable & { resource: Resource };
 
     const betterShears = createBuyable(() => ({
         resource: metal.metal,
         cost() {
             let v = this.amount.value;
             if (Decimal.gte(v, 100)) v = Decimal.pow(v, 2).div(100);
+            v = Decimal.pow(0.95, paper.books.clothBook.amount.value).times(v);
             return Decimal.pow(1.4, v).times(10000);
         },
         display: {
             title: "Make stronger shears",
             description: "Shear +1 sheep at once"
         }
-    }));
+    })) as GenericBuyable & { resource: Resource };
 
     const fasterSpinning = createBuyable(() => ({
         resource: paper.paper,
         cost() {
             let v = this.amount.value;
             if (Decimal.gte(v, 100)) v = Decimal.pow(v, 2).div(100);
+            v = Decimal.pow(0.95, paper.books.clothBook.amount.value).times(v);
             return Decimal.pow(1.3, v).times(1000000);
         },
         display: {
             title: "Learn how to spin",
             description: "Spin +1 wool at once"
         }
-    }));
+    })) as GenericBuyable & { resource: Resource };
 
     const treesUpgrade1 = createUpgrade(() => ({
         resource: noPersist(cloth),
@@ -236,7 +244,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Quadruple trees planted"
         }
     }));
-    const treesUpgrades = { treesUpgrade3, treesUpgrade2, treesUpgrade1 };
+    const treesUpgrade4 = createUpgrade(() => ({
+        resource: noPersist(cloth),
+        cost: 1e3,
+        visibility: () => showIf(plastic.upgrades.clothTools.bought.value),
+        display: {
+            title: "Felt-Gripped Axe",
+            description: "10x trees planted"
+        }
+    }));
+    const treesUpgrades = { treesUpgrade4, treesUpgrade3, treesUpgrade2, treesUpgrade1 };
 
     const metalUpgrade1 = createUpgrade(() => ({
         resource: noPersist(cloth),
@@ -264,7 +281,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Triple coal gain"
         }
     }));
-    const metalUpgrades = { metalUpgrade3, metalUpgrade2, metalUpgrade1 };
+    const metalUpgrade4 = createUpgrade(() => ({
+        resource: noPersist(cloth),
+        cost: 2e3,
+        visibility: () => showIf(plastic.upgrades.clothTools.bought.value),
+        display: {
+            title: "Felt-Gripped Pick",
+            description: "Quadruple coal gain"
+        }
+    }));
+    const metalUpgrades = { metalUpgrade4, metalUpgrade3, metalUpgrade2, metalUpgrade1 };
 
     const paperUpgrade1 = createUpgrade(() => ({
         resource: noPersist(cloth),
@@ -292,12 +318,31 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Double paper gain"
         }
     }));
-    const paperUpgrades = { paperUpgrade3, paperUpgrade2, paperUpgrade1 };
+    const paperUpgrade4 = createUpgrade(() => ({
+        resource: noPersist(cloth),
+        cost: 4e3,
+        visibility: () => showIf(plastic.upgrades.clothTools.bought.value),
+        display: {
+            title: "Felt Elbow Pads",
+            description: "10x paper gain"
+        }
+    }));
+    const paperUpgrades = { paperUpgrade4, paperUpgrade3, paperUpgrade2, paperUpgrade1 };
 
     const sheepGain = createSequentialModifier(() => [
         createAdditiveModifier(() => ({
             addend: buildPens.amount,
             description: "Build more pens"
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.div(plastic.buyables.clothGains.amount.value, 10).add(1),
+            description: "Plastic Shepherd",
+            enabled: () => Decimal.gte(plastic.buyables.clothGains.amount.value, 1)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Shepherding for Dummies",
+            enabled: paper.upgrades.clothUpgrade.bought
         }))
     ]);
     const computedSheepGain = computed(() => sheepGain.apply(1));
@@ -308,6 +353,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
         createAdditiveModifier(() => ({
             addend: betterShears.amount,
             description: "Make stronger shears"
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.div(plastic.buyables.clothGains.amount.value, 10).add(1),
+            description: "Plastic Shepherd",
+            enabled: () => Decimal.gte(plastic.buyables.clothGains.amount.value, 1)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Shepherding for Dummies",
+            enabled: paper.upgrades.clothUpgrade.bought
         }))
     ]);
     const computedShearingAmount = computed(() => shearingAmount.apply(1));
@@ -318,6 +373,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
         createAdditiveModifier(() => ({
             addend: fasterSpinning.amount,
             description: "Learn how to spin"
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.div(plastic.buyables.clothGains.amount.value, 10).add(1),
+            description: "Plastic Shepherd",
+            enabled: () => Decimal.gte(plastic.buyables.clothGains.amount.value, 1)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Shepherding for Dummies",
+            enabled: paper.upgrades.clothUpgrade.bought
         }))
     ]);
     const computedSpinningAmount = computed(() => spinningAmount.apply(1));

src/data/layers/coal.tsx

@@ -2,42 +2,41 @@
  * @module
  * @hidden
  */
+import Column from "components/layout/Column.vue";
+import Row from "components/layout/Row.vue";
 import Spacer from "components/layout/Spacer.vue";
 import Modal from "components/Modal.vue";
-import MainDisplay from "features/resources/MainDisplay.vue";
-import Row from "components/layout/Row.vue";
-import Column from "components/layout/Column.vue";
 import {
-    createCollapsibleModifierSections,
+changeActiveBuyables, createCollapsibleModifierSections,
-    setUpDailyProgressTracker,
+setUpDailyProgressTracker
-    changeActiveBuyables
 } from "data/common";
 import { main } from "data/projEntry";
 import { createBuyable, GenericBuyable } from "features/buyable";
 import { jsx, JSXFunction, showIf, StyleValue, Visibility } from "features/feature";
+import MainDisplay from "features/resources/MainDisplay.vue";
 import { createResource, Resource } from "features/resources/resource";
+import { createUpgrade, Upgrade } from "features/upgrades/upgrade";
 import { globalBus } from "game/events";
 import { BaseLayer, createLayer } from "game/layers";
+import {
+createAdditiveModifier,
+createExponentialModifier,
+createMultiplicativeModifier,
+createSequentialModifier,
+Modifier
+} from "game/modifiers";
 import { noPersist, persistent } from "game/persistence";
 import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
+import { WithRequired } from "util/common";
 import { render, renderRow } from "util/vue";
 import { computed, ref, unref } from "vue";
-import trees from "./trees";
-import {
-    createAdditiveModifier,
-    createExponentialModifier,
-    createMultiplicativeModifier,
-    createSequentialModifier,
-    Modifier
-} from "game/modifiers";
-import { createUpgrade, Upgrade } from "features/upgrades/upgrade";
-import elves from "./elves";
-import paper from "./paper";
 import boxes from "./boxes";
-import metal from "./metal";
 import cloth from "./cloth";
-import { WithRequired } from "util/common";
+import elves from "./elves";
+import metal from "./metal";
 import oil from "./oil";
+import paper from "./paper";
+import trees from "./trees";
 
 interface BetterFertilizerUpgOptions {
     canAfford: () => boolean;
@@ -566,6 +565,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Mining helmet",
             enabled: cloth.metalUpgrades.metalUpgrade3.bought
         })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 4,
+            description: "Felt-Gripped Pick",
+            enabled: cloth.metalUpgrades.metalUpgrade4.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "12 Elves Trained",
+            enabled: elves.milestones[11].earned
+        })),
         createExponentialModifier(() => ({
             exponent: 1.25,
             description: "3 Elves Trained",

src/data/layers/elves.tsx

@@ -2,6 +2,7 @@
  * @module
  * @hidden
  */
+import { isArray } from "@vue/shared";
 import Toggle from "components/fields/Toggle.vue";
 import Spacer from "components/layout/Spacer.vue";
 import Modal from "components/Modal.vue";
@@ -25,8 +26,10 @@ import { Computable, convertComputable } from "util/computed";
 import { render, renderRow } from "util/vue";
 import { computed, ref, Ref, unref, watchEffect } from "vue";
 import boxes from "./boxes";
+import cloth from "./cloth";
 import coal from "./coal";
 import paper from "./paper";
+import plastic from "./plastic";
 import trees from "./trees";
 import workshop from "./workshop";
 
@@ -86,6 +89,17 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 if (foundationMilestone.earned.value) {
                     workshop.foundationProgress.value = 100;
                 }
+                if (coalUpgradesMilestone.earned.value) {
+                    coal.warmerCutters.bought.value = true;
+                    coal.warmerPlanters.bought.value = true;
+                    coal.basicFertilizer.bought.value = true;
+                    coal.unlockBonfire.bought.value = true;
+                    coal.dedicatedCutters.bought.value = true;
+                    coal.dedicatedPlanters.bought.value = true;
+                    coal.betterFertilizer.bought.value = true;
+                    coal.unlockKiln.bought.value = true;
+                    coal.efficientSmelther.bought.value = true;
+                }
             });
         }
     }));
@@ -100,6 +114,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.cuttersBook.amount.value, 0.1).add(1),
             description: "Now You're Logging!",
             enabled: () => Decimal.gt(paper.books.cuttersBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const planterCooldown = createSequentialModifier(() => [
@@ -112,6 +131,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.plantersBook.amount.value, 0.1).add(1),
             description: "The Man Who Planted Trees",
             enabled: () => Decimal.gt(paper.books.plantersBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const expanderCooldown = createSequentialModifier(() => [
@@ -124,6 +148,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.expandersBook.amount.value, 0.1).add(1),
             description: "Logjam",
             enabled: () => Decimal.gt(paper.books.expandersBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const heatedCutterCooldown = createSequentialModifier(() => [
@@ -136,6 +165,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.heatedCuttersBook.amount.value, 0.1).add(1),
             description: "Fahrenheit 451",
             enabled: () => Decimal.gt(paper.books.heatedCuttersBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const heatedPlanterCooldown = createSequentialModifier(() => [
@@ -149,6 +183,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 Decimal.times(paper.books.heatedPlantersBook.amount.value, 0.1).add(1),
             description: "Tillamook Burn Country",
             enabled: () => Decimal.gt(paper.books.heatedPlantersBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const fertilizerCooldown = createSequentialModifier(() => [
@@ -161,6 +200,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.fertilizerBook.amount.value, 0.1).add(1),
             description: "The Garden Tree's Handbook",
             enabled: () => Decimal.gt(paper.books.fertilizerBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const smallFireCooldown = createSequentialModifier(() => [
@@ -173,6 +217,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.smallFireBook.amount.value, 0.1).add(1),
             description: "Firestarter",
             enabled: () => Decimal.gt(paper.books.smallFireBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const bonfireCooldown = createSequentialModifier(() => [
@@ -185,6 +234,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.bonfireBook.amount.value, 0.1).add(1),
             description: "An Arsonist's Guide to Writer's Homes in New England",
             enabled: () => Decimal.gt(paper.books.bonfireBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
     const kilnCooldown = createSequentialModifier(() => [
@@ -197,6 +251,62 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.times(paper.books.kilnBook.amount.value, 0.1).add(1),
             description: "Little Fires Everywhere",
             enabled: () => Decimal.gt(paper.books.kilnBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
+        }))
+    ]);
+    const paperCooldown = createSequentialModifier(() => [
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "6 Elves Trained",
+            enabled: elvesMilestone.earned
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.times(paper.books.paperBook.amount.value, 0.1).add(1),
+            description: "The Book Thief",
+            enabled: () => Decimal.gt(paper.books.paperBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
+        }))
+    ]);
+    const boxCooldown = createSequentialModifier(() => [
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "6 Elves Trained",
+            enabled: elvesMilestone.earned
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.times(paper.books.boxBook.amount.value, 0.1).add(1),
+            description: "Not a box",
+            enabled: () => Decimal.gt(paper.books.boxBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
+        }))
+    ]);
+    const clothCooldown = createSequentialModifier(() => [
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "6 Elves Trained",
+            enabled: elvesMilestone.earned
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => Decimal.times(paper.books.clothBook.amount.value, 0.1).add(1),
+            description: "Fuzzy Bee and Friends",
+            enabled: () => Decimal.gt(paper.books.clothBook.amount.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "10 Elves Trained",
+            enabled: elvesMilestone2.earned
         }))
     ]);
 
@@ -263,6 +373,27 @@ const layer = createLayer(id, function (this: BaseLayer) {
             base: 10,
             unit: "/s",
             visible: elves.kilnElf.bought
+        },
+        {
+            title: "Star Auto-Buy Frequency",
+            modifier: paperCooldown,
+            base: 10,
+            unit: "/s",
+            visible: elves.paperElf.bought
+        },
+        {
+            title: "Bell Auto-Buy Frequency",
+            modifier: boxCooldown,
+            base: 10,
+            unit: "/s",
+            visible: elves.boxElf.bought
+        },
+        {
+            title: "Gingersnap Auto-Buy Frequency",
+            modifier: clothCooldown,
+            base: 10,
+            unit: "/s",
+            visible: elves.clothElf.bought
         }
     ]);
     const showModifiersModal = ref(false);
@@ -277,11 +408,21 @@ const layer = createLayer(id, function (this: BaseLayer) {
         />
     ));
 
+    const trainingCost = computed(() => {
+        let cost = Decimal.pow(4, totalElves.value).times(1e6);
+        if (Decimal.gte(totalElves.value, 9)) {
+            cost = Decimal.times(cost, 1e15);
+        }
+        return cost;
+    });
+
     function createElf(
         options: {
             name: string;
             description: string;
-            buyable: GenericBuyable & { resource: Resource };
+            buyable:
+                | (GenericBuyable & { resource: Resource })
+                | (GenericBuyable & { resource: Resource })[];
             cooldownModifier: Modifier;
             customCost?: (amount: DecimalSource) => DecimalSource;
             hasToggle?: boolean;
@@ -291,7 +432,6 @@ const layer = createLayer(id, function (this: BaseLayer) {
             canBuy?: Computable<boolean>;
         } & Partial<ClickableOptions>
     ) {
-        const trainingCost = computed(() => Decimal.pow(4, totalElves.value).times(1e6));
         const buyProgress = persistent<DecimalSource>(0);
         const toggle = options.hasToggle ? persistent<boolean>(false) : ref(true);
 
@@ -303,23 +443,27 @@ const layer = createLayer(id, function (this: BaseLayer) {
             if (upgrade.bought.value && unref(isActive)) {
                 buyProgress.value = Decimal.add(buyProgress.value, diff);
                 const cooldown = Decimal.recip(computedAutoBuyCooldown.value);
-                while (Decimal.gte(buyProgress.value, cooldown)) {
+                (isArray(options.buyable) ? options.buyable : [options.buyable]).forEach(
-                    if (
+                    buyable => {
-                        options.customCost == undefined
+                        while (Decimal.gte(buyProgress.value, cooldown)) {
-                            ? unref(options.buyable.canPurchase)
+                            if (
-                            : Decimal.gte(
+                                options.customCost == undefined
-                                  options.buyable.resource.value,
+                                    ? unref(buyable.canPurchase)
-                                  options.customCost(options.buyable.amount.value)
+                                    : Decimal.gte(
-                              )
+                                          buyable.resource.value,
-                    ) {
+                                          options.customCost(buyable.amount.value)
-                        options.buyable.amount.value = Decimal.add(options.buyable.amount.value, 1);
+                                      )
-                        buyProgress.value = Decimal.sub(buyProgress.value, cooldown);
+                            ) {
-                        options.onAutoPurchase?.();
+                                buyable.amount.value = Decimal.add(buyable.amount.value, 1);
-                    } else {
+                                buyProgress.value = Decimal.sub(buyProgress.value, cooldown);
-                        buyProgress.value = cooldown;
+                                options.onAutoPurchase?.();
-                        break;
+                            } else {
+                                buyProgress.value = cooldown;
+                                break;
+                            }
+                        }
                     }
-                }
+                );
             }
         }
 
@@ -445,7 +589,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
         hasToggle: true,
         toggleDesc: "Activate auto-purchased bonfires",
         onAutoPurchase() {
-            const spent = unref(this.buyable.cost!);
+            const spent = unref((this.buyable as GenericBuyable).cost!);
             coal.activeFires.value = Decimal.sub(coal.activeFires.value, spent).max(0);
             coal.buildFire.amount.value = Decimal.sub(coal.buildFire.amount.value, spent).max(0);
             if (bonfireElf.toggle.value) {
@@ -477,6 +621,31 @@ const layer = createLayer(id, function (this: BaseLayer) {
         canBuy: coal.unlockKiln.bought
     });
     const fireElves = [smallFireElf, bonfireElf, kilnElf];
+    const paperElf = createElf({
+        name: "Star",
+        description:
+            "Star will automatically purchase all books you can afford, without actually spending any paper.",
+        buyable: Object.values(paper.books),
+        cooldownModifier: paperCooldown,
+        visibility: () => showIf(plastic.elfUpgrades.paperElf.bought.value)
+    });
+    const boxElf = createElf({
+        name: "Bell",
+        description:
+            "Bell will automatically purchase all box buyables you can afford, without actually spending any boxes.",
+        buyable: Object.values(boxes.buyables),
+        cooldownModifier: boxCooldown,
+        visibility: () => showIf(plastic.elfUpgrades.boxElf.bought.value)
+    });
+    const clothElf = createElf({
+        name: "Gingersnap",
+        description:
+            "Gingersnap will automatically purchase all cloth buyables you can afford, without actually spending any resources.",
+        buyable: [cloth.buildPens, cloth.betterShears, cloth.fasterSpinning],
+        cooldownModifier: clothCooldown,
+        visibility: () => showIf(plastic.elfUpgrades.clothElf.bought.value)
+    });
+    const plasticElves = [paperElf, boxElf, clothElf];
     const elves = {
         cuttersElf,
         plantersElf,
@@ -486,7 +655,10 @@ const layer = createLayer(id, function (this: BaseLayer) {
         fertilizerElf,
         smallFireElf,
         bonfireElf,
-        kilnElf
+        kilnElf,
+        paperElf,
+        boxElf,
+        clothElf
     };
     const totalElves = computed(() => Object.values(elves).filter(elf => elf.bought.value).length);
 
@@ -562,6 +734,30 @@ const layer = createLayer(id, function (this: BaseLayer) {
         shouldEarn: () => Decimal.gte(totalElves.value, 9),
         visibility: () => showIf(forestMilestone2.earned.value)
     }));
+    const elvesMilestone2 = createMilestone(() => ({
+        display: {
+            requirement: "10 Elves Trained",
+            effectDisplay: "Elves work twice as fast (again)"
+        },
+        shouldEarn: () => Decimal.gte(totalElves.value, 10),
+        visibility: () => showIf(main.day.value >= 10)
+    }));
+    const coalUpgradesMilestone = createMilestone(() => ({
+        display: {
+            requirement: "11 Elves Trained",
+            effectDisplay: "Coal upgrades aren't reset after training"
+        },
+        shouldEarn: () => Decimal.gte(totalElves.value, 11),
+        visibility: () => showIf(elvesMilestone2.earned.value)
+    }));
+    const coalGainMilestone2 = createMilestone(() => ({
+        display: {
+            requirement: "12 Elves Trained",
+            effectDisplay: "Double coal gain"
+        },
+        shouldEarn: () => Decimal.gte(totalElves.value, 12),
+        visibility: () => showIf(coalUpgradesMilestone.earned.value)
+    }));
     // Gosh why did I make these as an array at first
     const milestones = [
         manualMilestone,
@@ -572,7 +768,10 @@ const layer = createLayer(id, function (this: BaseLayer) {
         elvesMilestone,
         foundationMilestone,
         forestMilestone2,
-        treeUpgradesMilestone
+        treeUpgradesMilestone,
+        elvesMilestone2,
+        coalUpgradesMilestone,
+        coalGainMilestone2
     ];
     const milestonesDict = {
         manualMilestone,
@@ -583,7 +782,10 @@ const layer = createLayer(id, function (this: BaseLayer) {
         elvesMilestone,
         foundationMilestone,
         forestMilestone2,
-        treeUpgradesMilestone
+        treeUpgradesMilestone,
+        elvesMilestone2,
+        coalUpgradesMilestone,
+        coalGainMilestone2
     };
     const { collapseMilestones, display: milestonesDisplay } =
         createCollapsibleMilestones(milestonesDict);
@@ -639,6 +841,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
                     {renderRow(...treesElves)}
                     {renderRow(...coalElves)}
                     {renderRow(...fireElves)}
+                    {renderRow(...plasticElves)}
                 </div>
                 {milestonesDisplay()}
             </>

src/data/layers/metal.tsx

@@ -26,6 +26,7 @@ import { noPersist } from "game/persistence";
 import { createBuyable, GenericBuyable } from "features/buyable";
 import { main } from "../projEntry";
 import oil from "./oil";
+import boxes from "./boxes";
 
 const id = "metal";
 const day = 7;
@@ -59,6 +60,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: () => Decimal.add(hotterForgeEffect.value, 1),
             description: "Hotter Forges",
             enabled: () => Decimal.gte(hotterForge.amount.value, 1)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Carry metal in boxes",
+            enabled: boxes.row2Upgrades.metalUpgrade.bought
         }))
     ]);
     const computedOrePurity = computed(() => orePurity.apply(0.1));
@@ -75,10 +81,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             enabled: coal.efficientSmelther.bought
         })),
         createMultiplicativeModifier(() => ({
-            multiplier: () => Decimal.mul(oil.activeSmelter.value, oil.oilEffectiveness.value).add(1),
+            multiplier: () =>
+                Decimal.mul(oil.activeSmelter.value, oil.oilEffectiveness.value).add(1),
             description: "Oil Smelter",
             enabled: () => Decimal.gt(oil.activeSmelter.value, 0)
-        })),
+        }))
     ]);
     const computedAutoSmeltSpeed = computed(() => autoSmeltSpeed.apply(0));
     const autoSmeltMulti = createSequentialModifier(() => [
@@ -88,10 +95,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             enabled: coal.efficientSmelther.bought
         })),
         createMultiplicativeModifier(() => ({
-            multiplier: () => Decimal.add(oil.activeBurner.value, 1).mul(oil.oilEffectiveness.value),
+            multiplier: () =>
+                Decimal.add(oil.activeBurner.value, 1).mul(oil.oilEffectiveness.value),
             description: "Blaster Burner",
             enabled: oil.row2Upgrades[2].bought
-        })),
+        }))
     ]);
     const computedAutoSmeltMulti = computed(() => autoSmeltMulti.apply(1));
 
@@ -150,13 +158,18 @@ const layer = createLayer(id, function (this: BaseLayer) {
         createMultiplicativeModifier(() => ({
             multiplier: () => Decimal.mul(oil.depth.value, 0.05).add(1),
             description: "25m Well Depth",
-            enabled: oil.depthMilestones[2].earned,
+            enabled: oil.depthMilestones[2].earned
         })),
         createMultiplicativeModifier(() => ({
             multiplier: oil.extractorOre,
             description: "Heavy Extractor",
             enabled: () => Decimal.gt(oil.activeExtractor.value, 0)
         })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Carry ore in boxes",
+            enabled: boxes.row2Upgrades.oreUpgrade.bought
+        }))
     ]);
     const computedOreAmount = computed(() => oreAmount.apply(1));
     const oreSpeed = createSequentialModifier(() => [
@@ -203,7 +216,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
         })),
         createMultiplicativeModifier(() => ({
             multiplier: computedOreSpeed
-        })),
+        }))
     ]);
     const computedOreGain = computed(() => oreGain.apply(0));
     const netOreGain = createSequentialModifier(() => [
@@ -216,7 +229,6 @@ const layer = createLayer(id, function (this: BaseLayer) {
         }))
     ]);
     const computedNetOreGain = computed(() => netOreGain.apply(0));
-    
 
     const simplePickaxe = createUpgrade(() => ({
         resource: noPersist(metal),
@@ -248,7 +260,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
         visibility: () =>
             showIf(
                 crucible.bought.value ||
-                Decimal.div(bestOre.value, computedOrePurity.value).plus(bestMetal.value).gte(1)
+                    Decimal.div(bestOre.value, computedOrePurity.value).plus(bestMetal.value).gte(1)
             )
     })) as GenericUpgrade;
     const coalDrill = createUpgrade(() => ({
@@ -262,12 +274,13 @@ const layer = createLayer(id, function (this: BaseLayer) {
         visibility: () =>
             showIf(
                 Decimal.gte(oreDrill.amount.value, 1) &&
-                (coalDrill.bought.value ||
+                    (coalDrill.bought.value ||
-                    Decimal.lt(
+                        Decimal.lt(
-                        coal.computedCoalGain.value,
+                            coal.computedCoalGain.value,
-                        Decimal.times(computedOreAmount.value, computedOreSpeed.value)
+                            Decimal.times(computedOreAmount.value, computedOreSpeed.value).times(
-                            .times(coalCost)
+                                coalCost
-                    ))
+                            )
+                        ))
             ),
         onPurchase() {
             main.days[2].recentlyUpdated.value = true;
@@ -299,7 +312,6 @@ const layer = createLayer(id, function (this: BaseLayer) {
         visibility: () => showIf(oil.depthMilestones[4].earned.value)
     }));
 
-
     const oreDrill = createBuyable(() => ({
         resource: noPersist(metal),
         cost() {
@@ -318,9 +330,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
         visibility: () =>
             showIf(
                 Decimal.gte(oreDrill.amount.value, 1) ||
-                Decimal.div(bestOre.value, computedOrePurity.value)
+                    Decimal.div(bestOre.value, computedOrePurity.value)
-                    .plus(bestMetal.value)
+                        .plus(bestMetal.value)
-                    .gte(10)
+                        .gte(10)
             ),
         style: { width: "200px" }
     })) as GenericBuyable;
@@ -342,8 +354,8 @@ const layer = createLayer(id, function (this: BaseLayer) {
         visibility: () =>
             showIf(
                 Decimal.gte(industrialCrucible.amount.value, 1) ||
-                Decimal.gte(oreDrill.amount.value, 4) ||
+                    Decimal.gte(oreDrill.amount.value, 4) ||
-                Decimal.gte(bestOre.value, 50)
+                    Decimal.gte(bestOre.value, 50)
             ),
         style: { width: "200px" }
     })) as GenericBuyable;
@@ -378,10 +390,8 @@ const layer = createLayer(id, function (this: BaseLayer) {
 
         if (autoSmeltEnabled.value) {
             smeltOre(
-                Decimal.min(
+                Decimal.min(smeltableOre.value, Decimal.times(computedAutoSmeltSpeed.value, diff)),
-                    smeltableOre.value,
+                computedAutoSmeltMulti.value
-                    Decimal.times(computedAutoSmeltSpeed.value, diff)
-                ), computedAutoSmeltMulti.value
             );
         }
     });
@@ -418,7 +428,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
             title: "Mining Speed",
             modifier: oreSpeed,
             base: 0.1,
-            unit: "/s",
+            unit: "/s"
         }
     ]);
     const showModifiersModal = ref(false);
@@ -478,16 +488,23 @@ const layer = createLayer(id, function (this: BaseLayer) {
                     sticky={false}
                     productionDisplay={jsx(() => (
                         <>
-                            {autoSmeltEnabled.value && Decimal.gte(industrialCrucible.amount.value, 1)
+                            {autoSmeltEnabled.value &&
+                            Decimal.gte(industrialCrucible.amount.value, 1)
                                 ? `+${formatLimit(
-                                    [
+                                      [
-                                        [computedAutoSmeltSpeed.value, "smelting speed"],
+                                          [computedAutoSmeltSpeed.value, "smelting speed"],
-                                        [computedOreGain.value, "ore gain"],
+                                          [computedOreGain.value, "ore gain"],
-                                        [Decimal.div(coal.computedCoalGain.value, coalCost), "coal gain"]
+                                          [
-                                    ],
+                                              Decimal.div(coal.computedCoalGain.value, coalCost),
-                                    "/s",
+                                              "coal gain"
-                                    Decimal.mul(computedOrePurity.value, computedAutoSmeltMulti.value)
+                                          ]
-                                )}`
+                                      ],
+                                      "/s",
+                                      Decimal.mul(
+                                          computedOrePurity.value,
+                                          computedAutoSmeltMulti.value
+                                      )
+                                  )}`
                                 : undefined}
                         </>
                     ))}
@@ -499,7 +516,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
                         <Toggle
                             title="Auto Smelt"
                             modelValue={autoSmeltEnabled.value}
-                            onUpdate:modelValue={(value: boolean) => (autoSmeltEnabled.value = value)}
+                            onUpdate:modelValue={(value: boolean) =>
+                                (autoSmeltEnabled.value = value)
+                            }
                         />
                     </div>
                 ) : undefined}
@@ -520,7 +539,14 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 </div>
                 {render(oreBar)}
                 <Spacer />
-                {renderRow(simplePickaxe, doublePickaxe, crucible, coalDrill, industrialFurnace, efficientDrill)}
+                {renderRow(
+                    simplePickaxe,
+                    doublePickaxe,
+                    crucible,
+                    coalDrill,
+                    industrialFurnace,
+                    efficientDrill
+                )}
                 {renderRow(oreDrill, industrialCrucible, hotterForge)}
             </>
         ))

src/data/layers/oil.tsx

@@ -32,6 +32,8 @@ import coal from "./coal";
 import { createUpgrade, GenericUpgrade } from "features/upgrades/upgrade";
 import { createMilestone, GenericMilestone } from "features/milestones/milestone";
 import { formatGain } from "util/bignum";
+import plastic from "./plastic";
+import paper from "./paper";
 
 const id = "oil";
 const day = 9;
@@ -598,7 +600,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
             cost: 25000,
             display: {
                 title: "Oil Integration",
-                description: "Reduce Oil Well's coal consumption multipler from 5 to 4"
+                description: "Reduce Oil Pump's coal consumption multipler from 5 to 4"
             },
             style: { color: colorText }
         })),
@@ -667,6 +669,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Metal Drill Upgrade",
             enabled: row1Upgrades[3].bought
         })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Guide to drilling",
+            enabled: paper.upgrades.drillingUpgrade.bought
+        })),
         createMultiplicativeModifier(() => ({
             multiplier: () => coalEffectiveness.value,
             description: "Effectiveness",
@@ -700,6 +707,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "3000m Well Depth",
             enabled: depthMilestones[7].earned
         })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Oil and where to find it",
+            enabled: paper.upgrades.oilUpgrade.bought
+        })),
         createMultiplicativeModifier(() => ({
             multiplier: () => coalEffectiveness.value,
             description: "Effectiveness",
@@ -718,6 +730,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             addend: () => Decimal.negate(smelterOil.value),
             description: "Oil Smelter",
             enabled: () => Decimal.gt(activeSmelter.value, 0)
+        })),
+        createAdditiveModifier(() => ({
+            addend: () => Decimal.negate(plastic.oilCost.value),
+            description: "Oil Refinery",
+            enabled: () => Decimal.gt(plastic.activeRefinery.value, 0)
         }))
     ]);
     const computedOilConsumption = computed(() => oilConsumption.apply(0));
@@ -826,7 +843,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
             oil.value = Decimal.sub(
                 oil.value,
                 Decimal.mul(oilCost, oilEffectiveness.value).mul(diff)
-            );
+            ).max(0);
         } else {
             oilEffectiveness.value = Decimal.dOne;
         }
@@ -889,12 +906,12 @@ const layer = createLayer(id, function (this: BaseLayer) {
             <>
                 {render(trackerDisplay)}
                 <Spacer />
-                {Decimal.lt(coalEffectiveness.value, 1)
+                {Decimal.lt(coalEffectiveness.value, 1) ? (
-                    ? "Coal efficiency: " + format(Decimal.mul(coalEffectiveness.value, 100)) + "%"
+                    <div>Coal efficiency: {format(Decimal.mul(coalEffectiveness.value, 100))}%</div>
-                    : null}
+                ) : null}
-                {Decimal.lt(oilEffectiveness.value, 1)
+                {Decimal.lt(oilEffectiveness.value, 1) ? (
-                    ? "Oil efficiency: " + format(Decimal.mul(oilEffectiveness.value, 100)) + "%"
+                    <div>Oil efficiency: {format(Decimal.mul(oilEffectiveness.value, 100))}%</div>
-                    : null}
+                ) : null}
                 <MainDisplay
                     resource={oil}
                     color={color}

src/data/layers/paper.tsx

@@ -5,22 +5,26 @@
 import Spacer from "components/layout/Spacer.vue";
 import Modal from "components/Modal.vue";
 import { createCollapsibleModifierSections, setUpDailyProgressTracker } from "data/common";
+import { main } from "data/projEntry";
 import { BuyableOptions, createBuyable, GenericBuyable } from "features/buyable";
 import { createClickable } from "features/clickables/clickable";
 import { createCumulativeConversion, createPolynomialScaling } from "features/conversion";
 import { jsx, showIf } from "features/feature";
 import MainDisplay from "features/resources/MainDisplay.vue";
-import { createResource, displayResource } from "features/resources/resource";
+import { createResource, displayResource, Resource } from "features/resources/resource";
+import { createUpgrade } from "features/upgrades/upgrade";
+import { globalBus } from "game/events";
 import { BaseLayer, createLayer } from "game/layers";
 import { createMultiplicativeModifier, createSequentialModifier, Modifier } from "game/modifiers";
 import { noPersist } from "game/persistence";
 import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
 import { WithRequired } from "util/common";
-import { render, renderCol } from "util/vue";
+import { render, renderCol, renderRow } from "util/vue";
 import { computed, ref, unref } from "vue";
 import cloth from "./cloth";
 import coal from "./coal";
 import elves from "./elves";
+import plastic from "./plastic";
 import trees from "./trees";
 
 const id = "paper";
@@ -96,9 +100,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 showAmount: false
             },
             resource: noPersist(paper),
-            cost: () => Decimal.pow(5, buyable.amount.value).times(10),
+            cost() {
+                let v = this.amount.value;
+                if (options.elfName === "Star" || options.elfName === "Bell") v = Decimal.pow(v, 2);
+                if (Decimal.gte(v, 100)) v = Decimal.pow(v, 2).div(100);
+                if (Decimal.gte(v, 10000)) v = Decimal.pow(v, 2).div(10000);
+                v = Decimal.pow(0.95, paperBook.amount.value).times(v);
+                return Decimal.pow(5, v).times(10);
+            },
             style: "width: 600px"
-        })) as GenericBuyable;
+        })) as GenericBuyable & { resource: Resource };
         return buyable;
     }
 
@@ -150,6 +161,24 @@ const layer = createLayer(id, function (this: BaseLayer) {
         buyableName: "Kiln",
         visibility: () => showIf(elves.elves.kilnElf.bought.value)
     });
+    const paperBook = createBook({
+        name: "The Book Thief",
+        elfName: "Star",
+        buyableName: "Paper Buyables",
+        visibility: () => showIf(elves.elves.paperElf.bought.value)
+    });
+    const boxBook = createBook({
+        name: "Not a box",
+        elfName: "Bell",
+        buyableName: "Box Buyables",
+        visibility: () => showIf(elves.elves.boxElf.bought.value)
+    });
+    const clothBook = createBook({
+        name: "Fuzzy Bee and Friends",
+        elfName: "Gingersnap",
+        buyableName: "Cloth Buyables",
+        visibility: () => showIf(elves.elves.clothElf.bought.value)
+    });
     const books = {
         cuttersBook,
         plantersBook,
@@ -159,9 +188,41 @@ const layer = createLayer(id, function (this: BaseLayer) {
         fertilizerBook,
         smallFireBook,
         bonfireBook,
-        kilnBook
+        kilnBook,
+        paperBook,
+        boxBook,
+        clothBook
     };
 
+    const clothUpgrade = createUpgrade(() => ({
+        resource: noPersist(paper),
+        cost: 1e8,
+        visibility: () => showIf(plastic.upgrades.paperTools.bought.value),
+        display: {
+            title: "Shepherding for Dummies",
+            description: "Double effectiveness of all cloth actions"
+        }
+    }));
+    const drillingUpgrade = createUpgrade(() => ({
+        resource: noPersist(paper),
+        cost: 1e9,
+        visibility: () => showIf(plastic.upgrades.paperTools.bought.value),
+        display: {
+            title: "Guide to drilling",
+            description: "Double drilling power"
+        }
+    }));
+    const oilUpgrade = createUpgrade(() => ({
+        resource: noPersist(paper),
+        cost: 1e10,
+        visibility: () => showIf(plastic.upgrades.paperTools.bought.value),
+        display: {
+            title: "Oil and where to find it",
+            description: "Double oil gain"
+        }
+    }));
+    const upgrades = { clothUpgrade, drillingUpgrade, oilUpgrade };
+
     const paperGain = createSequentialModifier(() => [
         createMultiplicativeModifier(() => ({
             multiplier: 2,
@@ -177,6 +238,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             multiplier: 2,
             description: "Scholar's jacket",
             enabled: cloth.paperUpgrades.paperUpgrade3.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 10,
+            description: "Felt Elbow Pads",
+            enabled: cloth.paperUpgrades.paperUpgrade4.bought
         }))
     ]) as WithRequired<Modifier, "description" | "revert">;
 
@@ -199,6 +265,17 @@ const layer = createLayer(id, function (this: BaseLayer) {
         />
     ));
 
+    globalBus.on("update", diff => {
+        if (Decimal.lt(main.day.value, day)) {
+            return;
+        }
+
+        paper.value = Decimal.times(diff, plastic.buyables.passivePaper.amount.value)
+            .times(paperConversion.currentGain.value)
+            .div(100)
+            .add(paper.value);
+    });
+
     const { total: totalPaper, trackerDisplay } = setUpDailyProgressTracker({
         resource: paper,
         goal: 5e3,
@@ -220,6 +297,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
         totalPaper,
         paperConversion,
         books,
+        upgrades,
         generalTabCollapsed,
         minWidth: 700,
         display: jsx(() => (
@@ -230,6 +308,8 @@ const layer = createLayer(id, function (this: BaseLayer) {
                 <Spacer />
                 {render(makePaper)}
                 <Spacer />
+                {renderRow(...Object.values(upgrades))}
+                <Spacer />
                 {renderCol(...Object.values(books))}
             </>
         ))

src/data/layers/plastic.tsx

@@ -0,0 +1,316 @@
+/**
+ * @module
+ * @hidden
+ */
+import Column from "components/layout/Column.vue";
+import Row from "components/layout/Row.vue";
+import Spacer from "components/layout/Spacer.vue";
+import Modal from "components/Modal.vue";
+import {
+    changeActiveBuyables,
+    createCollapsibleModifierSections,
+    setUpDailyProgressTracker
+} from "data/common";
+import { main } from "data/projEntry";
+import { createBuyable, GenericBuyable } from "features/buyable";
+import { jsx, showIf } from "features/feature";
+import MainDisplay from "features/resources/MainDisplay.vue";
+import { createResource, Resource } from "features/resources/resource";
+import { createUpgrade, GenericUpgrade } from "features/upgrades/upgrade";
+import { globalBus } from "game/events";
+import { BaseLayer, createLayer } from "game/layers";
+import {
+    createAdditiveModifier,
+    createMultiplicativeModifier,
+    createSequentialModifier
+} from "game/modifiers";
+import { noPersist, persistent } from "game/persistence";
+import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
+import { render, renderCol, renderRow } from "util/vue";
+import { computed, ref, unref } from "vue";
+import boxes from "./boxes";
+import metal from "./metal";
+import oil from "./oil";
+
+const id = "plastic";
+const day = 10;
+const layer = createLayer(id, function (this: BaseLayer) {
+    const name = "Plastic";
+    const color = "#DCD9CD";
+
+    const plastic = createResource<DecimalSource>(0, "plastic");
+
+    const [generalTab, generalTabCollapsed] = createCollapsibleModifierSections(() => [
+        {
+            title: "Plastic Gain",
+            modifier: plasticGain,
+            base: 0
+        }
+    ]);
+    const showModifiersModal = ref(false);
+    const modifiersModal = jsx(() => (
+        <Modal
+            modelValue={showModifiersModal.value}
+            onUpdate:modelValue={(value: boolean) => (showModifiersModal.value = value)}
+            v-slots={{
+                header: () => <h2>{name} Modifiers</h2>,
+                body: generalTab
+            }}
+        />
+    ));
+
+    const activeRefinery = persistent<DecimalSource>(0);
+    const oilCost = computed(() => Decimal.times(activeRefinery.value, 100));
+    const buildRefinery = createBuyable(() => ({
+        resource: metal.metal,
+        cost() {
+            const v = new Decimal(this.amount.value);
+            return Decimal.pow(1.2, v).times(1e7);
+        },
+        display: jsx(() => (
+            <>
+                <h3>Refinery</h3>
+                <br />
+                Refines oil into plastic pellets
+                <br />
+                Consumes 1000 oil/s to create 1 plastic/s
+                <br />
+                <br />
+                Currently:
+                <br />-{format(oilCost.value)} oil/sec
+                <br />+{format(activeRefinery.value)} drill power
+                <br />
+                <br />
+                Cost: {formatWhole(unref(buildRefinery.cost!))}{" "}
+                {buildRefinery.resource!.displayName}
+            </>
+        )),
+        onPurchase() {
+            activeRefinery.value = Decimal.add(activeRefinery.value, 1);
+        },
+        style: {
+            width: "300px"
+        }
+    })) as GenericBuyable & { resource: Resource };
+    const {
+        min: minRefinery,
+        max: maxRefinery,
+        add: addRefinery,
+        remove: removeRefinery
+    } = changeActiveBuyables({
+        buyable: buildRefinery,
+        active: activeRefinery,
+        style: { minHeight: "20px", width: "40px", color: "var(--feature-foreground)" }
+    });
+
+    const upgradeCost = computed(() =>
+        Decimal.pow(
+            5,
+            Decimal.add(
+                [...Object.values(upgrades), ...Object.values(elfUpgrades)].filter(
+                    upg => upg.bought.value
+                ).length,
+                2
+            )
+        )
+    );
+    const paperTools = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        display: () => ({
+            title: "Plastic Scissors",
+            description: "Unlock paper upgrades",
+            showCost: !paperTools.bought.value
+        })
+    })) as GenericUpgrade;
+    const boxTools = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        display: () => ({
+            title: "Plastic Level",
+            description: "Unlock box upgrades",
+            showCost: !boxTools.bought.value
+        })
+    })) as GenericUpgrade;
+    const clothTools = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        display: () => ({
+            title: "Plastic Cane",
+            description: "Unlock cloth upgrades",
+            showCost: !clothTools.bought.value
+        })
+    })) as GenericUpgrade;
+    const upgrades = { paperTools, boxTools, clothTools };
+
+    const paperElf = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        visibility: () => showIf(paperTools.bought.value),
+        display: () => ({
+            title: "Paper Elf Recruitment",
+            description: "Double plastic gain and unlock a new elf for training",
+            showCost: !paperElf.bought.value
+        })
+    })) as GenericUpgrade;
+    const boxElf = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        visibility: () => showIf(boxTools.bought.value),
+        display: () => ({
+            title: "Box Elf Recruitment",
+            description: "Double plastic gain and unlock a new elf for training",
+            showCost: !boxElf.bought.value
+        })
+    })) as GenericUpgrade;
+    const clothElf = createUpgrade(() => ({
+        resource: noPersist(plastic),
+        cost: upgradeCost,
+        visibility: () => showIf(clothTools.bought.value),
+        display: () => ({
+            title: "Cloth Elf Recruitment",
+            description: "Double plastic gain and unlock a new elf for training",
+            showCost: !clothElf.bought.value
+        })
+    })) as GenericUpgrade;
+    const elfUpgrades = { paperElf, boxElf, clothElf };
+
+    const passivePaper = createBuyable(() => ({
+        resource: noPersist(plastic),
+        cost() {
+            const amount = this.amount.value;
+            return Decimal.pow(1.3, amount).times(100);
+        },
+        visibility: () => showIf(paperElf.bought.value),
+        display: {
+            title: "Plastic Printing Press",
+            description: "Gain +1% of your paper gain per second",
+            effectDisplay: jsx(() => <>{formatWhole(passivePaper.amount.value)}%</>),
+            showAmount: false
+        }
+    })) as GenericBuyable;
+    const passiveBoxes = createBuyable(() => ({
+        resource: noPersist(plastic),
+        cost() {
+            const amount = this.amount.value;
+            return Decimal.pow(1.3, amount).times(100);
+        },
+        visibility: () => showIf(boxElf.bought.value),
+        display: {
+            title: "Plastic Box Folder",
+            description: "Gain +1% of your box gain per second",
+            effectDisplay: jsx(() => <>{formatWhole(passiveBoxes.amount.value)}%</>),
+            showAmount: false
+        }
+    })) as GenericBuyable;
+    const clothGains = createBuyable(() => ({
+        resource: noPersist(plastic),
+        cost() {
+            const amount = this.amount.value;
+            return Decimal.pow(1.3, amount).times(100);
+        },
+        visibility: () => showIf(clothElf.bought.value),
+        display: {
+            title: "Plastic Shepherd",
+            description: "All cloth actions complete +10% amounts per cycle",
+            effectDisplay: jsx(() => (
+                <>{formatWhole(Decimal.times(clothGains.amount.value, 10))}%</>
+            )),
+            showAmount: false
+        }
+    })) as GenericBuyable;
+    const buyables = { passivePaper, passiveBoxes, clothGains };
+
+    const plasticGain = createSequentialModifier(() => [
+        createAdditiveModifier(() => ({
+            addend: activeRefinery,
+            description: "Oil Refinery",
+            enabled: () => Decimal.gt(activeRefinery.value, 0)
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Paper Elf Recruitment",
+            enabled: paperElf.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Box Elf Recruitment",
+            enabled: boxElf.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Cloth Elf Recruitment",
+            enabled: clothElf.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 2,
+            description: "Carry plastic in boxes",
+            enabled: boxes.row2Upgrades.plasticUpgrade.bought
+        })),
+        createMultiplicativeModifier(() => ({
+            multiplier: () => oil.oilEffectiveness.value,
+            description: "Effectiveness",
+            enabled: () => Decimal.lt(oil.oilEffectiveness.value, 1)
+        }))
+    ]);
+    const computedPlasticGain = computed(() => plasticGain.apply(0));
+
+    globalBus.on("update", diff => {
+        if (Decimal.lt(main.day.value, day)) {
+            return;
+        }
+
+        plastic.value = Decimal.times(diff, computedPlasticGain.value).add(plastic.value);
+    });
+
+    const { total: totalPlastic, trackerDisplay } = setUpDailyProgressTracker({
+        resource: plastic,
+        goal: 2.5e5,
+        name,
+        day,
+        color,
+        textColor: "var(--feature-foreground)",
+        modal: {
+            show: showModifiersModal,
+            display: modifiersModal
+        }
+    });
+
+    return {
+        name,
+        color,
+        plastic,
+        totalPlastic,
+        buildRefinery,
+        activeRefinery,
+        oilCost,
+        upgrades,
+        elfUpgrades,
+        buyables,
+        generalTabCollapsed,
+        minWidth: 700,
+        display: jsx(() => (
+            <>
+                {render(trackerDisplay)}
+                <Spacer />
+                <MainDisplay resource={plastic} color={color} style="margin-bottom: 0" />
+                <Spacer />
+                <Column>
+                    {render(buildRefinery)}
+                    <div>
+                        {formatWhole(Decimal.floor(activeRefinery.value))}/
+                        {formatWhole(Decimal.floor(buildRefinery.amount.value))}
+                    </div>
+                    {renderRow(minRefinery, removeRefinery, addRefinery, maxRefinery)}
+                </Column>
+                <Row>
+                    {renderCol(paperTools, paperElf, passivePaper)}
+                    {renderCol(boxTools, boxElf, passiveBoxes)}
+                    {renderCol(clothTools, clothElf, clothGains)}
+                </Row>
+            </>
+        ))
+    };
+});
+
+export default layer;

src/data/layers/trees.tsx

@@ -414,6 +414,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
             description: "Carry more logs",
             enabled: boxes.upgrades.logsUpgrade.bought
         })),
+        createMultiplicativeModifier(() => ({
+            multiplier: 10,
+            description: "Felt-Gripped Axe",
+            enabled: cloth.treesUpgrades.treesUpgrade4.bought
+        })),
         createExponentialModifier(() => ({
             exponent: 1.2,
             description: "100% Foundation Completed",

src/data/projEntry.tsx

@@ -29,6 +29,7 @@ import boxesSymbol from "./symbols/cardboardBox.png";
 import metalSymbol from "./symbols/metal.png";
 import clothSymbol from "./symbols/cloth.png";
 import oilSymbol from "./symbols/oil.png";
+import plasticSymbol from "./symbols/plastic.png";
 import coal from "./layers/coal";
 import elves from "./layers/elves";
 import paper from "./layers/paper";
@@ -36,6 +37,7 @@ import boxes from "./layers/boxes";
 import metal from "./layers/metal";
 import cloth from "./layers/cloth";
 import oil from "./layers/oil";
+import plastic from "./layers/plastic";
 
 export interface Day extends VueFeature {
     day: number;
@@ -236,10 +238,11 @@ export const main = createLayer("main", function (this: BaseLayer) {
         createDay(() => ({
             day: 10,
             shouldNotify: false,
-            layer: null, // "plastic"
+            layer: "plastic",
-            symbol: "",
+            symbol: plasticSymbol,
-            story: "",
+            story: "Now that plenty of oil has been prepared, it's time to start refining it into plastic! This should be incredibly useful not only for toys, but making tools and other items!",
-            completedStory: ""
+            completedStory:
+                "You've started refining massive amounts of oil into slightly less massive amounts of plastic. You have a slight pang of regret thinking of the environmental impact, but ultimately decide Christmas is worth it. Good Job!"
         })),
         createDay(() => ({
             day: 11,
@@ -412,7 +415,19 @@ export const main = createLayer("main", function (this: BaseLayer) {
 export const getInitialLayers = (
     /* eslint-disable-next-line @typescript-eslint/no-unused-vars */
     player: Partial<PlayerData>
-): Array<GenericLayer> => [main, trees, workshop, coal, elves, paper, boxes, metal, cloth, oil];
+): Array<GenericLayer> => [
+    main,
+    trees,
+    workshop,
+    coal,
+    elves,
+    paper,
+    boxes,
+    metal,
+    cloth,
+    oil,
+    plastic
+];
 
 /**
  * A computed ref whose value is true whenever the game is over.