Armería: PvP campos de batalla, logros por categoría, bandas/mazmorras y página de hermandad

- PvP: pestaña Campos de batalla (pvpstats) con resultado, stats por partida y fecha/hora.
- Logros: rejilla por categoría con anillos de progreso + detalle por categoría
  (datos de Achievement.db2 + Achievement_Category.db2, iconos vía wowhead).
- Bandas: progreso por dificultad (10/25/heroico) con jefes reales de DungeonEncounter.db2
  y tooltip de jefes; agrupado por expansión (Clásico/TBC/WotLK).
- Mazmorras: mismo sistema, Normal + Heroico, Clásico/TBC/WotLK.
- Página de hermandad estilo armería: cabecera (emblema, puntos = unión de logros de
  miembros sin duplicar, nº miembros, fundada), pestañas Hermandad/Logros, roster con
  iconos de clase/raza, columna Función (rol por spec), filtros clase/función,
  orden por rango/puntos/nivel de objeto/nivel/nombre, paginación.
- Barra lateral: mensaje diario con login (iron-session, gated por pertenencia),
  logros recientes y desgloses de clases y funciones.
- Cabecera de personaje: enlace a la hermandad + nombre del reino.

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

web-next/components/ArmoryTabs.tsx

@@ -0,0 +1,38 @@
+'use client'
+
+import { useState, type ReactNode } from 'react'
+
+export type ArmoryTab = { key: string; label: string; icon?: string; count?: number; content: ReactNode }
+
+/**
+ * Pestañas de la ficha de armería (Equipación / Talentos / Logros / …). Cada pestaña
+ * se renderiza en el servidor y se pasa como contenido; aquí solo se conmuta cuál se
+ * muestra. Se mantienen todas montadas (hidden) para no reinicializar el visor 3D.
+ */
+export function ArmoryTabs({ tabs }: { tabs: ArmoryTab[] }) {
+  const [active, setActive] = useState(tabs[0]?.key)
+
+  return (
+    <div className="armory-ctabs">
+      <div className="armory-ctabbar">
+        {tabs.map((tb) => (
+          <button
+            key={tb.key}
+            type="button"
+            className={`armory-ctab${tb.key === active ? ' active' : ''}`}
+            onClick={() => setActive(tb.key)}
+          >
+            {tb.icon ? <i className={tb.icon} /> : null}
+            <span>{tb.label}</span>
+            {typeof tb.count === 'number' ? <span className="armory-ctab-count">{tb.count}</span> : null}
+          </button>
+        ))}
+      </div>
+      {tabs.map((tb) => (
+        <div key={tb.key} className="armory-ctab-panel" hidden={tb.key !== active}>
+          {tb.content}
+        </div>
+      ))}
+    </div>
+  )
+}