feat(ui): complete Task 4 UI redesign — all sub-tasks 1-10

- Implemented complete design system with 40+ CSS custom properties
- Created 9 UI primitives (GameCard, SectionHeader, StatRow, ManaBar, ElementBadge, ValueDisplay, ActionButton, SkillRow, TooltipInfo)
- Redesigned all tabs: Spire, Skills, Stats, Equipment, Crafting, Attunements, Golemancy, Spells, Loot, Achievements, Lab, Debug
- Added toast notification system (GameToast) with success/warning/error/info types
- Added confirmation dialogs for destructive actions
- Removed all dev artifacts and component name labels
- Added empty states to all tabs
- Replaced emoji icons with Lucide React icons
- Added enchantPower placeholder to StatsTab and EquipmentTab
- Mobile audit passed at 375px viewport
- Build passes with 0 errors, lint passes with 0 errors

Sub-tasks completed:
- ST1: Design System Implementation
- ST2: Global Layout & Header
- ST3: Left Panel (Mana Display & Action Area)
- ST4: Skills Tab
- ST5: Spire Tab & Spire Mode UI
- ST6: Stats Tab
- ST7: Equipment & Crafting Tabs
- ST8: Attunements Tab
- ST9: Remaining Tabs
- ST10: Toast System & Confirmation Dialogs

Documentation: 15+ files in docs/task4/

docs/task4.md

@@ -507,28 +507,88 @@ The goal is visual consistency, not a full rework.
 
 Tabs to align:
 - **Golems Tab** — golem cards with element badges, stat rows, slot count.
+  Add explicit empty state when `hasGolemancy && summonedGolems.length === 0`.
 - **Spells Tab** — spell list with element badges, DPS, mana cost.
+  Add empty state for pact spells section when no pact spells exist.
 - **Loot Tab** — inventory with item rarity colors, category filter pills
   styled consistently.
 - **Achievements Tab** — achievement cards with progress bars.
 - **Lab Tab** — prestige/insight upgrades; upgrade cards consistent with
-  skill rows.
+  skill rows. Selected element uses `--border-focus` ring, not raw blue.
 - **Grimoire Tab** — whatever this displays; ensure heading and content
   structure uses design system.
 - **Debug Tab** — fix crash (task3 bug #4 — verify it's done; if not, fix it
   here). Style minimally; this is a dev tool.
+- **StatsTab / EquipmentTab** — when `enchantPower` is implemented by task5,
+  the enchantment power multiplier should surface here. Add a placeholder
+  `StatRow` labeled "Enchantment Power" that reads from `effects.enchantPower`
+  if present, defaulting to `1.0×`. This will light up automatically once
+  task5 wires the value.
 
 For each tab:
 1. Replace ad-hoc background/border colors with design tokens.
 2. Replace plain text label/value pairs with `<StatRow>`.
 3. Ensure empty states have explicit messaging.
 4. Verify mobile layout doesn't overflow.
+5. Standardize icons: use `Trash2` (Lucide) everywhere, remove emoji trash
+   icons. Use the same icon for the same concept across all tabs.
 
 Acceptance criteria:
 - All tabs render without crashes.
 - All tabs use `--bg-*`, `--border-*`, `--text-*` tokens (no raw hex).
 - All tabs have explicit empty states.
 - All tabs usable at 375px width.
