diff --git a/.beans/nuzlocke-tracker-l12w--add-condition-badges-for-boss-pokemon-mechanics.md b/.beans/nuzlocke-tracker-l12w--add-condition-badges-for-boss-pokemon-mechanics.md
new file mode 100644
index 0000000..8f9b04f
--- /dev/null
+++ b/.beans/nuzlocke-tracker-l12w--add-condition-badges-for-boss-pokemon-mechanics.md
@@ -0,0 +1,18 @@
+---
+# nuzlocke-tracker-l12w
+title: Add condition badges for boss Pokemon mechanics
+status: in-progress
+type: feature
+priority: normal
+created_at: 2026-02-16T20:11:02Z
+updated_at: 2026-02-16T20:11:52Z
+---
+
+Add visible badges on boss Pokemon that have mechanic-related conditions (Mega Evolution, Gigantamax, Dynamax, Terastallize). Create a ConditionBadge component following the EncounterMethodBadge pattern and integrate it into BossDefeatModal and BossTeamPreview.
+
+## Checklist
+
+- [x] Create ConditionBadge component in frontend/src/components/ConditionBadge.tsx
+- [x] Add ConditionBadge to BossDefeatModal.tsx boss team preview
+- [x] Add ConditionBadge to RunEncounters.tsx BossTeamPreview
+- [x] Verify with tsc and oxlint
\ No newline at end of file
diff --git a/frontend/src/components/BossDefeatModal.tsx b/frontend/src/components/BossDefeatModal.tsx
index 6765d41..6def625 100644
--- a/frontend/src/components/BossDefeatModal.tsx
+++ b/frontend/src/components/BossDefeatModal.tsx
@@ -1,5 +1,6 @@
import { type FormEvent, useState, useMemo } from 'react'
import type { BossBattle, CreateBossResultInput } from '../types/game'
+import { ConditionBadge } from './ConditionBadge'
interface BossDefeatModalProps {
boss: BossBattle
@@ -108,6 +109,7 @@ export function BossDefeatModal({
Lv.{bp.level}
+
))}
diff --git a/frontend/src/components/ConditionBadge.tsx b/frontend/src/components/ConditionBadge.tsx
new file mode 100644
index 0000000..aba3aaf
--- /dev/null
+++ b/frontend/src/components/ConditionBadge.tsx
@@ -0,0 +1,36 @@
+const CONDITION_CONFIG: Record = {
+ 'Mega Evolution': {
+ label: 'Mega',
+ color: 'bg-fuchsia-100 text-fuchsia-800 dark:bg-fuchsia-900/40 dark:text-fuchsia-300',
+ },
+ Gigantamax: {
+ label: 'G-Max',
+ color: 'bg-red-100 text-red-800 dark:bg-red-900/40 dark:text-red-300',
+ },
+ Dynamax: {
+ label: 'D-Max',
+ color: 'bg-rose-100 text-rose-800 dark:bg-rose-900/40 dark:text-rose-300',
+ },
+ Terastallize: {
+ label: 'Tera',
+ color: 'bg-teal-100 text-teal-800 dark:bg-teal-900/40 dark:text-teal-300',
+ },
+}
+
+export function ConditionBadge({
+ condition,
+ size = 'sm',
+}: {
+ condition: string | null
+ size?: 'sm' | 'xs'
+}) {
+ if (!condition) return null
+ const config = CONDITION_CONFIG[condition]
+ if (!config) return null
+ const sizeClass = size === 'xs' ? 'text-[8px] px-1 py-0' : 'text-[9px] px-1.5 py-0.5'
+ return (
+
+ {config.label}
+
+ )
+}
diff --git a/frontend/src/pages/RunEncounters.tsx b/frontend/src/pages/RunEncounters.tsx
index 30f7eaf..f6b8842 100644
--- a/frontend/src/pages/RunEncounters.tsx
+++ b/frontend/src/pages/RunEncounters.tsx
@@ -22,6 +22,7 @@ import {
TypeBadge,
} from '../components'
import { BossDefeatModal } from '../components/BossDefeatModal'
+import { ConditionBadge } from '../components/ConditionBadge'
import type {
Route,
RouteWithChildren,
@@ -239,7 +240,10 @@ function BossTeamPreview({
) : (
)}
- Lvl {bp.level}
+
+ Lvl {bp.level}
+
+
))}