Add collapsible boss teams and hide attempts in hardcore mode

Boss battle cards now collapse the pokemon team by default with a
chevron toggle. Expanded teams show larger sprites with "Lvl" prefix.
In hardcore mode, the BossDefeatModal hides the attempts field and
lost button since a loss ends the run.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/pages/RunEncounters.tsx

@@ -337,6 +337,7 @@ export function RunEncounters() {
     useState<EncounterDetail | null>(null)
   const [showEndRun, setShowEndRun] = useState(false)
   const [showShinyModal, setShowShinyModal] = useState(false)
+  const [expandedBosses, setExpandedBosses] = useState<Set<number>>(new Set())
   const [showTeam, setShowTeam] = useState(true)
   const [filter, setFilter] = useState<'all' | RouteStatus>('all')
 
@@ -1021,6 +1022,16 @@ export function RunEncounters() {
                   other: 'border-gray-400 dark:border-gray-500',
                 }
 
+                const isBossExpanded = expandedBosses.has(boss.id)
+                const toggleBoss = () => {
+                  setExpandedBosses((prev) => {
+                    const next = new Set(prev)
+                    if (next.has(boss.id)) next.delete(boss.id)
+                    else next.add(boss.id)
+                    return next
+                  })
+                }
+
                 return (
                   <div
                     key={`boss-${boss.id}`}
@@ -1028,8 +1039,20 @@ export function RunEncounters() {
                       isDefeated ? 'bg-green-50/50 dark:bg-green-900/10' : 'bg-white dark:bg-gray-800'
                     } px-4 py-3`}
                   >
-                    <div className="flex items-start justify-between">
+                    <div
+                      className="flex items-start justify-between cursor-pointer select-none"
+                      onClick={toggleBoss}
+                    >
                       <div className="flex items-center gap-3">
+                        <svg
+                          className={`w-4 h-4 text-gray-400 transition-transform ${isBossExpanded ? 'rotate-90' : ''}`}
+                          fill="none"
+                          viewBox="0 0 24 24"
+                          stroke="currentColor"
+                          strokeWidth={2}
+                        >
+                          <path strokeLinecap="round" strokeLinejoin="round" d="M9 5l7 7-7 7" />
+                        </svg>
                         {boss.spriteUrl && (
                           <img src={boss.spriteUrl} alt={boss.name} className="w-10 h-10" />
                         )}
@@ -1047,7 +1070,7 @@ export function RunEncounters() {
                           </p>
                         </div>
                       </div>
-                      <div>
+                      <div onClick={(e) => e.stopPropagation()}>
                         {isDefeated ? (
                           <span className="inline-flex items-center gap-1 px-2 py-1 text-xs font-medium rounded-full bg-green-100 dark:bg-green-900/40 text-green-700 dark:text-green-300">
                             Defeated &#10003;
@@ -1063,19 +1086,19 @@ export function RunEncounters() {
                       </div>
                     </div>
                     {/* Boss pokemon team */}
-                    {boss.pokemon.length > 0 && (
+                    {isBossExpanded && boss.pokemon.length > 0 && (
                       <div className="flex gap-2 mt-2 flex-wrap">
                         {boss.pokemon
                           .sort((a, b) => a.order - b.order)
                           .map((bp) => (
                             <div key={bp.id} className="flex items-center gap-1">
                               {bp.pokemon.spriteUrl ? (
-                                <img src={bp.pokemon.spriteUrl} alt={bp.pokemon.name} className="w-6 h-6" />
+                                <img src={bp.pokemon.spriteUrl} alt={bp.pokemon.name} className="w-10 h-10" />
                               ) : (
-                                <div className="w-6 h-6 bg-gray-200 dark:bg-gray-700 rounded-full" />
+                                <div className="w-10 h-10 bg-gray-200 dark:bg-gray-700 rounded-full" />
                               )}
                               <span className="text-xs text-gray-500 dark:text-gray-400">
-                                {bp.level}
+                                Lvl {bp.level}
                               </span>
                             </div>
                           ))}
@@ -1141,6 +1164,7 @@ export function RunEncounters() {
           }}
           onClose={() => setSelectedBoss(null)}
           isPending={createBossResult.isPending}
+          hardcoreMode={run?.rules?.hardcoreMode}
         />
       )}