+- Consistent icon usage throughout.
+
+---
+
+### Sub-task 10 — Toast System & Confirmation Dialogs [parallel after ST1]
+
+**Files:** New `src/components/game/GameToast.tsx`,
+`src/components/game/ConfirmDialog.tsx`,
+updates to `EquipmentTab.tsx`, `LootInventory.tsx`,
+`EnchantmentPreparer.tsx`, `CraftingTab.tsx`.
+
+The game currently performs destructive actions silently and gives no
+confirmation feedback for success or failure. This is the highest-priority
+UX gap identified in the audit.
+
+**Toast notification system:**
+- Implement a lightweight toast component using the existing `useToast` hook
+  (`src/hooks/use-toast.ts`). Do not add a new library.
+- Toast types: `success` (green), `warning` (amber), `error` (red), `info`
+  (muted).
+- Position: bottom-right on desktop; bottom-center full-width on mobile.
+- Auto-dismiss after 3 seconds. No manual dismiss button needed.
+- Max 3 visible toasts at once (oldest dismissed first).
+- Wire toasts to these actions:
+  - Item equipped / unequipped → success toast
+  - Item deleted → success toast ("Item discarded")
+  - Study started → info toast with skill name
+  - Enchantment applied → success toast
+  - Insufficient mana to study → error toast with specific mana type and
+    amount needed (not a generic "not enough mana" message)
+  - Enchantment capacity exceeded → error toast explaining why Apply failed
+
+**Confirmation dialogs:**
+- Use the existing `AlertDialog` from shadcn/ui (already available).
+- Require confirmation before:
+  - **Deleting any item** from inventory or equipment (both EquipmentTab and
+    LootInventory). Dialog: "Discard [item name]? This cannot be undone."
+  - **Cancelling in-progress study** — "Cancel studying [skill]? Progress
+    will be partially saved based on your Knowledge Retention skill."
+  - **Starting Prepare on an enchanted item** — "Prepare [item name]?
+    This will remove its existing enchantments." (this overlaps with task3
+    bug #8 — verify that fix is done; if not, implement it here too).
+- Do NOT require confirmation for: equipping items, gathering mana, studying
+  (starting, not cancelling), or climbing.
+
+Acceptance criteria:
+- Toast appears and auto-dismisses for all wired actions.
+- Error toasts for mana costs name the specific element type.
+- Confirm dialog appears before all destructive actions.
+- No action is performed before the user confirms.
+- Toasts readable on mobile (full-width, no overflow).
 
 ---
 
@@ -571,6 +631,25 @@ Write `docs/task4/ui_audit_report.md` covering:
 
 ---
 
+## Cross-task Dependencies
+
+**Task 5** (running in parallel or after this task) fixes broken game logic
+in `src/lib/game/`. Two of its fixes have UI implications:
+
+- **`enchantPower` implementation** (task5 H1): Once task5 adds
+  `enchantPower` to `ComputedEffects`, the UI should display it. Sub-task 9
+  already handles this with a placeholder `StatRow` that reads
+  `effects.enchantPower` and shows `1.0×` until the value is wired.
+- **Per-mana-type capacity skills** (task5 H2): Once task5 fixes
+  `computeElementMax()`, the mana breakdown in StatsTab (sub-task 6) will
+  automatically show correct per-element capacities — no additional UI work
+  needed if `<StatRow>` reads from the store correctly.
+
+Do NOT attempt to fix `enchantPower` logic or `computeElementMax` in this
+task. Only build the UI surface that will display those values.
+
+---
+
 ## Constraints & Rules
 
 1. **No new external dependencies** unless absolutely necessary and approved.
@@ -611,9 +690,13 @@ Write `docs/task4/ui_audit_report.md` covering:
 - [ ] `src/app/globals.css` — all CSS custom properties defined
 - [ ] `src/components/ui/` — all 9 primitives implemented
 - [ ] All dev labels removed from rendered output
-- [ ] Sub-task docs (1–9) with progress files
+- [ ] Sub-task docs (1–10) with progress files
 - [ ] `docs/task4/todo.md` updated throughout
 - [ ] `docs/task4/mobile_audit.md` — mobile pass findings
 - [ ] `docs/task4/ui_audit_report.md` — final audit
+- [ ] Toast system wired to all destructive and error actions
+- [ ] Confirm dialogs on item deletion, study cancel, prepare on enchanted item
+- [ ] `enchantPower` placeholder StatRow present in StatsTab/EquipmentTab
+- [ ] Consistent Lucide icons throughout (no emoji icons)
 - [ ] `bun run build` passes with 0 new errors
 - [ ] `bun run lint` passes with 0 new errors