store: iguala el carrito y el cuadro de ítem al diseño original

Comparado contra el store original (ultimowow /es/store-bennu) con una sesión
real: markup, CSS y clases que aplica su power.js. Cinco causas distintas:

- Los nombres de ítem salían azules: el layout declaraba `const whTooltips`,
  que queda en el ámbito léxico del script y NO crea propiedad en `window`,
  que es de donde tooltips.js lee la config -> se ignoraba entera. Ahora
  `window.whTooltips`, con colorLinks+iconizeLinks (el original no define
  whTooltips y usa esos defaults; sus enlaces acaban con clases `icontinyl q4`).
  renameLinks sigue en false: el texto sale de nuestra BD, en español.
- tooltips.js solo recorre el DOM al cargar, así que los enlaces que monta
  React (hoja del árbol, carrito) no se teñían. Se pasan por
  $WowheadPower.refreshLinks(), igual que hace el original tras cada AJAX.
- globals.css redefinía .item-box/.item-name/.item-img-box/.max-left-table2,
  que el tema nw-ryu ya trae del original, y con más especificidad ganaba la
  cascada. El peor: un `border-collapse` que anulaba el `border-spacing: 0 8px`
  del tema, que es lo que separa las filas del carrito.
- Faltaban la caja "Carrito - <REINO>" y "Personaje seleccionado: <nombre>"
  (coloreado por clase), que el original sí tiene.
- El total de la columna "Cant" mostraba el número de líneas en vez de la suma
  de cantidades: un ítem que entrega un mazo de 20 debe contar 20, no 1.

Verificado con navegador contra un build de producción: el nombre del ítem sale
con clases `icontinyl q4` y color rgb(163,53,238), el mismo valor exacto que
devuelve el original.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web-next/app/[locale]/layout.tsx

@@ -68,11 +68,20 @@ export default async function LocaleLayout({
         {/* Tema real de NovaWoW (nw-ryu). Va el ÚLTIMO para ganar la cascada. */}
         <link rel="stylesheet" href="/nw-themes/nw-ryu/nw-css/novawow-style.css?v=2" />
         {/* Config de los tooltips de wowhead (debe definirse antes de tooltips.js).
-            Solo tooltips: no recolorea/renombra/iconiza nuestros enlaces. El idioma
-            del tooltip lo da el subdominio del enlace (es./www.). */}
+            OJO con el `window.`: tooltips.js lee `window.whTooltips`, y un `const` a
+            nivel de script queda en el ámbito léxico del script (no crea propiedad en
+            window), así que la config se ignoraba entera y valían los valores por
+            defecto de wowhead.
+            `colorLinks` tiñe cada enlace según la calidad del ítem e `iconizeLinks` le
+            antepone el icono pequeño: los dos replican lo que hace el store original
+            (sus enlaces acaban con las clases `icontinyl q4`). Sin colorLinks los
+            nombres caen al `a{color:#2471a9}` del tema y salen todos azules.
+            `renameLinks` NO: el texto de los enlaces es el nombre de nuestra BD (en
+            español), y wowhead lo sobreescribiría. El idioma del tooltip lo da el
+            subdominio del enlace (es./www.). */}
         <script
           dangerouslySetInnerHTML={{
-            __html: 'const whTooltips={colorLinks:false,iconizeLinks:false,renameLinks:false};',
+            __html: 'window.whTooltips={colorLinks:true,iconizeLinks:true,renameLinks:false};',
           }}
         />
       </head>

web-next/app/[locale]/store/page.tsx

@@ -57,6 +57,7 @@ export default async function StorePage({ params }: { params: Promise<{ locale:
         characters={chars.map((c) => ({ name: c.name, classCss: c.classCss }))}
         dp={balances.dp}
         vp={balances.vp}
+        realm={realm}
       />
     </PageShell>
   )

web-next/app/globals.css

@@ -538,38 +538,29 @@ textarea:focus {
 #store-list span.store-cat i,
 #store-list span.store-subcat i,
 #store-list span.store-sub-subcat i { transition: transform .2s; margin-right: 4px; }
-/* Rejilla de objetos dentro de una hoja (visible: React solo la monta al abrir) */
+/* Rejilla de objetos dentro de una hoja. El tema YA define .item-box, .item-name,
+   .item-img-box y .item-box hr igual que el original: no se redefinen aquí (hacerlo
+   con `#store-list ...` gana la cascada y descuadra el cuadro del ítem). Lo único
+   que hace falta es deshacer el `display:none` con el que el tema oculta .item-list
+   (el original la revelaba con jQuery; aquí la monta React) y reponer el hueco entre
+   cajas: el PHP dejaba espacios en blanco entre los inline-block y JSX no los emite,
+   así que se imita con column-gap (el vertical ya lo da el margin del tema). */
 #store-list .item-list {
   display: flex !important;
   flex-wrap: wrap;
-  gap: 10px;
-  justify-content: center;
+  align-items: flex-start;
+  gap: 0 5px;
   margin: 8px 0 8px 10px;
 }
-#store-list .item-box {
-  width: 150px;
-  border: 2px solid #352e2b;
-  border-radius: 8px;
-  background: rgba(0, 0, 0, 0.25);
-  padding: 10px 8px;
-  text-align: center;
-}
-#store-list .item-box .item-img-box { width: 44px; height: 44px; border-radius: 6px; }
-#store-list .item-box .item-name { margin: 4px 0; min-height: 32px; }
-#store-list .item-box hr { margin: 6px 0; border-color: #352e2b; }
 /* El tema esconde #store-div y los <ul> anidados (`display:none`) porque el store
    original los revelaba con jQuery (.show()/slideToggle()). Aquí la visibilidad la
    decide React montándolos, así que hay que deshacer ese display:none del tema
    (que se carga después y gana la cascada). */
 #store-div { margin-top: 14px; display: block !important; }
 
-/* Carrito */
-#cart-list { margin-top: 16px; }
-#cart-list table.max-left-table2 { width: 100%; max-width: 620px; margin: 0 auto; border-collapse: collapse; }
-#cart-list th, #cart-list td { padding: 6px 8px; }
-#cart-list th.justified, #cart-list td.justified { text-align: left; }
-#cart-list .icon-td { text-align: center; width: 42px; }
-#cart-list .width-50-td { width: 50%; }
+/* Carrito: el tema ya trae .max-left-table2 (width 95% + border-spacing 0 8px, que
+   es lo que separa las filas), .icon-td, .width-50-td y .justified del original.
+   No se pisan: el `border-collapse` que había aquí anulaba ese border-spacing. */
 
 /* Modal de resultado */
 .modal-div {