From 01f1d9da4463d37ed6d6437f6c7d63e2a7f97c74 Mon Sep 17 00:00:00 2001
From: Daniel Arroyo <darroylat@gmail.com>
Date: Mon, 24 Aug 2026 10:25:56 -0400
Subject: [PATCH] =?UTF-8?q?refactor(personajes):=20reorder=20capacity=20ta?=
 =?UTF-8?q?ble=20grouped=20by=20grade=20(D=E2=86=92S),=20rows=20SS/SPS/BSS?=
 =?UTF-8?q?=20per=20grade,=20rowspan=20grouping?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/META-INF/resources/static/css/app.css  |  7 +++++++
 .../resources/templates/PageResource/personajes.html | 12 ++++++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/main/resources/META-INF/resources/static/css/app.css b/src/main/resources/META-INF/resources/static/css/app.css
index 7c1c1fb..744d295 100644
--- a/src/main/resources/META-INF/resources/static/css/app.css
+++ b/src/main/resources/META-INF/resources/static/css/app.css
@@ -979,3 +979,10 @@ header {
 footer.container p {
   color: #8b5a00;
 }
+
+/* ============================================
+   CAPACITY TABLE — block separators
+   ============================================ */
+.cap-block-divider {
+  border-top: 2px solid var(--pico-muted-border-color);
+}
diff --git a/src/main/resources/templates/PageResource/personajes.html b/src/main/resources/templates/PageResource/personajes.html
index f61874b..2abad83 100644
--- a/src/main/resources/templates/PageResource/personajes.html
+++ b/src/main/resources/templates/PageResource/personajes.html
@@ -176,11 +176,15 @@
             </tr>
           </thead>
           <tbody>
-            <template x-for="t in shots.TIPOS" :key="'row-' + t">
-              <template x-for="g in shots.GRADOS" :key="'cell-' + t + '-' + g">
-                <tr>
+            <template x-for="g in shots.GRADOS" :key="'block-' + g">
+              <template x-for="t in shots.TIPOS" :key="'row-' + t + '-' + g">
+                <tr :class="g !== shots.GRADOS[0] && t === shots.TIPOS[0] ? 'cap-block-divider' : ''">
                   <td class="text-bold" x-text="t"></td>
-                  <td class="text-center"><span class="grade-badge" x-text="g"></span></td>
+                  <template x-if="t === shots.TIPOS[0]">
+                    <td :rowspan="shots.TIPOS.length" class="text-center" style="vertical-align: middle;">
+                      <span class="grade-badge" x-text="g"></span>
+                    </td>
+                  </template>
                   <td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 0))"></td>
                   <td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 1))"></td>
                   <td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 2))"></td>