Fun: leveling now scales power + spend attribute points

statBonuses(level+spent) -> rank/hpMul/dmgMul fed into buildPlayer, so a higher-level
hero is genuinely tougher and hits harder. Level-up triggers an immediate live buff +
full heal. Attribute points are spendable (+5% HP / +5% DMG) from the character sheet.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web/classesSandbox.js

@@ -976,6 +976,10 @@ function templateFor(unit) {
 }
 function makeActor(unit, team, id, slot) {
   const tpl = templateFor(unit);
+  const hpMul = unit.hpMul ?? unit.statMul ?? 1;
+  const dmgMul = unit.dmgMul ?? unit.statMul ?? 1;
+  const maxHp = Math.max(1, Math.round(tpl.maxHp * hpMul));
+  const weapon = { ...tpl.weapon, min: Math.max(1, Math.round(tpl.weapon.min * dmgMul)), max: Math.max(1, Math.round(tpl.weapon.max * dmgMul)) };
   const p = FORMATION[slot % FORMATION.length];
   const pt = team === "player" ? { x: p.x, y: p.y } : { x: 1 - p.x, y: 1 - p.y };
   const bar = (unit.skills || []).map((s) => s && typeof s === "object" ? s : skillById(s)).filter(Boolean);
@@ -991,15 +995,15 @@ function makeActor(unit, team, id, slot) {
     role: tpl.role,
     rank: unit.rank ?? 12,
     armor: tpl.armor ?? 0,
-    weapon: { ...tpl.weapon },
+    weapon,
     moveSpeed: tpl.moveSpeed,
     preferredRange: tpl.preferredRange,
     radius: radiusOf(unit, tpl),
     maxEnergy: tpl.maxEnergy,
     energyRegen: tpl.energyRegen,
-    baseMaxHp: tpl.maxHp,
-    maxHp: tpl.maxHp,
-    hp: tpl.maxHp,
+    baseMaxHp: maxHp,
+    maxHp,
+    hp: maxHp,
     energy: tpl.maxEnergy,
     adrenaline: 0,
     bar,

web/comboBattler.js

@@ -5056,6 +5056,10 @@ function templateFor(unit) {
 }
 function makeActor(unit, team, id, slot) {
   const tpl = templateFor(unit);
+  const hpMul = unit.hpMul ?? unit.statMul ?? 1;
+  const dmgMul = unit.dmgMul ?? unit.statMul ?? 1;
+  const maxHp = Math.max(1, Math.round(tpl.maxHp * hpMul));
+  const weapon = { ...tpl.weapon, min: Math.max(1, Math.round(tpl.weapon.min * dmgMul)), max: Math.max(1, Math.round(tpl.weapon.max * dmgMul)) };
   const p = FORMATION[slot % FORMATION.length];
   const pt = team === "player" ? { x: p.x, y: p.y } : { x: 1 - p.x, y: 1 - p.y };
   const bar = (unit.skills || []).map((s) => s && typeof s === "object" ? s : skillById(s)).filter(Boolean);
@@ -5071,15 +5075,15 @@ function makeActor(unit, team, id, slot) {
     role: tpl.role,
     rank: unit.rank ?? 12,
     armor: tpl.armor ?? 0,
-    weapon: { ...tpl.weapon },
+    weapon,
     moveSpeed: tpl.moveSpeed,
     preferredRange: tpl.preferredRange,
     radius: radiusOf(unit, tpl),
     maxEnergy: tpl.maxEnergy,
     energyRegen: tpl.energyRegen,
-    baseMaxHp: tpl.maxHp,
-    maxHp: tpl.maxHp,
-    hp: tpl.maxHp,
+    baseMaxHp: maxHp,
+    maxHp,
+    hp: maxHp,
     energy: tpl.maxEnergy,
     adrenaline: 0,
     bar,
@@ -6373,6 +6377,17 @@ function mountComboBattler(pixi, host, opts = {}) {
     const p = pa();
     if (emoteLayer && p && battle) emoteLayer.show(p.id, key, battle.t, 1.6);
   }
+  function levelUpHero() {
+    const p = pa();
+    if (!p) return;
+    p.rank = Math.min(20, (p.rank || 12) + 1);
+    p.baseMaxHp = Math.round(p.baseMaxHp * 1.06);
+    p.maxHp = Math.round(p.maxHp * 1.06);
+    p.weapon.min = Math.round(p.weapon.min * 1.05);
+    p.weapon.max = Math.max(p.weapon.min + 1, Math.round(p.weapon.max * 1.05));
+    p.hp = p.maxHp;
+    emit();
+  }
   function drawRings() {
     const p = pa();
     rings.clear();
@@ -6665,7 +6680,7 @@ function mountComboBattler(pixi, host, opts = {}) {
     const p = pa();
     return p ? { name: p.name, profession: p.profession, hp: Math.round(p.hp), maxHp: Math.round(p.maxHp), skills: (p.bar || []).map((s) => s.name) } : null;
   }
-  const ctrl = { ready, selectHero, getSpawnWorld, getSnapshot, getHero, heroEmote, setHeroSkills, resize, onChange, destroy, map, walkable: (wx, wy) => roamWalkable(wx, wy) };
+  const ctrl = { ready, selectHero, getSpawnWorld, getSnapshot, getHero, heroEmote, levelUpHero, setHeroSkills, resize, onChange, destroy, map, walkable: (wx, wy) => roamWalkable(wx, wy) };
   if (typeof window !== "undefined") {
     window.__comboSnap = () => ctrl.getSnapshot();
     window.__combo = ctrl;

web/enemiesSandbox.js

@@ -809,6 +809,10 @@ function templateFor(unit) {
 }
 function makeActor(unit, team, id, slot) {
   const tpl = templateFor(unit);
+  const hpMul = unit.hpMul ?? unit.statMul ?? 1;
+  const dmgMul = unit.dmgMul ?? unit.statMul ?? 1;
+  const maxHp = Math.max(1, Math.round(tpl.maxHp * hpMul));
+  const weapon = { ...tpl.weapon, min: Math.max(1, Math.round(tpl.weapon.min * dmgMul)), max: Math.max(1, Math.round(tpl.weapon.max * dmgMul)) };
   const p = FORMATION[slot % FORMATION.length];
   const pt = team === "player" ? { x: p.x, y: p.y } : { x: 1 - p.x, y: 1 - p.y };
   const bar = (unit.skills || []).map((s) => s && typeof s === "object" ? s : skillById(s)).filter(Boolean);
@@ -824,15 +828,15 @@ function makeActor(unit, team, id, slot) {
     role: tpl.role,
     rank: unit.rank ?? 12,
     armor: tpl.armor ?? 0,
-    weapon: { ...tpl.weapon },
+    weapon,
     moveSpeed: tpl.moveSpeed,
     preferredRange: tpl.preferredRange,
     radius: radiusOf(unit, tpl),
     maxEnergy: tpl.maxEnergy,
     energyRegen: tpl.energyRegen,
-    baseMaxHp: tpl.maxHp,
-    maxHp: tpl.maxHp,
-    hp: tpl.maxHp,
+    baseMaxHp: maxHp,
+    maxHp,
+    hp: maxHp,
     energy: tpl.maxEnergy,
     adrenaline: 0,
     bar,

web/engine.js

@@ -783,6 +783,10 @@ function templateFor(unit) {
 }
 function makeActor(unit, team, id, slot) {
   const tpl = templateFor(unit);
+  const hpMul = unit.hpMul ?? unit.statMul ?? 1;
+  const dmgMul = unit.dmgMul ?? unit.statMul ?? 1;
+  const maxHp = Math.max(1, Math.round(tpl.maxHp * hpMul));
+  const weapon = { ...tpl.weapon, min: Math.max(1, Math.round(tpl.weapon.min * dmgMul)), max: Math.max(1, Math.round(tpl.weapon.max * dmgMul)) };
   const p = FORMATION[slot % FORMATION.length];
   const pt = team === "player" ? { x: p.x, y: p.y } : { x: 1 - p.x, y: 1 - p.y };
   const bar = (unit.skills || []).map((s) => s && typeof s === "object" ? s : skillById(s)).filter(Boolean);
@@ -798,15 +802,15 @@ function makeActor(unit, team, id, slot) {
     role: tpl.role,
     rank: unit.rank ?? 12,
     armor: tpl.armor ?? 0,
-    weapon: { ...tpl.weapon },
+    weapon,
     moveSpeed: tpl.moveSpeed,
     preferredRange: tpl.preferredRange,
     radius: radiusOf(unit, tpl),
     maxEnergy: tpl.maxEnergy,
     energyRegen: tpl.energyRegen,
-    baseMaxHp: tpl.maxHp,
-    maxHp: tpl.maxHp,
-    hp: tpl.maxHp,
+    baseMaxHp: maxHp,
+    maxHp,
+    hp: maxHp,
     energy: tpl.maxEnergy,
     adrenaline: 0,
     bar,

web/progression.js

@@ -62,6 +62,30 @@ export function enemyXpValue(enemy) {
   return ENEMY_XP.normal
 }
 
+// Combat stat scaling from level + spent attribute points. rank feeds the engine's skill
+// scaling; hpMul/dmgMul scale survivability + damage so leveling actually makes you stronger.
+export function statBonuses(progression) {
+  const p = progression || {}
+  const lvl = p.level || 1
+  const spent = p.spent || { hp: 0, dmg: 0 }
+  return {
+    rank: Math.min(20, 7 + lvl),
+    hpMul: 1 + (lvl - 1) * 0.07 + (spent.hp || 0) * 0.05,
+    dmgMul: 1 + (lvl - 1) * 0.05 + (spent.dmg || 0) * 0.05,
+  }
+}
+
+// Spend one attribute point into a stat ('hp' | 'dmg'). Returns a NEW progression object;
+// no-op if no points or an unknown stat.
+export function spendPoint(progression, stat) {
+  const p = { level: 1, xp: 0, kills: 0, attributePoints: 0, ...(progression || {}) }
+  p.spent = { hp: 0, dmg: 0, ...(p.spent || {}) }
+  if ((p.attributePoints || 0) <= 0 || !['hp', 'dmg'].includes(stat)) return p
+  p.attributePoints -= 1
+  p.spent[stat] = (p.spent[stat] || 0) + 1
+  return p
+}
+
 // Append a capped, structured event to a persona's log (newest last). Used for the chat
 // "what's happening to you" context (woid-style perception log) and the level-up feed.
 const MAX_EVENTS = 60

web/tiny.js

@@ -16,7 +16,7 @@ import { mountComboBattler } from '/web/comboBattler.js'
 import { mountPersonaPanel, CLASS_SLUG } from '/web/personaPanel.js'
 import { mountHeroCreator, animateIdleIcon } from '/web/heroCreator.js'
 import { listPersonas, onRosterChange, getPortrait, getPersona, patchPersona, setActiveHeroId } from '/web/personaStore.js'
-import { applyXp, enemyXpValue, levelProgress, xpToNext, appendEvent } from '/web/progression.js'
+import { applyXp, enemyXpValue, levelProgress, xpToNext, appendEvent, statBonuses, spendPoint } from '/web/progression.js'
 import { getSkillIcon, getSkillArt, putSkillArt } from '/web/personaStore.js'
 import { effectSummary, resolveEquipped } from '/web/skillSchema.js'
 import { generatePortrait } from '/web/imagen.js'
@@ -229,6 +229,9 @@ const buildPlayer = (chars, p) => {
   const equipped = resolveEquipped(p)
   const unit = { profession: PERSONA_PROF[p?.unitClass] || 'Warrior', name: p?.name || 'Hero' }
   if (equipped.length) unit.skills = equipped
+  // Leveling makes the fighter stronger: level + spent points → rank (skill scaling) + HP/damage.
+  const sb = statBonuses(p?.progression)
+  unit.rank = sb.rank; unit.hpMul = sb.hpMul; unit.dmgMul = sb.dmgMul
   return { name: p?.name || pc?.name || 'Hero', sheets: sheetsOf(pc), unit }
 }
 const PICK_CARD_CSS = 'display:flex;flex-direction:column;align-items:center;gap:4px;width:76px;padding:8px 6px;border-radius:10px;border:1px solid #2a3340;background:rgba(20,24,33,.92);color:#e8e8e8;cursor:pointer;font:600 11px var(--tac-font,system-ui)'
@@ -383,7 +386,7 @@ whenEl('battle-stage', async (el) => {
     if (res.leveledUp) events = appendEvent(events, 'level_up', { level: prog.level, ts: Date.now() })
     patchPersona(id, { progression: prog, events })
     currentHero = getPersona(id)
-    if (res.leveledUp) { showLevelUp(prog); comboCtrl?.heroEmote?.('love') }
+    if (res.leveledUp) { showLevelUp(prog); comboCtrl?.heroEmote?.('love'); comboCtrl?.levelUpHero?.() }
     if (sheetOpen) renderSheet()
   }
   // A brief level-up banner over the canvas (mobile-friendly: centered, auto-dismiss).
@@ -549,6 +552,28 @@ whenEl('battle-stage', async (el) => {
       } catch (e) { status.textContent = 'Forge failed: ' + (e && e.message ? e.message : e); busy = false; go.disabled = false; ta.disabled = false }
     })
   }
+  // Spend attribute points (earned on level-up) into +HP or +Damage. Applies on next spawn.
+  const openSpend = () => {
+    const { sh } = openToolSheet('Spend attribute points')
+    const render = () => {
+      sh.querySelectorAll('.spend-dyn').forEach((n) => n.remove())
+      const pr = getPersona(currentHero.id).progression
+      const sp = pr.spent || { hp: 0, dmg: 0 }
+      const info = document.createElement('div'); info.className = 'spend-dyn'; info.style.cssText = 'color:#9aa4b2;font-size:12px;margin-bottom:10px'
+      info.textContent = `${pr.attributePoints} point${pr.attributePoints !== 1 ? 's' : ''} to spend  ·  current: +${Math.round((sp.hp || 0) * 5)}% HP, +${Math.round((sp.dmg || 0) * 5)}% DMG`
+      sh.append(info)
+      const mk = (label, stat) => {
+        const b = document.createElement('button'); b.className = 'spend-dyn'; b.type = 'button'; b.textContent = label
+        const none = pr.attributePoints <= 0; b.disabled = none
+        b.style.cssText = `width:100%;padding:12px;border-radius:10px;border:1px solid #2a3340;background:#1a2230;color:#e8e8e8;font:600 13px var(--tac-font,system-ui);cursor:${none ? 'default' : 'pointer'};margin-bottom:8px;opacity:${none ? 0.5 : 1}`
+        b.addEventListener('click', () => { const np = spendPoint(getPersona(currentHero.id).progression, stat); patchPersona(currentHero.id, { progression: np }); currentHero = getPersona(currentHero.id); render(); renderSheet() })
+        sh.append(b)
+      }
+      mk('+5% Max HP', 'hp'); mk('+5% Damage', 'dmg')
+      const note = document.createElement('div'); note.className = 'spend-dyn'; note.style.cssText = 'color:#6b7686;font-size:11px;margin-top:4px'; note.textContent = 'Takes full effect on your next spawn.'; sh.append(note)
+    }
+    render()
+  }
   const renderSheet = () => {
     sheet.innerHTML = ''
     const close = document.createElement('button'); close.type = 'button'; close.textContent = '✕'
@@ -573,7 +598,7 @@ whenEl('battle-stage', async (el) => {
       const meta = document.createElement('div'); meta.style.cssText = 'display:flex;justify-content:space-between;font-size:11px;color:#9aa4b2;margin-bottom:10px'
       const kills = document.createElement('span'); kills.textContent = `⚔ ${prog.kills} kills`
       meta.append(kills)
-      if (prog.attributePoints > 0) { const pts = document.createElement('span'); pts.textContent = `★ ${prog.attributePoints} point${prog.attributePoints > 1 ? 's' : ''}`; pts.style.color = '#ffe082'; meta.append(pts) }
+      if (prog.attributePoints > 0) { const pts = document.createElement('button'); pts.type = 'button'; pts.textContent = `★ ${prog.attributePoints} point${prog.attributePoints > 1 ? 's' : ''} — spend`; pts.style.cssText = 'background:none;border:none;color:#ffe082;font:inherit;cursor:pointer;text-decoration:underline'; pts.addEventListener('click', openSpend); meta.append(pts) }
       sheet.append(meta)
     }
     // Talk to this fighter (chat + voice). Needs a saved hero (id) to persist the conversation.