add markup columns

src/components/table/ProfitRow.vue

@@ -4,6 +4,11 @@
     :class="result.missingPrices ? 'opacity-60' : ''"
     @click="expanded = !expanded"
   >
+    <!-- Expand arrow -->
+    <td class="pl-4 pr-1 py-3 w-4">
+      <span class="text-gray-500 text-xs transition-transform duration-150 inline-block" :class="expanded ? 'rotate-90' : ''">▶</span>
+    </td>
+
     <!-- Variant badge -->
     <td class="px-4 py-3">
       <span
@@ -15,7 +20,6 @@
     <!-- Item name -->
     <td class="px-4 py-3">
       <div class="flex items-center gap-2">
-        <span class="text-gray-500 text-xs transition-transform duration-150" :class="expanded ? 'rotate-90' : ''">▶</span>
         <img
           :src="itemImageUrl(result.recipe.outputItemId)"
           :alt="result.recipe.displayName"
@@ -42,6 +46,18 @@
       {{ formatSilver(result.effectiveMaterialCost) }}
     </td>
 
+    <!-- +15% markup -->
+    <td class="px-4 py-3 text-sm font-mono text-blue-300"
+      :title="result.effectiveMaterialCost > 0 ? Math.round(result.effectiveMaterialCost * 1.15).toLocaleString() : undefined">
+      {{ result.effectiveMaterialCost > 0 ? formatSilver(Math.round(result.effectiveMaterialCost * 1.15)) : '—' }}
+    </td>
+
+    <!-- +30% markup -->
+    <td class="px-4 py-3 text-sm font-mono text-emerald-300"
+      :title="result.effectiveMaterialCost > 0 ? Math.round(result.effectiveMaterialCost * 1.30).toLocaleString() : undefined">
+      {{ result.effectiveMaterialCost > 0 ? formatSilver(Math.round(result.effectiveMaterialCost * 1.30)) : '—' }}
+    </td>
+
     <!-- Price age -->
     <td class="px-4 py-3">
       <span
@@ -91,7 +107,7 @@
 
   <!-- Expanded detail row -->
   <tr v-if="expanded" class="border-b border-gray-700/50 bg-gray-900/60">
-    <td colspan="6" class="px-6 py-4">
+    <td colspan="9" class="px-6 py-4">
       <div class="flex gap-8">
 
         <!-- Ingredients breakdown -->

src/components/table/TableHeader.vue

@@ -23,11 +23,14 @@
 <script setup lang="ts">
 import type { SortField, SortState } from '../../types/crafting'
 
-const columns: { field: SortField | 'status' | 'bill'; label: string; sortable: boolean }[] = [
+const columns: { field: SortField | 'status' | 'bill' | 'markup15' | 'markup30' | 'expand'; label: string; sortable: boolean }[] = [
+  { field: 'expand',      label: '',        sortable: false },
   { field: 'variantType', label: 'Variant', sortable: true },
   { field: 'displayName', label: 'Item', sortable: true },
   { field: 'tier', label: 'Tier', sortable: true },
-  { field: 'materialCost', label: 'Craft Cost', sortable: true },
+  { field: 'materialCost', label: 'Cost', sortable: true },
+  { field: 'markup15', label: '+15%', sortable: false },
+  { field: 'markup30', label: '+30%', sortable: false },
   { field: 'status', label: 'Price Age', sortable: false },
   { field: 'bill', label: '', sortable: false },
 ]