Technological Bench

<style> .tb-tabs{display:flex;gap:6px;margin-bottom:12px;} .tb-tab{flex:1;padding:8px 0;font-size:13px;font-weight:600;text-align:center;border-radius:8px;border:1px solid #444;color:#aaa;cursor:pointer;background:#1a1a1a;} .tb-tab.active{background:#2a2a2a;color:#fff;border-color:#888;} .tb-tab:hover:not(.active){background:#222;color:#ddd;} .tb-panel{display:none;} .tb-panel.active{display:block;} .tb-select{width:100%;padding:9px 10px;font-size:13px;border-radius:8px;border:1px solid #333;background:#1a1a1a;color:#eee;margin-bottom:10px;} .tb-output{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:10px;padding:12px 14px;display:none;} .tb-out-title{font-size:13px;font-weight:700;color:#eee;margin-bottom:8px;} .tb-line{font-size:12px;color:#999;padding:5px 0;border-top:1px solid #2a2a2a;} .tb-line:first-of-type{border-top:none;} .tb-tier{font-size:10px;font-weight:600;color:#666;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:1px;} </style>

Survival

Production

Combat

Build

<select class="tb-select" id="survivalSelect"> <option value="">Select item</option> <option value="stove">Primary stove</option> <option value="meat">Meat drier</option> <option value="treatment">Treatment</option> <option value="adrenaline">Adrenaline shots</option> <option value="waterfilter">Compact water filter</option> <option value="rainwater">Rainwater collection system</option> </select>

<select class="tb-select"><option value="">Select item</option></select>

<select class="tb-select"><option value="">Select item</option></select>

<select class="tb-select"><option value="">Select item</option></select>

<script> var data={stove:{title:"Primary stove",tiers:[{label:"Tech level 1",recipe:"29 Copper Ore · 17 Gravel · 25 Wood"},{label:"Tech level 8",recipe:"29 Copper Ore · 17 Gravel · 25 Wood"},{label:"Tech level 12",recipe:"30 Copper Ore · 25 Gravel · 17 Wood"}]},meat:{title:"Meat drier",tiers:[{label:"Tech level 1",recipe:"9 Iron Ingot · 13 Metal Scraps · 17 Wood"},{label:"Tech level 8",recipe:"6 Iron Ingot · 8 Metal Scraps · 17 Wood"},{label:"Tech level 12",recipe:"9 Iron Ingot · 8 Metal Scraps · 17 Wood"}]},treatment:{title:"Treatment",tiers:[{label:"Tech level 1",recipe:"1 Detoxident · 1 Glass · 5 Rubber · 1 Acid · 1 Boiled Water"},{label:"Tech level 8",recipe:"1 Detoxident · 1 Glass · 3 Rubber · 1 Acid · 1 Boiled Water"},{label:"Tech level 12",recipe:"1 Detoxident · 1 Glass · 5 Rubber · 1 Acid · 1 Boiled Water"}]},adrenaline:{title:"Adrenaline shots",tiers:[{label:"Tech level 1",recipe:"7 Acid · 1 Glass · 2 Rubber · 17 Stardust Source"},{label:"Tech level 8",recipe:"3 Acid · 1 Glass · 2 Rubber · 17 Stardust Source"},{label:"Tech level 12",recipe:"5 Acid · 1 Glass · 2 Rubber · 17 Stardust Source"}]},waterfilter:{title:"Compact water filter",tiers:[{label:"Tech level 1",recipe:"41 Wood · 13 Adhesive · 17 Charcoal · 21 Iron Ingot · 1 Power Cable"},{label:"Tech level 8",recipe:"41 Wood · 13 Adhesive · 17 Charcoal · 21 Iron Ingot · 1 Power Cable"},{label:"Tech level 12",recipe:"41 Wood · 13 Adhesive · 17 Charcoal · 21 Iron Ingot · 1 Power Cable"}]},rainwater:{title:"Rainwater collection system",tiers:[{label:"Tech level 1",recipe:"25 Wood · 13 Fiber · 5 Rubber"},{label:"Tech level 8",recipe:"25 Wood · 13 Fiber · 2 Rubber"},{label:"Tech level 12",recipe:"26 Wood · 13 Fiber · 3 Rubber"}]}}; document.querySelectorAll('.tb-tab').forEach(function(btn){btn.onclick=function(){document.querySelectorAll('.tb-tab').forEach(function(b){b.classList.remove('active');});document.querySelectorAll('.tb-panel').forEach(function(p){p.classList.remove('active');});btn.classList.add('active');document.getElementById(btn.dataset.tab).classList.add('active');};});

document.getElementById('survivalSelect').onchange=function(){var out=document.getElementById('survivalOutput');var item=data[this.value];if(!item){out.style.display='none';return;}out.innerHTML='

'+item.title+'

'+item.tiers.map(function(t){return'

'+t.label+''+t.recipe+'

';}).join();out.style.display='block';};

</script>